From 6f434c67107245e2ebbbc2dcef78499d3bc1a8c0 Mon Sep 17 00:00:00 2001
From: Robert Goldmann <deadlocker@gmx.de>
Date: Thu, 18 Jul 2019 21:22:29 +0200
Subject: [PATCH] #435 - new chart page: pre fill with default script; added
link to wiki
---
src/main/resources/languages/_de.properties | 35 ++++++++++++++++--
src/main/resources/languages/_en.properties | 36 +++++++++++++++++--
.../templates/charts/chartFunctions.ftl | 15 +++++++-
.../resources/templates/charts/newChart.ftl | 20 +++++------
4 files changed, 89 insertions(+), 17 deletions(-)
diff --git a/src/main/resources/languages/_de.properties b/src/main/resources/languages/_de.properties
index 9a3fa0249..8b1dabb0e 100644
--- a/src/main/resources/languages/_de.properties
+++ b/src/main/resources/languages/_de.properties
@@ -332,7 +332,9 @@ charts.default.categoryBudget=Verbrauch nach Kategorien
chart.new.label.name=Name
chart.new.label.script=Script
-chart.new.info.default=Diese mitgeliefert Diagrammvorlage kann nicht �berschrieben werden, aber du kannst dir den Code ansehen.
+chart.new.info.default=Diese mitgelieferte Diagrammvorlage kann nicht �berschrieben werden, aber du kannst dir den Code ansehen.
+chart.new.info.wiki=Tutorial: <a href="https://github.com/deadlocker8/BudgetMaster/wiki/How-to-create-custom-charts">https://github.com/deadlocker8/BudgetMaster/wiki/How-to-create-custom-charts</a
+
chart.type=Typ
chart.actions=Aktionen
chart.show=Diagramm anzeigen
@@ -342,4 +344,33 @@ chart.steps.first.label=Diagramm
chart.steps.second=Schritt 2: W�hle eine Zeitspanne
chart.steps.second.label.start=Startdatum
chart.steps.second.label.end=Enddatum
-chart.steps.third=Schritt 3: Wende Filter an (optional)
\ No newline at end of file
+chart.steps.third=Schritt 3: Wende Filter an (optional)
+
+chart.script.default=/* This list will be dynamically filled with all the transactions between\n \
+* the start and and date you select on the "Show Chart" page\n \
+* and filtered according to your specified filter.\n \
+* An example entry for this list and tutorial about how to create custom charts ca be found in the BudgetMaster wiki:\n \
+* https://github.com/deadlocker8/BudgetMaster/wiki/How-to-create-custom-charts\n \
+*/\n \
+var transactionData = '{''}';\n \
+\n \
+// Prepare your chart settings here (mandatory)\n \
+var plotlyData = ['{'\n \
+\tx: [],\n \
+\ty: [],\n \
+\ttype: 'bar'\n \
+'}'];\n \
+\n \
+// Add your Plotly layout settings here (optional)\n \
+var plotlyLayout = '{''}';\n \
+\n \
+// Add your Plotly configuration settings here (optional)\n \
+var plotlyConfig = '{'\n \
+\tshowSendToCloud: false,\n \
+\tdisplaylogo: false,\n \
+\tshowLink: false,\n \
+\tresponsive: true\n \
+'}';\n \
+\n \
+// Don't touch this line\n \
+Plotly.newPlot('chart-canvas', plotlyData, plotlyLayout, plotlyConfig);
diff --git a/src/main/resources/languages/_en.properties b/src/main/resources/languages/_en.properties
index 814c6dee1..0804b8d24 100644
--- a/src/main/resources/languages/_en.properties
+++ b/src/main/resources/languages/_en.properties
@@ -109,7 +109,7 @@ info.database.import.or=or
info.title.update=Update available
info.text.update=An update for BudgetMaster is available<br><br>Installed: v{0}<br>Available: {1}<br><br>Would you like to update now?<br><br>Note: The update may take a while depending on your internet connection. The BudgetMaster server will be restarted automatically. Please do not make any changes to accounts, transactions, categories, etc. after starting the update.
info.title.backup.reminder=Time for a backup
-info.text.backup.reminder=Have you ever thought about a backup?<br>You should back up your BudgetMaster database regularly.<br>This can be donee on the settings page.<br><br>(You don't want to see this reminder every month? Disable the backup reminder in the settings.)
+info.text.backup.reminder=Have you ever thought about a backup?<br>You should back up your BudgetMaster database regularly.<br>This can be donee on the settings page.<br><br>(You don''t want to see this reminder every month? Disable the backup reminder in the settings.)
info.button.backup.reminder=To the settings
# WARNING
@@ -332,7 +332,8 @@ charts.default.categoryBudget=Consumption by categories
chart.new.label.name=Name
chart.new.label.script=Script
-chart.new.info.default=This default chart can\'t be overwritten but you can have a look on how it's implemented.
+chart.new.info.default=This default chart can''t be overwritten but you can have a look on how it''s implemented.
+chart.new.info.wiki=Tutorial: <a href="https://github.com/deadlocker8/BudgetMaster/wiki/How-to-create-custom-charts">https://github.com/deadlocker8/BudgetMaster/wiki/How-to-create-custom-charts</a
chart.type=Type
chart.actions=Actions
chart.show=Show chart
@@ -342,4 +343,33 @@ chart.steps.first.label=Chart
chart.steps.second=Step 2: Choose a date range
chart.steps.second.label.start=Start date
chart.steps.second.label.end=End date
-chart.steps.third=Step 3: Apply filters (optional)
\ No newline at end of file
+chart.steps.third=Step 3: Apply filters (optional)
+
+chart.script.default=/* This list will be dynamically filled with all the transactions between\n \
+* the start and and date you select on the "Show Chart" page\n \
+* and filtered according to your specified filter.\n \
+* An example entry for this list and tutorial about how to create custom charts ca be found in the BudgetMaster wiki:\n \
+* https://github.com/deadlocker8/BudgetMaster/wiki/How-to-create-custom-charts\n \
+*/\n \
+var transactionData = '{''}';\n \
+\n \
+// Prepare your chart settings here (mandatory)\n \
+var plotlyData = ['{'\n \
+\tx: [],\n \
+\ty: [],\n \
+\ttype: 'bar'\n \
+'}'];\n \
+\n \
+// Add your Plotly layout settings here (optional)\n \
+var plotlyLayout = '{''}';\n \
+\n \
+// Add your Plotly configuration settings here (optional)\n \
+var plotlyConfig = '{'\n \
+\tshowSendToCloud: false,\n \
+\tdisplaylogo: false,\n \
+\tshowLink: false,\n \
+\tresponsive: true\n \
+'}';\n \
+\n \
+// Don't touch this line\n \
+Plotly.newPlot('chart-canvas', plotlyData, plotlyLayout, plotlyConfig);
diff --git a/src/main/resources/templates/charts/chartFunctions.ftl b/src/main/resources/templates/charts/chartFunctions.ftl
index 146874f2e..4e027ab28 100644
--- a/src/main/resources/templates/charts/chartFunctions.ftl
+++ b/src/main/resources/templates/charts/chartFunctions.ftl
@@ -8,4 +8,17 @@
<#else>
<#return "">
</#if>
-</#function>
\ No newline at end of file
+</#function>
+
+<#macro infoMessage text>
+ <div class="row no-margin-bottom">
+ <div class="col s12 center-align">
+ <table class="text-color login-message no-border-table">
+ <tr>
+ <td><i class="material-icons">info</i></td>
+ <td>${text}</td>
+ </tr>
+ </table>
+ </div>
+ </div>
+</#macro>
\ No newline at end of file
diff --git a/src/main/resources/templates/charts/newChart.ftl b/src/main/resources/templates/charts/newChart.ftl
index d2035fdce..f620933b4 100644
--- a/src/main/resources/templates/charts/newChart.ftl
+++ b/src/main/resources/templates/charts/newChart.ftl
@@ -8,6 +8,8 @@
<#import "../helpers/navbar.ftl" as navbar>
<@navbar.navbar "charts" settings/>
+ <#import "chartFunctions.ftl" as chartFunctions>
+
<main>
<div class="card main-card background-color">
<div class="container">
@@ -29,10 +31,15 @@
</div>
</div>
+ <!-- info message with link to wiki on how to create custom charts -->
+ <#if (chart.getType().name() == "CUSTOM")>
+ <@chartFunctions.infoMessage locale.getString("chart.new.info.wiki")/>
+ </#if>
+
<#-- script -->
<div class="row">
<div class="input-field col s12 m12 l8 offset-l2">
- <textarea id="chart-script" name="script" <@validation.validation "script" "materialize-textarea"/>><#if chart.getScript()??>${chart.getScript()}</#if></textarea>
+ <textarea id="chart-script" name="script" <@validation.validation "script" "materialize-textarea"/>><#if chart.getScript()??>${chart.getScript()}<#else>${locale.getString("chart.script.default")}</#if></textarea>
<label for="chart-script">${locale.getString("chart.new.label.script")}</label>
</div>
</div>
@@ -41,16 +48,7 @@
<#-- info message if chart is not editable -->
<#if (chart.getType().name() == "DEFAULT")>
- <div class="row no-margin-bottom">
- <div class="col s12 center-align">
- <table class="text-color login-message no-border-table">
- <tr>
- <td><i class="material-icons">info</i></td>
- <td id="loginMessage">${locale.getString("chart.new.info.default")}</td>
- </tr>
- </table>
- </div>
- </div>
+ <@chartFunctions.infoMessage locale.getString("chart.new.info.default")/>
</#if>
<#-- buttons -->
--
GitLab