From 299d98b3f0316cf6e337d97a3a0fe442dbc3d214 Mon Sep 17 00:00:00 2001
From: Baptiste Lemoine <baptiste.lemoine@ext.ercom.fr>
Date: Tue, 28 Aug 2018 11:15:07 +0200
Subject: [PATCH] debounce to save

---
 .../views/logged/previsionnel.html.twig       | 17 +++++------
 assets/js/parts/main.js                       | 28 +++++++++++--------
 caisse-bliss-frontend                         |  1 -
 3 files changed, 25 insertions(+), 21 deletions(-)
 delete mode 160000 caisse-bliss-frontend

diff --git a/app/Resources/views/logged/previsionnel.html.twig b/app/Resources/views/logged/previsionnel.html.twig
index 1185e606..328867b0 100755
--- a/app/Resources/views/logged/previsionnel.html.twig
+++ b/app/Resources/views/logged/previsionnel.html.twig
@@ -13,7 +13,8 @@
             <div class="col-xs-12 col-md-6">
 
             <div ng-if="config.initialLoadingDone && config.loading">
-            Chargement ...
+            <i class="fa fa-spin fa-refresh"></i>
+            Chargement
             </div>
             <div ng-if="config.initialLoadingDone && !config.loading">
             Modifications sauvegardées
@@ -30,11 +31,11 @@
                             <p class="padded">
 
                             Euros disponibles au départ:
-                            <input type="number" ng-model="config.disponibility" ng-change="save()">
+                            <input type="number" ng-model="config.disponibility" ng-change="save()" ng-model-options="{ debounce: config.debounceTime }">
 <br>
 
                              Gains moyen par mois:
-                            <input type="number" ng-model="config.averageMonthlyEarnings" ng-disabled="config.isSaving">
+                            <input type="number" ng-model="config.averageMonthlyEarnings" ng-change="save()" ng-disabled="config.isSaving" ng-model-options="{ debounce: config.debounceTime }">
 </p>
                             <p>
                             <p>
@@ -101,20 +102,20 @@
                                 </tbody>
                                 <tr ng-repeat="e in expenses ">
                                     <td>
-                                         <input type="text" ng-model="e.name" ng-change="save()">
+                                         <input type="text" ng-model="e.name" ng-change="save()" ng-model-options="{ debounce: config.debounceTime }">
                                     </td>
                                     <td ng-if="config.showDelays">
 
-                                        <input type="number" ng-model="e.delay" ng-change="save()">
+                                        <input type="number" ng-model="e.delay" ng-change="save()" ng-model-options="{ debounce: config.debounceTime }">
                                     </td>
                                     <td ng-if="config.showRepeats">
-                                        <input type="number" ng-model="e.repeat" ng-change="save()">
+                                        <input type="number" ng-model="e.repeat" ng-change="save()" ng-model-options="{ debounce: config.debounceTime }">
                                     </td>
                                     <td ng-if="config.showRepeats" class="text-right padded">
                                         {{ e.repeat * e.amount }}
                                     </td>
                                     <td>
-                                        <input type="number" ng-model="e.amount" ng-change="save()">
+                                        <input type="number" ng-model="e.amount" ng-change="save()" ng-model-options="{ debounce: config.debounceTime }">
                                     </td>
                                     <td class="text-right padded">
                                         <strong>
@@ -124,7 +125,7 @@
                                         €
                                     </td>
                                     <td class="padded">
-                                    <input type="checkbox" ng-model="e.enabled" ng-change="save()">
+                                    <input type="checkbox" ng-model="e.enabled" ng-change="save()" ng-model-options="{ debounce: config.debounceTime }">
 </td>
                                 </tr>
                             </table>
diff --git a/assets/js/parts/main.js b/assets/js/parts/main.js
index b8c4926f..66005cec 100755
--- a/assets/js/parts/main.js
+++ b/assets/js/parts/main.js
@@ -229,6 +229,7 @@ angular
             initialLoadingDone: false,
             loading: false,
             lines: 24,
+            debounceTime: 300, // miliseconds to wait before updating model and saving changes
             /**
              * expenses kind of the user
              */
@@ -288,6 +289,19 @@ angular
             return previsionTable;
         };
 
+        $scope.updateconf = (rep) => {
+            $scope.config.loading = false;
+            $scope.config.initialLoadingDone = true;
+            $scope.config.disponibility = rep.data.disponibility;
+            $scope.config.averageMonthlyEarnings = rep.data.averageMonthlyEarnings;
+            // default data when user has nothing saved
+            console.log('rep.data.expenses.length', rep.data.expenses.length)
+            if (!rep.data.expenses.length) {
+                $scope.expenses = exampleExpenses;
+            } else {
+                $scope.expenses = rep.data.expenses;
+            }
+        };
         // http related calls
         $scope.fetchExpenses = () => {
             console.log('fetch expenses...');
@@ -295,17 +309,7 @@ angular
 
             $http.get('get-my-expenses').then((rep) => {
                     console.log('get-my-expenses', rep.data.expenses);
-                    $scope.config.loading = false;
-                    $scope.config.initialLoadingDone = true;
-                    $scope.config.disponibility = rep.data.disponibility;
-                    $scope.config.averageMonthlyEarnings = rep.data.averageMonthlyEarnings;
-                    // default data when user has nothing saved
-                    console.log('rep.data.expenses.length', rep.data.expenses.length)
-                    if (!rep.data.expenses.length) {
-                        $scope.expenses = exampleExpenses;
-                    } else {
-                        $scope.expenses = rep.data.expenses;
-                    }
+                    $scope.updateconf(rep)
                 },
                 $scope.manageError)
         };
@@ -324,7 +328,7 @@ angular
             })
                 .then((rep) => {
                         console.log('save-my-expenses', rep);
-                        $scope.config.loading = false;
+                        $scope.updateconf(rep)
                     },
                     $scope.manageError)
         };
diff --git a/caisse-bliss-frontend b/caisse-bliss-frontend
deleted file mode 160000
index 474d8db5..00000000
--- a/caisse-bliss-frontend
+++ /dev/null
@@ -1 +0,0 @@
-Subproject commit 474d8db5d74ec1283bf9b9e1a0fe03221538d44c