From 7d07f43e5346db8a651c8af82391e0d823b6256f Mon Sep 17 00:00:00 2001
From: Robert Goldmann <deadlocker@gmx.de>
Date: Mon, 21 Jan 2019 19:43:07 +0100
Subject: [PATCH] #391 - added fade animations

---
 .../resources/static/js/globalDatePicker.js   | 35 +++++++++++--------
 .../{datePicker.ftl => globalDatePicker.ftl}  |  0
 .../resources/templates/reports/reports.ftl   |  2 +-
 .../templates/transactions/newTransaction.ftl |  2 +-
 .../templates/transactions/transactions.ftl   |  2 +-
 5 files changed, 23 insertions(+), 18 deletions(-)
 rename src/main/resources/templates/helpers/{datePicker.ftl => globalDatePicker.ftl} (100%)

diff --git a/src/main/resources/static/js/globalDatePicker.js b/src/main/resources/static/js/globalDatePicker.js
index 636083b4b..31084a321 100644
--- a/src/main/resources/static/js/globalDatePicker.js
+++ b/src/main/resources/static/js/globalDatePicker.js
@@ -27,30 +27,35 @@ var year;
 
 function cleanup() {
     year = undefined;
-    $("#global-datepicker-select-year").show();
     $("#global-datepicker-select-month").hide();
+    $("#global-datepicker-select-year").show();
 }
 
 function updateYearGrid(modifier, currentYear) {
-    var items = $("#global-datepicker-select-year .global-datepicker-item");
-    var firstYear = parseInt(items[0].innerText);
-    var newFirstYear = firstYear + modifier;
-
-    for (var i = 0; i < items.length; i++) {
-        items[i].innerText = newFirstYear + i;
-        if (items[i].innerText === currentYear) {
-            items[i].classList.add("global-datepicker-selected");
-        }
-        else {
-            items[i].classList.remove("global-datepicker-selected");
+    $("#global-datepicker-select-year").fadeOut(200, function () {
+        var items = $("#global-datepicker-select-year .global-datepicker-item");
+        var firstYear = parseInt(items[0].innerText);
+        var newFirstYear = firstYear + modifier;
+
+        for (var i = 0; i < items.length; i++) {
+            items[i].innerText = newFirstYear + i;
+            if (items[i].innerText === currentYear) {
+                items[i].classList.add("global-datepicker-selected");
+            }
+            else {
+                items[i].classList.remove("global-datepicker-selected");
+            }
         }
-    }
+
+        $("#global-datepicker-select-year").fadeIn(200);
+    });
 }
 
 function selectYear(selectedYear) {
     year = selectedYear;
-    $("#global-datepicker-select-year").hide();
-    $("#global-datepicker-select-month").show();
+    $("#global-datepicker-select-year").fadeOut(200, function () {
+        $("#global-datepicker-select-month").fadeIn(200);
+    });
 }
 
 function selectMonth(selectedMonth) {
diff --git a/src/main/resources/templates/helpers/datePicker.ftl b/src/main/resources/templates/helpers/globalDatePicker.ftl
similarity index 100%
rename from src/main/resources/templates/helpers/datePicker.ftl
rename to src/main/resources/templates/helpers/globalDatePicker.ftl
diff --git a/src/main/resources/templates/reports/reports.ftl b/src/main/resources/templates/reports/reports.ftl
index a62982fd2..323484c4e 100644
--- a/src/main/resources/templates/reports/reports.ftl
+++ b/src/main/resources/templates/reports/reports.ftl
@@ -12,7 +12,7 @@
 
         <main>
             <div class="card main-card background-color">
-                <#import "../helpers/datePicker.ftl" as datePicker>
+                <#import "../helpers/globalDatePicker.ftl" as datePicker>
                 <@datePicker.datePicker currentDate springMacroRequestContext.getRequestUri()/>
 
                 <br>
diff --git a/src/main/resources/templates/transactions/newTransaction.ftl b/src/main/resources/templates/transactions/newTransaction.ftl
index 2b8a49b75..d1561fbc1 100644
--- a/src/main/resources/templates/transactions/newTransaction.ftl
+++ b/src/main/resources/templates/transactions/newTransaction.ftl
@@ -344,7 +344,7 @@
         </main>
 
         <!-- Pass localization to JS -->
-        <#import "../helpers/datePicker.ftl" as datePicker>
+        <#import "../helpers/globalDatePicker.ftl" as datePicker>
         <@datePicker.datePickerLocalization/>
         <script>
             startDate = "${startDate}".split(".");
diff --git a/src/main/resources/templates/transactions/transactions.ftl b/src/main/resources/templates/transactions/transactions.ftl
index 828adaa66..cb98175de 100644
--- a/src/main/resources/templates/transactions/transactions.ftl
+++ b/src/main/resources/templates/transactions/transactions.ftl
@@ -12,7 +12,7 @@
 
         <main>
             <div class="card main-card background-color">
-                <#import "../helpers/datePicker.ftl" as datePicker>
+                <#import "../helpers/globalDatePicker.ftl" as datePicker>
                 <@datePicker.datePicker currentDate springMacroRequestContext.getRequestUri()/>
                 <div class="container">
                     <div class="row">
-- 
GitLab