From fd80ce9a18ae914a1e1b85bf1b4e92a789a257df Mon Sep 17 00:00:00 2001 From: allan Ruka Date: Tue, 3 Jan 2017 07:23:08 -0300 Subject: [PATCH 1/3] Create CheckBoxMgmtProvider.js Add Provider to control checkbox functionality --- .../main/providers/CheckBoxMgmtProvider.js | 26 +++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 app/modules/main/providers/CheckBoxMgmtProvider.js diff --git a/app/modules/main/providers/CheckBoxMgmtProvider.js b/app/modules/main/providers/CheckBoxMgmtProvider.js new file mode 100644 index 0000000..c832c46 --- /dev/null +++ b/app/modules/main/providers/CheckBoxMgmtProvider.js @@ -0,0 +1,26 @@ +(function(){ + 'use strict'; + + /** + * @name CheckBoxMgmtProvider + * @used as CheckBox management service + */ + function CheckBoxMgmtProvider(){ + var service = this; + service.getCheckOption = getCheckOption; + function getCheckOption(storageData){ + _.each(storageData, function(data){ + if(data.optionList.selected === false){ + $('th md-checkbox').removeClass('md-checked'); + return false; + }else{ + $('th md-checkbox').addClass('md-checked'); + } + }); + } + } + + angular + .module('mdDataTable') + .service('CheckBoxMgmtProvider', CheckBoxMgmtProvider); +})(); From 5096b87ed6dbd6c3e62431461f8f86fa4935e440 Mon Sep 17 00:00:00 2001 From: allan Ruka Date: Tue, 3 Jan 2017 07:24:43 -0300 Subject: [PATCH 2/3] Update CheckBoxMgmtProvider.js --- app/modules/main/providers/CheckBoxMgmtProvider.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/app/modules/main/providers/CheckBoxMgmtProvider.js b/app/modules/main/providers/CheckBoxMgmtProvider.js index c832c46..2dd4395 100644 --- a/app/modules/main/providers/CheckBoxMgmtProvider.js +++ b/app/modules/main/providers/CheckBoxMgmtProvider.js @@ -11,10 +11,11 @@ function getCheckOption(storageData){ _.each(storageData, function(data){ if(data.optionList.selected === false){ - $('th md-checkbox').removeClass('md-checked'); + // find a way not to use css directly here + //$('th md-checkbox').removeClass('md-checked'); return false; }else{ - $('th md-checkbox').addClass('md-checked'); + //$('th md-checkbox').addClass('md-checked'); } }); } From 61aacdcd293de4a46b1cdb1e853c65b7c3d33560 Mon Sep 17 00:00:00 2001 From: Allan Ruka Date: Sun, 8 Jan 2017 02:53:06 -0300 Subject: [PATCH 3/3] [checkbox-001] - create checkbox management service - manage headercheckbox to make it more user friendly. --- .../helpers/mdtSelectAllRowsHandlerDirective.js | 16 +++++++++++++++- app/modules/main/directives/mdtTableDirective.js | 4 ++++ .../main/features/SelectableRowsFeature.js | 7 +++++-- .../main/providers/CheckBoxMgmtProvider.js | 14 +++++++++++--- 4 files changed, 35 insertions(+), 6 deletions(-) diff --git a/app/modules/main/directives/helpers/mdtSelectAllRowsHandlerDirective.js b/app/modules/main/directives/helpers/mdtSelectAllRowsHandlerDirective.js index 6ccd775..15c965e 100644 --- a/app/modules/main/directives/helpers/mdtSelectAllRowsHandlerDirective.js +++ b/app/modules/main/directives/helpers/mdtSelectAllRowsHandlerDirective.js @@ -1,7 +1,7 @@ (function(){ 'use strict'; - function mdtSelectAllRowsHandlerDirective(){ + function mdtSelectAllRowsHandlerDirective($timeout){ return { restrict: 'A', scope: false, @@ -10,6 +10,20 @@ $scope.selectAllRows = false; $scope.$watch('selectAllRows', function(val){ + if($scope.initTable){ + $timeout(function(){ + $scope.initTable = false; + }, attrs.hideDelay); + }else{ + _.each(ctrl.dataStorage.storage, function(data){ + if(data.optionList.selected === false){ + val = true; + $('th md-checkbox').addClass('md-checked'); + return false; + } + }); + } + ctrl.dataStorage.setAllRowsSelected(val, $scope.isPaginationEnabled()); }); } diff --git a/app/modules/main/directives/mdtTableDirective.js b/app/modules/main/directives/mdtTableDirective.js index 64c0857..58f9156 100644 --- a/app/modules/main/directives/mdtTableDirective.js +++ b/app/modules/main/directives/mdtTableDirective.js @@ -145,6 +145,10 @@ controller: function mdtTable($scope){ var vm = this; + //set init scope to true for those that + //are using locationchanges + $scope.initTable = true; + $scope.rippleEffectCallback = function(){ return $scope.rippleEffect ? $scope.rippleEffect : false; }; diff --git a/app/modules/main/features/SelectableRowsFeature.js b/app/modules/main/features/SelectableRowsFeature.js index a50c564..c9a539e 100644 --- a/app/modules/main/features/SelectableRowsFeature.js +++ b/app/modules/main/features/SelectableRowsFeature.js @@ -1,17 +1,20 @@ (function(){ 'use strict'; - function SelectableRowsFeatureFactory($timeout){ + function SelectableRowsFeatureFactory($timeout, CheckBoxMgmtProvider){ function SelectableRowsFeature(params){ this.$scope = params.$scope; this.ctrl = params.ctrl; + SelectableRowsFeature.$inject = ["CheckBoxMgmtProvider"]; this.$scope.onCheckboxChange = _.bind(this.onCheckboxChange, this); } SelectableRowsFeature.prototype.onCheckboxChange = function(){ var that = this; + + CheckBoxMgmtProvider.getCheckOption(that.ctrl.dataStorage); // we need to push it to the event loop to make it happen last // (e.g.: all the elements can be selected before we call the callback) $timeout(function(){ @@ -31,4 +34,4 @@ angular .module('mdDataTable') .service('SelectableRowsFeature', SelectableRowsFeatureFactory); -}()); \ No newline at end of file +}()); diff --git a/app/modules/main/providers/CheckBoxMgmtProvider.js b/app/modules/main/providers/CheckBoxMgmtProvider.js index 2dd4395..29468e9 100644 --- a/app/modules/main/providers/CheckBoxMgmtProvider.js +++ b/app/modules/main/providers/CheckBoxMgmtProvider.js @@ -7,16 +7,24 @@ */ function CheckBoxMgmtProvider(){ var service = this; + service.getCheckOption = getCheckOption; function getCheckOption(storageData){ + var foundFalse = false; _.each(storageData, function(data){ - if(data.optionList.selected === false){ + if(foundFalse){ + return false; + } + _.each(data, function(subData){ + if(subData.optionList.selected === false){ // find a way not to use css directly here - //$('th md-checkbox').removeClass('md-checked'); + $('th md-checkbox').removeClass('md-checked'); + foundFalse = true; return false; }else{ - //$('th md-checkbox').addClass('md-checked'); + $('th md-checkbox').addClass('md-checked'); } + }) }); } }