Skip to content

Commit

Permalink
fix(uiGridDirective): Reducing digest cycles and improving coverage.
Browse files Browse the repository at this point in the history 
Refactoring for better performance.
  • Loading branch information
@mportuga
Portugal, Marcelo authored and mportuga committed Mar 24, 2017
1 parent 1f116fe commit 56f0dc1
Showing 1 changed file with 31 additions and 30 deletions.
61 changes: 31 additions & 30 deletions src/js/core/directives/ui-grid.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@
'use strict';

angular.module('ui.grid').controller('uiGridController', ['$scope', '$element', '$attrs', 'gridUtil', '$q', 'uiGridConstants',
'$templateCache', 'gridClassFactory', '$timeout', '$parse', '$compile',
'gridClassFactory', '$parse', '$compile',
function ($scope, $elm, $attrs, gridUtil, $q, uiGridConstants,
$templateCache, gridClassFactory, $timeout, $parse, $compile) {
gridClassFactory, $parse, $compile) {
// gridUtil.logDebug('ui-grid controller');

var self = this;
var deregFunctions = [];

self.grid = gridClassFactory.createGrid($scope.uiGrid);

Expand All @@ -24,20 +24,23 @@
$scope.grid = self.grid;

if ($attrs.uiGridColumns) {
$attrs.$observe('uiGridColumns', function(value) {
self.grid.options.columnDefs = value;
deregFunctions.push( $attrs.$observe('uiGridColumns', function(value) {
self.grid.options.columnDefs = angular.isString(value) ? angular.fromJson(value) : value;
self.grid.buildColumns()
.then(function(){
self.grid.preCompileCellTemplates();

self.grid.refreshCanvas(true);
}).catch(angular.noop);
});
}) );
}

// prevents an error from being thrown when the array is not defined yet and fastWatch is on
function getSize(array) {
return array ? array.length : 0;
}

// if fastWatch is set we watch only the length and the reference, not every individual object
var deregFunctions = [];
if (self.grid.options.fastWatch) {
self.uiGrid = $scope.uiGrid;
if (angular.isString($scope.uiGrid.data)) {
Expand All @@ -51,10 +54,10 @@
}, dataWatchFunction) );
} else {
deregFunctions.push( $scope.$parent.$watch(function() { return $scope.uiGrid.data; }, dataWatchFunction) );
deregFunctions.push( $scope.$parent.$watch(function() { return $scope.uiGrid.data.length; }, function(){ dataWatchFunction($scope.uiGrid.data); }) );
deregFunctions.push( $scope.$parent.$watch(function() { return getSize($scope.uiGrid.data); }, function(){ dataWatchFunction($scope.uiGrid.data); }) );
}
deregFunctions.push( $scope.$parent.$watch(function() { return $scope.uiGrid.columnDefs; }, columnDefsWatchFunction) );
deregFunctions.push( $scope.$parent.$watch(function() { return $scope.uiGrid.columnDefs.length; }, function(){ columnDefsWatchFunction($scope.uiGrid.columnDefs); }) );
deregFunctions.push( $scope.$parent.$watch(function() { return getSize($scope.uiGrid.columnDefs); }, function(){ columnDefsWatchFunction($scope.uiGrid.columnDefs); }) );
} else {
if (angular.isString($scope.uiGrid.data)) {
deregFunctions.push( $scope.$parent.$watchCollection($scope.uiGrid.data, dataWatchFunction) );
Expand Down Expand Up @@ -84,12 +87,10 @@
// gridUtil.logDebug('dataWatch fired');
var promises = [];

if ( self.grid.options.fastWatch ){
if (angular.isString($scope.uiGrid.data)) {
newData = self.grid.appScope[$scope.uiGrid.data];
} else {
newData = $scope.uiGrid.data;
}
if (angular.isString($scope.uiGrid.data)) {
newData = self.grid.appScope[$scope.uiGrid.data];
} else {
newData = $scope.uiGrid.data;
}

mostRecentData = newData;
Expand Down Expand Up @@ -148,12 +149,10 @@
});

self.fireEvent = function(eventName, args) {
// Add the grid to the event arguments if it's not there
if (typeof(args) === 'undefined' || args === undefined) {
args = {};
}
args = args || {};

if (typeof(args.grid) === 'undefined' || args.grid === undefined) {
// Add the grid to the event arguments if it's not there
if (angular.isUndefined(args.grid)) {
args.grid = self.grid;
}

Expand All @@ -163,7 +162,6 @@
self.innerCompile = function innerCompile(elm) {
$compile(elm)($scope);
};

}]);

/**
Expand Down Expand Up @@ -196,8 +194,8 @@
*/
angular.module('ui.grid').directive('uiGrid', uiGridDirective);

uiGridDirective.$inject = ['$compile', '$templateCache', '$timeout', '$window', 'gridUtil', 'uiGridConstants'];
function uiGridDirective($compile, $templateCache, $timeout, $window, gridUtil, uiGridConstants) {
uiGridDirective.$inject = ['$window', 'gridUtil', 'uiGridConstants'];
function uiGridDirective($window, gridUtil, uiGridConstants) {
return {
templateUrl: 'ui-grid/ui-grid',
scope: {
Expand Down Expand Up @@ -239,32 +237,36 @@ function uiGridDirective($compile, $templateCache, $timeout, $window, gridUtil,
if ($elm[0].offsetWidth <= 0 && sizeChecks < maxSizeChecks) {
setTimeout(checkSize, sizeCheckInterval);
sizeChecks++;
}
else {
$timeout(init);
} else {
$scope.$applyAsync(init);
}
}

// Setup event listeners and watchers
function setup() {
var deregisterLeftWatcher;
var deregisterRightWatcher;

// Bind to window resize events
angular.element($window).on('resize', gridResize);

// Unbind from window resize events when the grid is destroyed
$elm.on('$destroy', function () {
angular.element($window).off('resize', gridResize);
deregisterLeftWatcher();
deregisterRightWatcher();
});

// If we add a left container after render, we need to watch and react
$scope.$watch(function () { return grid.hasLeftContainer();}, function (newValue, oldValue) {
deregisterLeftWatcher = $scope.$watch(function () { return grid.hasLeftContainer();}, function (newValue, oldValue) {
if (newValue === oldValue) {
return;
}
grid.refreshCanvas(true);
});

// If we add a right container after render, we need to watch and react
$scope.$watch(function () { return grid.hasRightContainer();}, function (newValue, oldValue) {
deregisterRightWatcher = $scope.$watch(function () { return grid.hasRightContainer();}, function (newValue, oldValue) {
if (newValue === oldValue) {
return;
}
Expand Down Expand Up @@ -337,7 +339,7 @@ function uiGridDirective($compile, $templateCache, $timeout, $window, gridUtil,
}

// Resize the grid on window resize events
function gridResize($event) {
function gridResize() {
grid.gridWidth = $scope.gridWidth = gridUtil.elementWidth($elm);
grid.gridHeight = $scope.gridHeight = gridUtil.elementHeight($elm);

Expand All @@ -348,5 +350,4 @@ function uiGridDirective($compile, $templateCache, $timeout, $window, gridUtil,
}
};
}

})();

0 comments on commit 56f0dc1

Please sign in to comment.