#391 - added fade animations

src/main/resources/static/js/globalDatePicker.js

@@ -27,11 +27,12 @@ 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) {
+    $("#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;
@@ -45,12 +46,16 @@ function updateYearGrid(modifier, currentYear) {
                 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) {

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>

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(".");

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">