From 0cd5dab07cc42912eb6c2f7b0c190d0c1d9b9334 Mon Sep 17 00:00:00 2001
From: Alexis Lahouze <xals@lahouze.org>
Date: Sun, 2 Jul 2017 00:11:02 +0200
Subject: [PATCH] Improve bindings between components.

---
 src/operations/balance-chart.component.js | 25 ++++++++++-------------
 src/operations/index.js                   | 18 +++++++++-------
 src/operations/operations.html            |  4 +---
 3 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/src/operations/balance-chart.component.js b/src/operations/balance-chart.component.js
index e522903..2a08917 100644
--- a/src/operations/balance-chart.component.js
+++ b/src/operations/balance-chart.component.js
@@ -33,17 +33,14 @@ var balanceChartModule = angular.module('balanceChartModule', [
 .component('balanceChart', {
     template: '<div></div>',
     bindings: {
-        minDate: '<',
-        maxDate: '<'
+        onUpdate: '&'
     },
     controller: function($routeParams, Balances, $element, $log) {
         var vm = this;
 
         vm.loadData = function() {
             Balances.query({
-                id: $routeParams.accountId,
-                //begin: vm.minDate.format('YYYY-MM-DD'),
-                //end: vm.maxDate.format('YYYY-MM-DD')
+                id: $routeParams.accountId
             }, function(results) {
                 var headers = [['x', 'balances', 'expenses', 'revenues']];
 
@@ -59,18 +56,19 @@ var balanceChartModule = angular.module('balanceChartModule', [
                 vm.chart.load({
                     rows: headers.concat(rows)
                 });
+
+                var x = vm.chart.x();
+                var balances = x.balances;
+
+                vm.onUpdate(balances[0], balances[balances.length - 1]);
             });
         };
 
         vm.$onInit = function() {
-            $log.log($element);
-
             vm.chart = c3.generate({
-                //bindto: $element[0],
                 bindto: $element[0].children[0],
                 size: {
                     height: 500,
-                //    witdh: 800,
                 },
                 data: {
                     x: 'x',
@@ -129,16 +127,15 @@ var balanceChartModule = angular.module('balanceChartModule', [
                     }
                 },
                 subchart: {
-                    show: true
+                    show: true,
+                    onbrush: function(domain) {
+                        vm.onUpdate({minDate: domain[0], maxDate: domain[1]});
+                    }
                 }
             });
 
             vm.loadData();
         };
-
-        vm.$onChange = function(changes) {
-            vm.loadData();
-        };
     }
 }).factory('Balances', function($resource) {
     return $resource(
diff --git a/src/operations/index.js b/src/operations/index.js
index a9f94f2..bb649c3 100644
--- a/src/operations/index.js
+++ b/src/operations/index.js
@@ -63,9 +63,6 @@ var operationModule = angular.module('accountant.operations', [
 
     var vm = this;
 
-    vm.minDate = moment().date(1).month(11).year(2016);
-    vm.maxDate = moment();
-
     /*
      * Add an empty operation.
      */
@@ -81,12 +78,15 @@ var operationModule = angular.module('accountant.operations', [
     /*
      * Load operations.
      */
-    vm.load = function() {
+    vm.load = function(minDate, maxDate) {
+        vm.minDate = minDate;
+        vm.maxDate = maxDate;
+
         return Operation.query({
             // eslint-disable-next-line camelcase
             account_id: $routeParams.accountId,
-            begin: vm.minDate.format('YYYY-MM-DD'),
-            end: vm.maxDate.format('YYYY-MM-DD')
+            begin: minDate ? moment(minDate).format('YYYY-MM-DD') : null,
+            end: maxDate ? moment(maxDate).format('YYYY-MM-DD') : null
         });
     };
 
@@ -183,7 +183,11 @@ var operationModule = angular.module('accountant.operations', [
         });
     };
 
-    vm.operations = vm.load();
+    vm.onUpdate = function(minDate, maxDate) {
+        vm.operations = vm.load(minDate, maxDate);
+    };
+
+    //vm.operations = vm.load();
 })
 
 .component('operationModifyModalComponent', {
diff --git a/src/operations/operations.html b/src/operations/operations.html
index c9707ef..aceb4d8 100644
--- a/src/operations/operations.html
+++ b/src/operations/operations.html
@@ -18,9 +18,7 @@
 <div>
   <div class="row">
     <div class="col-md-9">
-      <balance-chart
-        min-date="operationsCtrl.minDate"
-        max-date="operationsCtrl.maxDate"/>
+      <balance-chart on-update="operationsCtrl.onUpdate(minDate, maxDate)"/>
     </div>
     <div class="col-md-3"></div>
   </div>