toserve.fobo.angular-ui.ng-grid.2.0.7.js.ng-grid-2.0.7.debug.js Maven / Gradle / Ivy
The newest version!
/***********************************************
* ng-grid JavaScript Library
* Authors: https://github.com/angular-ui/ng-grid/blob/master/README.md
* License: MIT (http://www.opensource.org/licenses/mit-license.php)
* Compiled At: 07/06/2013 13:50
***********************************************/
(function(window, $) {
'use strict';
// the # of rows we want to add to the top and bottom of the rendered grid rows
var EXCESS_ROWS = 6;
var SCROLL_THRESHOLD = 4;
var ASC = "asc";
// constant for sorting direction
var DESC = "desc";
// constant for sorting direction
var NG_FIELD = '_ng_field_';
var NG_DEPTH = '_ng_depth_';
var NG_HIDDEN = '_ng_hidden_';
var NG_COLUMN = '_ng_column_';
var CUSTOM_FILTERS = /CUSTOM_FILTERS/g;
var COL_FIELD = /COL_FIELD/g;
var DISPLAY_CELL_TEMPLATE = /DISPLAY_CELL_TEMPLATE/g;
var EDITABLE_CELL_TEMPLATE = /EDITABLE_CELL_TEMPLATE/g;
var TEMPLATE_REGEXP = /<.+>/;
window.ngGrid = {};
window.ngGrid.i18n = {};
// Declare app level module which depends on filters, and services
var ngGridServices = angular.module('ngGrid.services', []);
var ngGridDirectives = angular.module('ngGrid.directives', []);
var ngGridFilters = angular.module('ngGrid.filters', []);
// initialization of services into the main module
angular.module('ngGrid', ['ngGrid.services', 'ngGrid.directives', 'ngGrid.filters']);
//set event binding on the grid so we can select using the up/down keys
var ngMoveSelectionHandler = function($scope, elm, evt, grid) {
if ($scope.selectionProvider.selectedItems === undefined) {
return true;
}
var charCode = evt.which || evt.keyCode,
newColumnIndex,
lastInRow = false,
firstInRow = false,
rowIndex = $scope.selectionProvider.lastClickedRow === undefined ? 1 : $scope.selectionProvider.lastClickedRow.rowIndex,
visibleCols = $scope.columns.filter(function(c) { return c.visible; }),
pinnedCols = $scope.columns.filter(function(c) { return c.pinned; });
if ($scope.col) {
newColumnIndex = visibleCols.indexOf($scope.col);
}
if (charCode !== 37 && charCode !== 38 && charCode !== 39 && charCode !== 40 && charCode !== 9 && charCode !== 13) {
return true;
}
if ($scope.enableCellSelection) {
if (charCode === 9) { //tab key
evt.preventDefault();
}
var focusedOnFirstColumn = $scope.showSelectionCheckbox ? $scope.col.index === 1 : $scope.col.index === 0;
var focusedOnFirstVisibleColumns = $scope.$index === 1 || $scope.$index === 0;
var focusedOnLastVisibleColumns = $scope.$index === ($scope.renderedColumns.length - 1) || $scope.$index === ($scope.renderedColumns.length - 2);
var focusedOnLastColumn = visibleCols.indexOf($scope.col) === (visibleCols.length - 1);
var focusedOnLastPinnedColumn = pinnedCols.indexOf($scope.col) === (pinnedCols.length - 1);
if (charCode === 37 || charCode === 9 && evt.shiftKey) {
var scrollTo = 0;
if (!focusedOnFirstColumn) {
newColumnIndex -= 1;
}
if (focusedOnFirstVisibleColumns) {
if (focusedOnFirstColumn && charCode === 9 && evt.shiftKey){
scrollTo = grid.$canvas.width();
newColumnIndex = visibleCols.length - 1;
firstInRow = true;
}
else {
scrollTo = grid.$viewport.scrollLeft() - $scope.col.width;
}
}
else if (pinnedCols.length > 0) {
scrollTo = grid.$viewport.scrollLeft() - visibleCols[newColumnIndex].width;
}
grid.$viewport.scrollLeft(scrollTo);
}
else if (charCode === 39 || charCode === 9 && !evt.shiftKey) {
if (focusedOnLastVisibleColumns) {
if (focusedOnLastColumn && charCode === 9 && !evt.shiftKey) {
grid.$viewport.scrollLeft(0);
newColumnIndex = $scope.showSelectionCheckbox ? 1 : 0;
lastInRow = true;
}
else {
grid.$viewport.scrollLeft(grid.$viewport.scrollLeft() + $scope.col.width);
}
}
else if (focusedOnLastPinnedColumn) {
grid.$viewport.scrollLeft(0);
}
if (!focusedOnLastColumn) {
newColumnIndex += 1;
}
}
}
var items;
if ($scope.configGroups.length > 0) {
items = grid.rowFactory.parsedData.filter(function (row) {
return !row.isAggRow;
});
}
else {
items = grid.filteredRows;
}
var offset = 0;
if (rowIndex !== 0 && (charCode === 38 || charCode === 13 && evt.shiftKey || charCode === 9 && evt.shiftKey && firstInRow)) { //arrow key up or shift enter or tab key and first item in row
offset = -1;
}
else if (rowIndex !== items.length - 1 && (charCode === 40 || charCode === 13 && !evt.shiftKey || charCode === 9 && lastInRow)) {//arrow key down, enter, or tab key and last item in row?
offset = 1;
}
if (offset) {
var r = items[rowIndex + offset];
if (r.beforeSelectionChange(r, evt)) {
r.continueSelection(evt);
$scope.$emit('ngGridEventDigestGridParent');
if ($scope.selectionProvider.lastClickedRow.renderedRowIndex >= $scope.renderedRows.length - EXCESS_ROWS - 2) {
grid.$viewport.scrollTop(grid.$viewport.scrollTop() + $scope.rowHeight);
}
else if ($scope.selectionProvider.lastClickedRow.renderedRowIndex <= EXCESS_ROWS + 2) {
grid.$viewport.scrollTop(grid.$viewport.scrollTop() - $scope.rowHeight);
}
}
}
if ($scope.enableCellSelection) {
setTimeout(function(){
$scope.domAccessProvider.focusCellElement($scope, $scope.renderedColumns.indexOf(visibleCols[newColumnIndex]));
}, 3);
}
return false;
};
if (!String.prototype.trim) {
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g, '');
};
}
if (!Array.prototype.indexOf) {
Array.prototype.indexOf = function(elt /*, from*/) {
var len = this.length >>> 0;
var from = Number(arguments[1]) || 0;
from = (from < 0) ? Math.ceil(from) : Math.floor(from);
if (from < 0) {
from += len;
}
for (; from < len; from++) {
if (from in this && this[from] === elt) {
return from;
}
}
return -1;
};
}
if (!Array.prototype.filter) {
Array.prototype.filter = function(fun /*, thisp */) {
"use strict";
var t = Object(this);
var len = t.length >>> 0;
if (typeof fun !== "function") {
throw new TypeError();
}
var res = [];
var thisp = arguments[1];
for (var i = 0; i < len; i++) {
if (i in t) {
var val = t[i]; // in case fun mutates this
if (fun.call(thisp, val, i, t)) {
res.push(val);
}
}
}
return res;
};
}
ngGridFilters.filter('checkmark', function() {
return function(input) {
return input ? '\u2714' : '\u2718';
};
});
ngGridFilters.filter('ngColumns', function() {
return function(input) {
return input.filter(function(col) {
return !col.isAggCol;
});
};
});
angular.module('ngGrid.services').factory('$domUtilityService',['$utilityService', function($utils) {
var domUtilityService = {};
var regexCache = {};
var getWidths = function() {
var $testContainer = $('');
$testContainer.appendTo('body');
// 1. Run all the following measurements on startup!
//measure Scroll Bars
$testContainer.height(100).width(100).css("position", "absolute").css("overflow", "scroll");
$testContainer.append('');
domUtilityService.ScrollH = ($testContainer.height() - $testContainer[0].clientHeight);
domUtilityService.ScrollW = ($testContainer.width() - $testContainer[0].clientWidth);
$testContainer.empty();
//clear styles
$testContainer.attr('style', '');
//measure letter sizes using a pretty typical font size and fat font-family
$testContainer.append('M');
domUtilityService.LetterW = $testContainer.children().first().width();
$testContainer.remove();
};
domUtilityService.eventStorage = {};
domUtilityService.AssignGridContainers = function($scope, rootEl, grid) {
grid.$root = $(rootEl);
//Headers
grid.$topPanel = grid.$root.find(".ngTopPanel");
grid.$groupPanel = grid.$root.find(".ngGroupPanel");
grid.$headerContainer = grid.$topPanel.find(".ngHeaderContainer");
$scope.$headerContainer = grid.$headerContainer;
grid.$headerScroller = grid.$topPanel.find(".ngHeaderScroller");
grid.$headers = grid.$headerScroller.children();
//Viewport
grid.$viewport = grid.$root.find(".ngViewport");
//Canvas
grid.$canvas = grid.$viewport.find(".ngCanvas");
//Footers
grid.$footerPanel = grid.$root.find(".ngFooterPanel");
$scope.$watch(function () {
return grid.$viewport.scrollLeft();
}, function (newLeft) {
return grid.$headerContainer.scrollLeft(newLeft);
});
domUtilityService.UpdateGridLayout($scope, grid);
};
domUtilityService.getRealWidth = function (obj) {
var width = 0;
var props = { visibility: "hidden", display: "block" };
var hiddenParents = obj.parents().andSelf().not(':visible');
$.swap(hiddenParents[0], props, function () {
width = obj.outerWidth();
});
return width;
};
domUtilityService.UpdateGridLayout = function($scope, grid) {
//catch this so we can return the viewer to their original scroll after the resize!
var scrollTop = grid.$viewport.scrollTop();
grid.elementDims.rootMaxW = grid.$root.width();
if (grid.$root.is(':hidden')) {
grid.elementDims.rootMaxW = domUtilityService.getRealWidth(grid.$root);
}
grid.elementDims.rootMaxH = grid.$root.height();
//check to see if anything has changed
grid.refreshDomSizes();
$scope.adjustScrollTop(scrollTop, true); //ensure that the user stays scrolled where they were
};
domUtilityService.numberOfGrids = 0;
domUtilityService.BuildStyles = function($scope, grid, digest) {
var rowHeight = grid.config.rowHeight,
$style = grid.$styleSheet,
gridId = grid.gridId,
css,
cols = $scope.columns,
sumWidth = 0;
if (!$style) {
$style = $('#' + gridId);
if (!$style[0]) {
$style = $("").appendTo(grid.$root);
}
}
$style.empty();
var trw = $scope.totalRowWidth();
css = "." + gridId + " .ngCanvas { width: " + trw + "px; }" +
"." + gridId + " .ngRow { width: " + trw + "px; }" +
"." + gridId + " .ngCanvas { width: " + trw + "px; }" +
"." + gridId + " .ngHeaderScroller { width: " + (trw + domUtilityService.ScrollH) + "px}";
for (var i = 0; i < cols.length; i++) {
var col = cols[i];
if (col.visible !== false) {
css += "." + gridId + " .col" + i + " { width: " + col.width + "px; left: " + sumWidth + "px; height: " + rowHeight + "px }" +
"." + gridId + " .colt" + i + " { width: " + col.width + "px; }";
sumWidth += col.width;
}
}
if ($utils.isIe) { // IE
$style[0].styleSheet.cssText = css;
}
else {
$style[0].appendChild(document.createTextNode(css));
}
grid.$styleSheet = $style;
$scope.adjustScrollLeft(grid.$viewport.scrollLeft());
if (digest) {
domUtilityService.digest($scope);
}
};
domUtilityService.setColLeft = function(col, colLeft, grid) {
if (grid.$styleSheet) {
var regex = regexCache[col.index];
if (!regex) {
regex = regexCache[col.index] = new RegExp(".col" + col.index + " { width: [0-9]+px; left: [0-9]+px");
}
var str = grid.$styleSheet.html();
var newStr = str.replace(regex, ".col" + col.index + " { width: " + col.width + "px; left: " + colLeft + "px");
if ($utils.isIe) { // IE
setTimeout(function() {
grid.$styleSheet.html(newStr);
});
}
else {
grid.$styleSheet.html(newStr);
}
}
};
domUtilityService.setColLeft.immediate = 1;
domUtilityService.RebuildGrid = function($scope, grid){
domUtilityService.UpdateGridLayout($scope, grid);
if (grid.config.maintainColumnRatios == null || grid.config.maintainColumnRatios) {
grid.configureColumnWidths();
}
$scope.adjustScrollLeft(grid.$viewport.scrollLeft());
domUtilityService.BuildStyles($scope, grid, true);
};
domUtilityService.digest = function($scope) {
if (!$scope.$root.$$phase) {
$scope.$digest();
}
};
domUtilityService.ScrollH = 17; // default in IE, Chrome, & most browsers
domUtilityService.ScrollW = 17; // default in IE, Chrome, & most browsers
domUtilityService.LetterW = 10;
getWidths();
return domUtilityService;
}]);
angular.module('ngGrid.services').factory('$sortService', ['$parse', function($parse) {
var sortService = {};
sortService.colSortFnCache = {}; // cache of sorting functions. Once we create them, we don't want to keep re-doing it
// this takes an piece of data from the cell and tries to determine its type and what sorting
// function to use for it
// @item - the cell data
sortService.guessSortFn = function(item) {
var itemType = typeof(item);
//check for numbers and booleans
switch (itemType) {
case "number":
return sortService.sortNumber;
case "boolean":
return sortService.sortBool;
case "string":
// if number string return number string sort fn. else return the str
return item.match(/^[-+]?[£$¤]?[\d,.]+%?$/) ? sortService.sortNumberStr : sortService.sortAlpha;
default:
//check if the item is a valid Date
if (Object.prototype.toString.call(item) === '[object Date]') {
return sortService.sortDate;
}
else {
//finally just sort the basic sort...
return sortService.basicSort;
}
}
};
//#region Sorting Functions
sortService.basicSort = function(a, b) {
if (a === b) {
return 0;
}
if (a < b) {
return -1;
}
return 1;
};
sortService.sortNumber = function(a, b) {
return a - b;
};
sortService.sortNumberStr = function(a, b) {
var numA, numB, badA = false, badB = false;
numA = parseFloat(a.replace(/[^0-9.-]/g, ''));
if (isNaN(numA)) {
badA = true;
}
numB = parseFloat(b.replace(/[^0-9.-]/g, ''));
if (isNaN(numB)) {
badB = true;
}
// we want bad ones to get pushed to the bottom... which effectively is "greater than"
if (badA && badB) {
return 0;
}
if (badA) {
return 1;
}
if (badB) {
return -1;
}
return numA - numB;
};
sortService.sortAlpha = function(a, b) {
var strA = a.toLowerCase(),
strB = b.toLowerCase();
return strA === strB ? 0 : (strA < strB ? -1 : 1);
};
sortService.sortDate = function(a, b) {
var timeA = a.getTime(),
timeB = b.getTime();
return timeA === timeB ? 0 : (timeA < timeB ? -1 : 1);
};
sortService.sortBool = function(a, b) {
if (a && b) {
return 0;
}
if (!a && !b) {
return 0;
} else {
return a ? 1 : -1;
}
};
//#endregion
// the core sorting logic trigger
sortService.sortData = function(sortInfo, data /*datasource*/) {
// first make sure we are even supposed to do work
if (!data || !sortInfo) {
return;
}
var l = sortInfo.fields.length,
order = sortInfo.fields,
col,
direction,
// IE9 HACK.... omg, I can't reference data array within the sort fn below. has to be a separate reference....!!!!
d = data.slice(0);
//now actually sort the data
data.sort(function (itemA, itemB) {
var tem = 0,
indx = 0,
sortFn;
while (tem === 0 && indx < l) {
// grab the metadata for the rest of the logic
col = sortInfo.columns[indx];
direction = sortInfo.directions[indx];
sortFn = sortService.getSortFn(col, d);
var propA = $parse(order[indx])(itemA);
var propB = $parse(order[indx])(itemB);
// we want to allow zero values to be evaluated in the sort function
if ((!propA && propA !== 0) || (!propB && propB !== 0)) {
// we want to force nulls and such to the bottom when we sort... which effectively is "greater than"
if (!propB && !propA) {
tem = 0;
}
else if (!propA) {
tem = 1;
}
else if (!propB) {
tem = -1;
}
}
else {
tem = sortFn(propA, propB);
}
indx++;
}
//made it this far, we don't have to worry about null & undefined
if (direction === ASC) {
return tem;
} else {
return 0 - tem;
}
});
};
sortService.Sort = function(sortInfo, data) {
if (sortService.isSorting) {
return;
}
sortService.isSorting = true;
sortService.sortData(sortInfo, data);
sortService.isSorting = false;
};
sortService.getSortFn = function(col, data) {
var sortFn, item;
//see if we already figured out what to use to sort the column
if (sortService.colSortFnCache[col.field]) {
sortFn = sortService.colSortFnCache[col.field];
}
else if (col.sortingAlgorithm !== undefined) {
sortFn = col.sortingAlgorithm;
sortService.colSortFnCache[col.field] = col.sortingAlgorithm;
}
else { // try and guess what sort function to use
item = data[0];
if (!item) {
return sortFn;
}
sortFn = sortService.guessSortFn($parse(col.field)(item));
//cache it
if (sortFn) {
sortService.colSortFnCache[col.field] = sortFn;
} else {
// we assign the alpha sort because anything that is null/undefined will never get passed to
// the actual sorting function. It will get caught in our null check and returned to be sorted
// down to the bottom
sortFn = sortService.sortAlpha;
}
}
return sortFn;
};
return sortService;
}]);
angular.module('ngGrid.services').factory('$utilityService', ['$parse', function ($parse) {
var funcNameRegex = /function (.{1,})\(/;
var utils = {
visualLength: function(node) {
var elem = document.getElementById('testDataLength');
if (!elem) {
elem = document.createElement('SPAN');
elem.id = "testDataLength";
elem.style.visibility = "hidden";
document.body.appendChild(elem);
}
$(elem).css('font', $(node).css('font'));
$(elem).css('font-size', $(node).css('font-size'));
$(elem).css('font-family', $(node).css('font-family'));
elem.innerHTML = $(node).text();
return elem.offsetWidth;
},
forIn: function(obj, action) {
for (var prop in obj) {
if (obj.hasOwnProperty(prop)) {
action(obj[prop], prop);
}
}
},
evalProperty: function (entity, path) {
return $parse(path)(entity);
},
endsWith: function(str, suffix) {
if (!str || !suffix || typeof str !== "string") {
return false;
}
return str.indexOf(suffix, str.length - suffix.length) !== -1;
},
isNullOrUndefined: function(obj) {
if (obj === undefined || obj === null) {
return true;
}
return false;
},
getElementsByClassName: function(cl) {
var retnode = [];
var myclass = new RegExp('\\b' + cl + '\\b');
var elem = document.getElementsByTagName('*');
for (var i = 0; i < elem.length; i++) {
var classes = elem[i].className;
if (myclass.test(classes)) {
retnode.push(elem[i]);
}
}
return retnode;
},
newId: (function() {
var seedId = new Date().getTime();
return function() {
return seedId += 1;
};
})(),
seti18n: function($scope, language) {
var $langPack = window.ngGrid.i18n[language];
for (var label in $langPack) {
$scope.i18n[label] = $langPack[label];
}
},
getInstanceType: function (o) {
var results = (funcNameRegex).exec(o.constructor.toString());
if (results && results.length > 1) {
var instanceType = results[1].replace(/^\s+|\s+$/g, ""); // Trim surrounding whitespace; IE appears to add a space at the end
return instanceType;
}
else {
return "";
}
},
// Detect IE versions for bug workarounds (uses IE conditionals, not UA string, for robustness)
// Note that, since IE 10 does not support conditional comments, the following logic only detects IE < 10.
// Currently this is by design, since IE 10+ behaves correctly when treated as a standard browser.
// If there is a future need to detect specific versions of IE10+, we will amend this.
ieVersion: (function() {
var version = 3, div = document.createElement('div'), iElems = div.getElementsByTagName('i');
// Keep constructing conditional HTML blocks until we hit one that resolves to an empty fragment
do{
div.innerHTML = '';
}while(iElems[0]);
return version > 4 ? version : undefined;
})()
};
$.extend(utils, {
isIe: (function() {
return utils.ieVersion !== undefined;
})()
});
return utils;
}]);
var ngAggregate = function (aggEntity, rowFactory, rowHeight, groupInitState) {
this.rowIndex = 0;
this.offsetTop = this.rowIndex * rowHeight;
this.entity = aggEntity;
this.label = aggEntity.gLabel;
this.field = aggEntity.gField;
this.depth = aggEntity.gDepth;
this.parent = aggEntity.parent;
this.children = aggEntity.children;
this.aggChildren = aggEntity.aggChildren;
this.aggIndex = aggEntity.aggIndex;
this.collapsed = groupInitState;
this.groupInitState = groupInitState;
this.rowFactory = rowFactory;
this.rowHeight = rowHeight;
this.isAggRow = true;
this.offsetLeft = aggEntity.gDepth * 25;
this.aggLabelFilter = aggEntity.aggLabelFilter;
};
ngAggregate.prototype.toggleExpand = function () {
this.collapsed = this.collapsed ? false : true;
if (this.orig) {
this.orig.collapsed = this.collapsed;
}
this.notifyChildren();
};
ngAggregate.prototype.setExpand = function (state) {
this.collapsed = state;
this.notifyChildren();
};
ngAggregate.prototype.notifyChildren = function () {
var longest = Math.max(this.rowFactory.aggCache.length, this.children.length);
for (var i = 0; i < longest; i++) {
if (this.aggChildren[i]) {
this.aggChildren[i].entity[NG_HIDDEN] = this.collapsed;
if (this.collapsed) {
this.aggChildren[i].setExpand(this.collapsed);
}
}
if (this.children[i]) {
this.children[i][NG_HIDDEN] = this.collapsed;
}
if (i > this.aggIndex && this.rowFactory.aggCache[i]) {
var agg = this.rowFactory.aggCache[i];
var offset = (30 * this.children.length);
agg.offsetTop = this.collapsed ? agg.offsetTop - offset : agg.offsetTop + offset;
}
}
this.rowFactory.renderedChange();
};
ngAggregate.prototype.aggClass = function () {
return this.collapsed ? "ngAggArrowCollapsed" : "ngAggArrowExpanded";
};
ngAggregate.prototype.totalChildren = function () {
if (this.aggChildren.length > 0) {
var i = 0;
var recurse = function (cur) {
if (cur.aggChildren.length > 0) {
angular.forEach(cur.aggChildren, function (a) {
recurse(a);
});
} else {
i += cur.children.length;
}
};
recurse(this);
return i;
} else {
return this.children.length;
}
};
ngAggregate.prototype.copy = function () {
var ret = new ngAggregate(this.entity, this.rowFactory, this.rowHeight, this.groupInitState);
ret.orig = this;
return ret;
};
var ngColumn = function (config, $scope, grid, domUtilityService, $templateCache, $utils) {
var self = this,
colDef = config.colDef,
delay = 500,
clicks = 0,
timer = null;
self.colDef = config.colDef;
self.width = colDef.width;
self.groupIndex = 0;
self.isGroupedBy = false;
self.minWidth = !colDef.minWidth ? 50 : colDef.minWidth;
self.maxWidth = !colDef.maxWidth ? 9000 : colDef.maxWidth;
// TODO: Use the column's definition for enabling cell editing
// self.enableCellEdit = config.enableCellEdit || colDef.enableCellEdit;
self.enableCellEdit = colDef.enableCellEdit !== undefined ? colDef.enableCellEdit : (config.enableCellEdit || config.enableCellEditOnFocus);
self.headerRowHeight = config.headerRowHeight;
// Use colDef.displayName as long as it's not undefined, otherwise default to the field name
self.displayName = (colDef.displayName === undefined) ? colDef.field : colDef.displayName;
self.index = config.index;
self.isAggCol = config.isAggCol;
self.cellClass = colDef.cellClass;
self.sortPriority = undefined;
self.cellFilter = colDef.cellFilter ? colDef.cellFilter : "";
self.field = colDef.field;
self.aggLabelFilter = colDef.cellFilter || colDef.aggLabelFilter;
self.visible = $utils.isNullOrUndefined(colDef.visible) || colDef.visible;
self.sortable = false;
self.resizable = false;
self.pinnable = false;
self.pinned = (config.enablePinning && colDef.pinned);
self.originalIndex = config.originalIndex == null ? self.index : config.originalIndex;
self.groupable = $utils.isNullOrUndefined(colDef.groupable) || colDef.groupable;
if (config.enableSort) {
self.sortable = $utils.isNullOrUndefined(colDef.sortable) || colDef.sortable;
}
if (config.enableResize) {
self.resizable = $utils.isNullOrUndefined(colDef.resizable) || colDef.resizable;
}
if (config.enablePinning) {
self.pinnable = $utils.isNullOrUndefined(colDef.pinnable) || colDef.pinnable;
}
self.sortDirection = undefined;
self.sortingAlgorithm = colDef.sortFn;
self.headerClass = colDef.headerClass;
self.cursor = self.sortable ? 'pointer' : 'default';
self.headerCellTemplate = colDef.headerCellTemplate || $templateCache.get('headerCellTemplate.html');
self.cellTemplate = colDef.cellTemplate || $templateCache.get('cellTemplate.html').replace(CUSTOM_FILTERS, self.cellFilter ? "|" + self.cellFilter : "");
if(self.enableCellEdit) {
self.cellEditTemplate = $templateCache.get('cellEditTemplate.html');
self.editableCellTemplate = colDef.editableCellTemplate || $templateCache.get('editableCellTemplate.html');
}
if (colDef.cellTemplate && !TEMPLATE_REGEXP.test(colDef.cellTemplate)) {
self.cellTemplate = $.ajax({
type: "GET",
url: colDef.cellTemplate,
async: false
}).responseText;
}
if (self.enableCellEdit && colDef.editableCellTemplate && !TEMPLATE_REGEXP.test(colDef.editableCellTemplate)) {
self.editableCellTemplate = $.ajax({
type: "GET",
url: colDef.editableCellTemplate,
async: false
}).responseText;
}
if (colDef.headerCellTemplate && !TEMPLATE_REGEXP.test(colDef.headerCellTemplate)) {
self.headerCellTemplate = $.ajax({
type: "GET",
url: colDef.headerCellTemplate,
async: false
}).responseText;
}
self.colIndex = function () {
var classes = self.pinned ? "pinned " : "";
classes += "col" + self.index + " colt" + self.index;
if (self.cellClass) {
classes += " " + self.cellClass;
}
return classes;
};
self.groupedByClass = function() {
return self.isGroupedBy ? "ngGroupedByIcon" : "ngGroupIcon";
};
self.toggleVisible = function() {
self.visible = !self.visible;
};
self.showSortButtonUp = function() {
return self.sortable ? self.sortDirection === DESC : self.sortable;
};
self.showSortButtonDown = function() {
return self.sortable ? self.sortDirection === ASC : self.sortable;
};
self.noSortVisible = function() {
return !self.sortDirection;
};
self.sort = function(evt) {
if (!self.sortable) {
return true; // column sorting is disabled, do nothing
}
var dir = self.sortDirection === ASC ? DESC : ASC;
self.sortDirection = dir;
config.sortCallback(self, evt);
return false;
};
self.gripClick = function() {
clicks++; //count clicks
if (clicks === 1) {
timer = setTimeout(function() {
//Here you can add a single click action.
clicks = 0; //after action performed, reset counter
}, delay);
} else {
clearTimeout(timer); //prevent single-click action
config.resizeOnDataCallback(self); //perform double-click action
clicks = 0; //after action performed, reset counter
}
};
self.gripOnMouseDown = function(event) {
$scope.isColumnResizing = true;
if (event.ctrlKey && !self.pinned) {
self.toggleVisible();
domUtilityService.BuildStyles($scope, grid);
return true;
}
event.target.parentElement.style.cursor = 'col-resize';
self.startMousePosition = event.clientX;
self.origWidth = self.width;
$(document).mousemove(self.onMouseMove);
$(document).mouseup(self.gripOnMouseUp);
return false;
};
self.onMouseMove = function(event) {
var diff = event.clientX - self.startMousePosition;
var newWidth = diff + self.origWidth;
self.width = (newWidth < self.minWidth ? self.minWidth : (newWidth > self.maxWidth ? self.maxWidth : newWidth));
$scope.hasUserChangedGridColumnWidths = true;
domUtilityService.BuildStyles($scope, grid);
return false;
};
self.gripOnMouseUp = function (event) {
$(document).off('mousemove', self.onMouseMove);
$(document).off('mouseup', self.gripOnMouseUp);
event.target.parentElement.style.cursor = 'default';
domUtilityService.digest($scope);
$scope.isColumnResizing = false;
return false;
};
self.copy = function() {
var ret = new ngColumn(config, $scope, grid, domUtilityService, $templateCache);
ret.isClone = true;
ret.orig = self;
return ret;
};
self.setVars = function (fromCol) {
self.orig = fromCol;
self.width = fromCol.width;
self.groupIndex = fromCol.groupIndex;
self.isGroupedBy = fromCol.isGroupedBy;
self.displayName = fromCol.displayName;
self.index = fromCol.index;
self.isAggCol = fromCol.isAggCol;
self.cellClass = fromCol.cellClass;
self.cellFilter = fromCol.cellFilter;
self.field = fromCol.field;
self.aggLabelFilter = fromCol.aggLabelFilter;
self.visible = fromCol.visible;
self.sortable = fromCol.sortable;
self.resizable = fromCol.resizable;
self.pinnable = fromCol.pinnable;
self.pinned = fromCol.pinned;
self.originalIndex = fromCol.originalIndex;
self.sortDirection = fromCol.sortDirection;
self.sortingAlgorithm = fromCol.sortingAlgorithm;
self.headerClass = fromCol.headerClass;
self.headerCellTemplate = fromCol.headerCellTemplate;
self.cellTemplate = fromCol.cellTemplate;
self.cellEditTemplate = fromCol.cellEditTemplate;
};
};
var ngDimension = function (options) {
this.outerHeight = null;
this.outerWidth = null;
$.extend(this, options);
};
var ngDomAccessProvider = function (grid) {
this.previousColumn = null;
this.grid = grid;
};
ngDomAccessProvider.prototype.changeUserSelect = function (elm, value) {
elm.css({
'-webkit-touch-callout': value,
'-webkit-user-select': value,
'-khtml-user-select': value,
'-moz-user-select': value === 'none' ? '-moz-none' : value,
'-ms-user-select': value,
'user-select': value
});
};
ngDomAccessProvider.prototype.focusCellElement = function ($scope, index) {
if ($scope.selectionProvider.lastClickedRow) {
var columnIndex = index !== undefined ? index : this.previousColumn;
var elm = $scope.selectionProvider.lastClickedRow.clone ? $scope.selectionProvider.lastClickedRow.clone.elm : $scope.selectionProvider.lastClickedRow.elm;
if (columnIndex !== undefined && elm) {
var columns = angular.element(elm[0].children).filter(function () { return this.nodeType !== 8; }); //Remove html comments for IE8
var i = Math.max(Math.min($scope.renderedColumns.length - 1, columnIndex), 0);
if (this.grid.config.showSelectionCheckbox && angular.element(columns[i]).scope() && angular.element(columns[i]).scope().col.index === 0) {
i = 1; //don't want to focus on checkbox
}
if (columns[i]) {
columns[i].children[1].children[0].focus();
}
this.previousColumn = columnIndex;
}
}
};
ngDomAccessProvider.prototype.selectionHandlers = function ($scope, elm) {
var doingKeyDown = false;
var self = this;
elm.bind('keydown', function (evt) {
if (evt.keyCode === 16) { //shift key
self.changeUserSelect(elm, 'none', evt);
return true;
} else if (!doingKeyDown) {
doingKeyDown = true;
var ret = ngMoveSelectionHandler($scope, elm, evt, self.grid);
doingKeyDown = false;
return ret;
}
return true;
});
elm.bind('keyup', function (evt) {
if (evt.keyCode === 16) { //shift key
self.changeUserSelect(elm, 'text', evt);
}
return true;
});
};
var ngEventProvider = function (grid, $scope, domUtilityService, $timeout) {
var self = this;
// The init method gets called during the ng-grid directive execution.
self.colToMove = undefined;
self.groupToMove = undefined;
self.assignEvents = function() {
// Here we set the onmousedown event handler to the header container.
if (grid.config.jqueryUIDraggable && !grid.config.enablePinning) {
grid.$groupPanel.droppable({
addClasses: false,
drop: function(event) {
self.onGroupDrop(event);
}
});
} else {
grid.$groupPanel.on('mousedown', self.onGroupMouseDown).on('dragover', self.dragOver).on('drop', self.onGroupDrop);
grid.$headerScroller.on('mousedown', self.onHeaderMouseDown).on('dragover', self.dragOver);
if (grid.config.enableColumnReordering && !grid.config.enablePinning) {
grid.$headerScroller.on('drop', self.onHeaderDrop);
}
}
$scope.$watch('renderedColumns', function() {
$timeout(self.setDraggables);
});
};
self.dragStart = function(evt){
//FireFox requires there to be dataTransfer if you want to drag and drop.
evt.dataTransfer.setData('text', ''); //cannot be empty string
};
self.dragOver = function(evt) {
evt.preventDefault();
};
//For JQueryUI
self.setDraggables = function() {
if (!grid.config.jqueryUIDraggable) {
//Fix for FireFox. Instead of using jQuery on('dragstart', function) on find, we have to use addEventListeners for each column.
var columns = grid.$root.find('.ngHeaderSortColumn'); //have to iterate if using addEventListener
angular.forEach(columns, function(col){
if(col.className && col.className.indexOf("ngHeaderSortColumn") !== -1){
col.setAttribute('draggable', 'true');
//jQuery 'on' function doesn't have dataTransfer as part of event in handler unless added to event props, which is not recommended
//See more here: http://api.jquery.com/category/events/event-object/
if (col.addEventListener) { //IE8 doesn't have drag drop or event listeners
col.addEventListener('dragstart', self.dragStart);
}
}
});
if (navigator.userAgent.indexOf("MSIE") !== -1){
//call native IE dragDrop() to start dragging
grid.$root.find('.ngHeaderSortColumn').bind('selectstart', function () {
this.dragDrop();
return false;
});
}
} else {
grid.$root.find('.ngHeaderSortColumn').draggable({
helper: 'clone',
appendTo: 'body',
stack: 'div',
addClasses: false,
start: function(event) {
self.onHeaderMouseDown(event);
}
}).droppable({
drop: function(event) {
self.onHeaderDrop(event);
}
});
}
};
self.onGroupMouseDown = function(event) {
var groupItem = $(event.target);
// Get the scope from the header container
if (groupItem[0].className !== 'ngRemoveGroup') {
var groupItemScope = angular.element(groupItem).scope();
if (groupItemScope) {
// set draggable events
if (!grid.config.jqueryUIDraggable) {
groupItem.attr('draggable', 'true');
if(this.addEventListener){//IE8 doesn't have drag drop or event listeners
this.addEventListener('dragstart', self.dragStart);
}
if (navigator.userAgent.indexOf("MSIE") !== -1){
//call native IE dragDrop() to start dragging
groupItem.bind('selectstart', function () {
this.dragDrop();
return false;
});
}
}
// Save the column for later.
self.groupToMove = { header: groupItem, groupName: groupItemScope.group, index: groupItemScope.$index };
}
} else {
self.groupToMove = undefined;
}
};
self.onGroupDrop = function(event) {
event.stopPropagation();
// clear out the colToMove object
var groupContainer;
var groupScope;
if (self.groupToMove) {
// Get the closest header to where we dropped
groupContainer = $(event.target).closest('.ngGroupElement'); // Get the scope from the header.
if (groupContainer.context.className === 'ngGroupPanel') {
$scope.configGroups.splice(self.groupToMove.index, 1);
$scope.configGroups.push(self.groupToMove.groupName);
} else {
groupScope = angular.element(groupContainer).scope();
if (groupScope) {
// If we have the same column, do nothing.
if (self.groupToMove.index !== groupScope.$index) {
// Splice the columns
$scope.configGroups.splice(self.groupToMove.index, 1);
$scope.configGroups.splice(groupScope.$index, 0, self.groupToMove.groupName);
}
}
}
self.groupToMove = undefined;
grid.fixGroupIndexes();
} else if (self.colToMove) {
if ($scope.configGroups.indexOf(self.colToMove.col) === -1) {
groupContainer = $(event.target).closest('.ngGroupElement'); // Get the scope from the header.
if (groupContainer.context.className === 'ngGroupPanel' || groupContainer.context.className === 'ngGroupPanelDescription ng-binding') {
$scope.groupBy(self.colToMove.col);
} else {
groupScope = angular.element(groupContainer).scope();
if (groupScope) {
// Splice the columns
$scope.removeGroup(groupScope.$index);
}
}
}
self.colToMove = undefined;
}
if (!$scope.$$phase) {
$scope.$apply();
}
};
//Header functions
self.onHeaderMouseDown = function(event) {
// Get the closest header container from where we clicked.
var headerContainer = $(event.target).closest('.ngHeaderSortColumn');
// Get the scope from the header container
var headerScope = angular.element(headerContainer).scope();
if (headerScope) {
// Save the column for later.
self.colToMove = { header: headerContainer, col: headerScope.col };
}
};
self.onHeaderDrop = function(event) {
if (!self.colToMove || self.colToMove.col.pinned) {
return;
}
// Get the closest header to where we dropped
var headerContainer = $(event.target).closest('.ngHeaderSortColumn');
// Get the scope from the header.
var headerScope = angular.element(headerContainer).scope();
if (headerScope) {
// If we have the same column, do nothing.
if (self.colToMove.col === headerScope.col) {
return;
}
// Splice the columns
$scope.columns.splice(self.colToMove.col.index, 1);
$scope.columns.splice(headerScope.col.index, 0, self.colToMove.col);
grid.fixColumnIndexes();
// clear out the colToMove object
self.colToMove = undefined;
domUtilityService.digest($scope);
}
};
self.assignGridEventHandlers = function() {
//Chrome and firefox both need a tab index so the grid can recieve focus.
//need to give the grid a tabindex if it doesn't already have one so
//we'll just give it a tab index of the corresponding gridcache index
//that way we'll get the same result every time it is run.
//configurable within the options.
if (grid.config.tabIndex === -1) {
grid.$viewport.attr('tabIndex', domUtilityService.numberOfGrids);
domUtilityService.numberOfGrids++;
} else {
grid.$viewport.attr('tabIndex', grid.config.tabIndex);
}
// resize on window resize
var windowThrottle;
$(window).resize(function(){
clearTimeout(windowThrottle);
windowThrottle = setTimeout(function() {
//in function for IE8 compatibility
domUtilityService.RebuildGrid($scope,grid);
}, 100);
});
// resize on parent resize as well.
var parentThrottle;
$(grid.$root.parent()).on('resize', function() {
clearTimeout(parentThrottle);
parentThrottle = setTimeout(function() {
//in function for IE8 compatibility
domUtilityService.RebuildGrid($scope,grid);
}, 100);
});
};
// In this example we want to assign grid events.
self.assignGridEventHandlers();
self.assignEvents();
};
var ngFooter = function ($scope, grid) {
$scope.maxRows = function () {
var ret = Math.max($scope.totalServerItems, grid.data.length);
return ret;
};
$scope.multiSelect = (grid.config.enableRowSelection && grid.config.multiSelect);
$scope.selectedItemCount = grid.selectedItemCount;
$scope.maxPages = function () {
return Math.ceil($scope.maxRows() / $scope.pagingOptions.pageSize);
};
$scope.pageForward = function() {
var page = $scope.pagingOptions.currentPage;
if ($scope.totalServerItems > 0) {
$scope.pagingOptions.currentPage = Math.min(page + 1, $scope.maxPages());
} else {
$scope.pagingOptions.currentPage++;
}
};
$scope.pageBackward = function() {
var page = $scope.pagingOptions.currentPage;
$scope.pagingOptions.currentPage = Math.max(page - 1, 1);
};
$scope.pageToFirst = function() {
$scope.pagingOptions.currentPage = 1;
};
$scope.pageToLast = function() {
var maxPages = $scope.maxPages();
$scope.pagingOptions.currentPage = maxPages;
};
$scope.cantPageForward = function() {
var curPage = $scope.pagingOptions.currentPage;
var maxPages = $scope.maxPages();
if ($scope.totalServerItems > 0) {
return curPage >= maxPages;
} else {
return grid.data.length < 1;
}
};
$scope.cantPageToLast = function() {
if ($scope.totalServerItems > 0) {
return $scope.cantPageForward();
} else {
return true;
}
};
$scope.cantPageBackward = function() {
var curPage = $scope.pagingOptions.currentPage;
return curPage <= 1;
};
};
/// 0\" class=\"ngGroupList\">" +
" - " +
" " +
" {{group.displayName}}" +
" x" +
" " +
" " +
" " +
"
" +
"
" +
" " +
" " +
" " +
" " +
" " +
"" +
"" +
" " +
" " +
" " +
"" +
"" +
""
);
$templateCache.put("headerCellTemplate.html",
"" +
" {{col.displayName}}" +
" " +
" " +
" {{col.sortPriority}}" +
" " +
"" +
""
);
$templateCache.put("headerRowTemplate.html",
"" +
" " +
" " +
""
);
$templateCache.put("menuTemplate.html",
"" +
" " +
"" +
"" +
" " +
" " +
" " +
" " +
""
);
$templateCache.put("rowTemplate.html",
"" +
" " +
" " +
""
);
}]);
}(window, jQuery));© 2015 - 2025 Weber Informatics LLC | Privacy Policy