From c531a91162686f730a68dbbf1a60266ec1eadb8a Mon Sep 17 00:00:00 2001
From: Robert Goldmann <deadlocker@gmx.de>
Date: Sun, 15 Nov 2020 17:00:33 +0100
Subject: [PATCH] Fixed #518 - fill first use page

---
 .../controller/IndexController.java           |   2 +-
 .../resources/languages/base_de.properties    |  31 ++++-
 .../resources/languages/base_en.properties    |  31 ++++-
 src/main/resources/templates/firstUse.ftl     | 109 ++++++++++++++++++
 src/main/resources/templates/index.ftl        |   2 +-
 .../resources/templates/indexFunctions.ftl    |  13 +++
 6 files changed, 184 insertions(+), 4 deletions(-)
 create mode 100644 src/main/resources/templates/firstUse.ftl

diff --git a/src/main/java/de/deadlocker8/budgetmaster/controller/IndexController.java b/src/main/java/de/deadlocker8/budgetmaster/controller/IndexController.java
index 1062ee4fe..b2fe115a9 100644
--- a/src/main/java/de/deadlocker8/budgetmaster/controller/IndexController.java
+++ b/src/main/java/de/deadlocker8/budgetmaster/controller/IndexController.java
@@ -30,6 +30,6 @@ public class IndexController extends BaseController
 	public String firstUse(Model model)
 	{
 		model.addAttribute("settings", settingsService.getSettings());
-		return "index";
+		return "firstUse";
 	}
 }
\ No newline at end of file
diff --git a/src/main/resources/languages/base_de.properties b/src/main/resources/languages/base_de.properties
index 9062dbd5f..c1afd4b91 100644
--- a/src/main/resources/languages/base_de.properties
+++ b/src/main/resources/languages/base_de.properties
@@ -326,7 +326,8 @@ filter.tags.button.all=Alle
 filter.tags.button.none=Keine
 
 # home menu
-home.first.use=Neu im BudgetMaster? Sieh dir die Einführung an!
+home.first.use.teaser=Neu im BudgetMaster? Sieh dir die Einführung an!
+home.first.use=Tipps für die erste Benutzung
 
 home.menu.accounts=Konten erlauben es mehrere Buchungen zu gruppieren. Du kannst so viele Konten erstellen, wie du möchtest.
 home.menu.accounts.action.manage=Kontoverwaltung
@@ -353,6 +354,34 @@ home.menu.categories.action.new=Neue Kategorie anlegen
 home.menu.settings=Verwalte allgemeine Einstellungen wie dein Login-Passwort, deine bevorzugte Sprache und wie Updates verwaltet werden sollen. Dieser Bereich bietet zudem die Möglichkeit, deine Daten zu exportieren oder zu löschen, sowie eine bestehende Datenbank zu importieren.
 home.menu.settings.action.manage=Einstellungen
 
+home.first.use.step.1.headline=Step 1: Konten erstellen
+home.first.use.step.1.contentText=BudgetMaster erstellt beim ersten Start automatisch ein Standardkonto.<br>Um besser an deine Bedürfnissen angepasst zu sein kannst es umbenennen oder zusätzliche Konten anlegen.
+
+home.first.use.step.2.headline=Step 2: Kategorien erstellen
+home.first.use.step.2.contentText=Kategorien können Buchungen zugeordnet werden, um diese als zusammengehörig zu kennzeichnen.<br>Erstelle einige Kategorien, um sie später verwenden zu können.
+
+home.first.use.step.3.headline=Step 3: Deinen aktuellen Kontostand übertragen
+home.first.use.step.3.contentText=In den meisten Fällen wirst du BudgetMaster erst verwenden, nachdem dein Bankkonto angelegt wurde und bereits einige Buchungen getätigt wurden.<br>Um deinen aktuellen Kontostand zu übertragen, lege eine neue normale Buchung an:
+home.first.use.step.3.sub.1=Markiere die Transaktion als Einnahme oben auf der Seite.
+home.first.use.step.3.sub.2=Gib einen Namen ein, z.B. "Initialer Kontostand".
+home.first.use.step.3.sub.3=Lege den Betrag auf deinen aktuellen Kontostand fest.
+home.first.use.step.3.sub.4=Überlege, welches das erste Datum ist, dass du in BudgetMaster verwalten möchtest. Setze das Datum der Buchung auf einen Wert vor diesem Datum.
+home.first.use.step.3.sub.5=Wähle das gewünschte Konto.
+home.first.use.step.3.sub.6=Speichere die Buchung.
+
+home.first.use.step.4.headline=Step 4: Buchungen erstellen
+home.first.use.step.4.contentText=Buchungen werden in drei Kategorien gruppiert:
+home.first.use.step.4.sub.1=Normale Buchungen - Einfache Buchungen (Einnahmen/Ausgaben)
+home.first.use.step.4.sub.2=Wiederholende Buchungen - Widerholen sich automatisch in einem bestimmten Intervall
+home.first.use.step.4.sub.3=Umbuchungen - Beträge zwischen Konten übertragen
+
+home.first.use.step.5.headline=Step 5: Erkunden!
+home.first.use.step.5.contentText=Nachdem du nun die Grundlagen von BudgetMaster kennengelernt hast entdecke auch die restlichen Funktionen:
+home.first.use.step.5.sub.1=Beschleunige die Erstellung von Buchungen.
+home.first.use.step.5.sub.2=Verwende eines der vordefinierten Diagramme oder erstelle dein eigenes, indem du das Diagramm-framework zur Visualisierung und Analyse deiner Daten verwendest.
+home.first.use.step.5.sub.3=Erstelle konfigurierbare Monatsberichte im PDF-Format zum Drucken und Archivieren.
+home.first.use.step.5.sub.4=und vieles mehr...
+
 # hotkeys
 hotkeys.transactions.new.normal=Neue Buchung anlegen
 hotkeys.transactions.new.normal.key=n
diff --git a/src/main/resources/languages/base_en.properties b/src/main/resources/languages/base_en.properties
index f51f9a3d5..923934dcb 100644
--- a/src/main/resources/languages/base_en.properties
+++ b/src/main/resources/languages/base_en.properties
@@ -325,7 +325,8 @@ filter.tags.button.all=All
 filter.tags.button.none=None
 
 # home menu
-home.first.use=New to BudgetMaster? Check out the introduction!
+home.first.use.teaser=New to BudgetMaster? Check out the first use guide!
+home.first.use=First use guide
 
 home.menu.accounts=Accounts allow you to group multiple transactions. You can create as many accounts as you want.
 home.menu.accounts.action.manage=Manage accounts
@@ -352,6 +353,34 @@ home.menu.categories.action.new=Create a category
 home.menu.settings=Manage general settings such as login password, your preferred language and how to handle updates. This section also offers the possibility to export or delete your data or importing an existing database.
 home.menu.settings.action.manage=Settings
 
+home.first.use.step.1.headline=Step 1: Create accounts
+home.first.use.step.1.contentText=BudgetMaster will automatically create a default account on first start.<br>In order to fit your needs you may want to rename it or create additional accounts.
+
+home.first.use.step.2.headline=Step 2: Create categories
+home.first.use.step.2.contentText=Categories can be assigned to transactions in order to mark them as belonging together.<br>Create some categories to be used later.
+
+home.first.use.step.3.headline=Step 3: Insert your current account balance
+home.first.use.step.3.contentText=In most cases you will start using BudgetMaster after your bank account was created and there are already some transactions made.<br>To transfer your current account balance create a new normal transaction:
+home.first.use.step.3.sub.1=Mark the transaction as income on the top of the page.
+home.first.use.step.3.sub.2=Type a name, e.g. "start account balance"
+home.first.use.step.3.sub.3=Set the amount to your current account balance.
+home.first.use.step.3.sub.4=Decide which is the first date you want track in BudgetMaster. Set the transaction date to a value before this date.
+home.first.use.step.3.sub.5=Select the desired account.
+home.first.use.step.3.sub.6=Save the transaction.
+
+home.first.use.step.4.headline=Step 4: Create transactions
+home.first.use.step.4.contentText=Transactions are grouped into three categories:
+home.first.use.step.4.sub.1=Normal transactions - Basic transactions (incomes/expenditures)
+home.first.use.step.4.sub.2=Recurring transactions - Automatically repeat on a given interval
+home.first.use.step.4.sub.3=Transfer transactions - Transfer amounts between accounts
+
+home.first.use.step.5.headline=Step 5: Explore!
+home.first.use.step.5.contentText=Now that you now the fundamentals of BudgetMaster, go and discover the remaining features:
+home.first.use.step.5.sub.1=Speed up your transaction creation process.
+home.first.use.step.5.sub.2=Use one of the pre-defined charts or create your one by using the chart framework to visualize and analyze your data.
+home.first.use.step.5.sub.3=Create configurable month reports in PDF format for printing and archiving.
+home.first.use.step.5.sub.4=and much more...
+
 # hotkeys
 hotkeys.transactions.new.normal=Create a transaction
 hotkeys.transactions.new.normal.key=n
diff --git a/src/main/resources/templates/firstUse.ftl b/src/main/resources/templates/firstUse.ftl
new file mode 100644
index 000000000..a0be6cc78
--- /dev/null
+++ b/src/main/resources/templates/firstUse.ftl
@@ -0,0 +1,109 @@
+<html>
+    <head>
+        <#import "helpers/header.ftl" as header>
+        <@header.header "BudgetMaster"/>
+        <#import "/spring.ftl" as s>
+    </head>
+    <body class="budgetmaster-blue-light">
+        <#import "helpers/navbar.ftl" as navbar>
+        <@navbar.navbar "home" settings/>
+
+        <#import "indexFunctions.ftl" as indexFunctions>
+
+        <main>
+            <div class="card main-card background-color">
+                <div class="container">
+                    <div class="section center-align">
+                        <div class="headline"><i class="fas fa-graduation-cap"></i> ${locale.getString("home.first.use")}</div>
+                    </div>
+                </div>
+                <br>
+
+                <div class="container">
+                    <div class="container center-align">
+                        <div class="row left-align">
+                            <div class="col s12">
+                                <@indexFunctions.stepContent headline="home.first.use.step.1.headline" contentText="home.first.use.step.1.contentText" actionUrl="/accounts" actionName="home.menu.accounts.action.manage"/>
+                            </div>
+                        </div>
+                        <hr>
+
+                        <div class="row left-align">
+                            <div class="col s12">
+                                <@indexFunctions.stepContent headline="home.first.use.step.2.headline" contentText="home.first.use.step.2.contentText" actionUrl="/categories" actionName="home.menu.categories.action.manage"/>
+                            </div>
+                        </div>
+                        <hr>
+
+                        <div class="row left-align">
+                            <div class="col s12">
+                                <@indexFunctions.stepContent headline="home.first.use.step.3.headline" contentText="home.first.use.step.3.contentText" actionUrl="/transactions/newTransaction/normal" actionName="home.menu.transactions.action.new">
+                                    <ul class="browser-default">
+                                        <li>${locale.getString("home.first.use.step.3.sub.1")}</li>
+                                        <li>${locale.getString("home.first.use.step.3.sub.2")}</li>
+                                        <li>${locale.getString("home.first.use.step.3.sub.3")}</li>
+                                        <li>${locale.getString("home.first.use.step.3.sub.4")}</li>
+                                        <li>${locale.getString("home.first.use.step.3.sub.5")}</li>
+                                        <li>${locale.getString("home.first.use.step.3.sub.6")}</li>
+                                    </ul>
+                                </@indexFunctions.stepContent>
+                            </div>
+                        </div>
+                        <hr>
+
+                        <div class="row left-align">
+                            <div class="col s12">
+                                <@indexFunctions.stepContent headline="home.first.use.step.4.headline" contentText="home.menu.transactions" actionUrl="/transactions" actionName="home.menu.transactions.action.manage">
+                                    <br>
+                                    ${locale.getString("home.first.use.step.4.contentText")}
+                                    <ul class="browser-default">
+                                        <li>${locale.getString("home.first.use.step.4.sub.1")}</li>
+                                        <li>${locale.getString("home.first.use.step.4.sub.2")}</li>
+                                        <li>${locale.getString("home.first.use.step.4.sub.3")}</li>
+                                    </ul>
+                                </@indexFunctions.stepContent>
+                            </div>
+                        </div>
+                        <hr>
+
+                        <div class="row left-align">
+                            <div class="col s12">
+                                <@indexFunctions.stepContent headline="home.first.use.step.5.headline" contentText="home.first.use.step.5.contentText" actionUrl="" actionName="">
+                                    <h5>${locale.getString("menu.templates")}</h5>
+                                    <p>
+                                        ${locale.getString("home.first.use.step.5.sub.1")}
+                                    </p>
+                                    <p>
+                                        <@indexFunctions.action url="/templates" name="home.menu.templates.action.manage"/>
+                                    </p>
+
+                                    <h5>${locale.getString("menu.charts")}</h5>
+                                    <p>
+                                        ${locale.getString("home.first.use.step.5.sub.2")}
+                                    </p>
+                                    <p>
+                                        <@indexFunctions.action url="/charts/manage" name="home.menu.charts.action.manage"/>
+                                    </p>
+
+                                    <h5>${locale.getString("menu.reports")}</h5>
+                                    <p>
+                                        ${locale.getString("home.first.use.step.5.sub.3")}
+                                    </p>
+                                    <p>
+                                        <@indexFunctions.action url="/reports" name="home.menu.reports.action.new"/>
+                                    </p>
+
+                                    <h5>${locale.getString("home.first.use.step.5.sub.4")}</h5>
+                                </@indexFunctions.stepContent>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </main>
+
+        <!--  Scripts-->
+        <#import "helpers/scripts.ftl" as scripts>
+        <@scripts.scripts/>
+    </body>
+</html>
diff --git a/src/main/resources/templates/index.ftl b/src/main/resources/templates/index.ftl
index 00103da87..8d26f6690 100644
--- a/src/main/resources/templates/index.ftl
+++ b/src/main/resources/templates/index.ftl
@@ -28,7 +28,7 @@
                                 <table class="no-border-table">
                                     <tr>
                                         <td><i class="fas fa-graduation-cap"></i></td>
-                                        <td>${locale.getString("home.first.use")}</td>
+                                        <td>${locale.getString("home.first.use.teaser")}</td>
                                     </tr>
                                 </table>
                             </a>
diff --git a/src/main/resources/templates/indexFunctions.ftl b/src/main/resources/templates/indexFunctions.ftl
index 5b11a9a28..e729977e0 100644
--- a/src/main/resources/templates/indexFunctions.ftl
+++ b/src/main/resources/templates/indexFunctions.ftl
@@ -16,4 +16,17 @@
 
 <#macro action url name>
     <a href="<@s.url url/>" class="waves-effect btn-flat home-menu-link-item"><i class="material-icons left">play_arrow</i>${locale.getString(name)}</a>
+</#macro>
+
+<#macro stepContent headline contentText actionUrl, actionName>
+    <h5>${locale.getString(headline)}</h5>
+    <p>
+        ${locale.getString(contentText)}
+        <#nested>
+    </p>
+    <p>
+        <#if actionUrl?has_content>
+            <@indexFunctions.action url=actionUrl name=actionName/>
+        </#if>
+    </p>
 </#macro>
\ No newline at end of file
-- 
GitLab