diff options
Diffstat (limited to 'js/dojo/dojox/grid/enhanced/plugins/Pagination.js')
| -rw-r--r-- | js/dojo/dojox/grid/enhanced/plugins/Pagination.js | 974 |
1 files changed, 974 insertions, 0 deletions
diff --git a/js/dojo/dojox/grid/enhanced/plugins/Pagination.js b/js/dojo/dojox/grid/enhanced/plugins/Pagination.js new file mode 100644 index 0000000..244d79d --- /dev/null +++ b/js/dojo/dojox/grid/enhanced/plugins/Pagination.js @@ -0,0 +1,974 @@ +//>>built +require({cache:{ +'url:dojox/grid/enhanced/templates/Pagination.html':"<div dojoAttachPoint=\"paginatorBar\"\n\t><table cellpadding=\"0\" cellspacing=\"0\" class=\"dojoxGridPaginator\"\n\t\t><tr\n\t\t\t><td dojoAttachPoint=\"descriptionTd\" class=\"dojoxGridDescriptionTd\"\n\t\t\t\t><div dojoAttachPoint=\"descriptionDiv\" class=\"dojoxGridDescription\"></div\n\t\t\t></div></td\n\t\t\t><td dojoAttachPoint=\"sizeSwitchTd\"></td\n\t\t\t><td dojoAttachPoint=\"pageStepperTd\" class=\"dojoxGridPaginatorFastStep\"\n\t\t\t\t><div dojoAttachPoint=\"pageStepperDiv\" class=\"dojoxGridPaginatorStep\"></div\n\t\t\t></td\n\t\t\t><td dojoAttachPoint=\"gotoPageTd\" class=\"dojoxGridPaginatorGotoTd\"\n\t\t\t\t><div dojoAttachPoint=\"gotoPageDiv\" class=\"dojoxGridPaginatorGotoDiv\" dojoAttachEvent=\"onclick:_openGotopageDialog, onkeydown:_openGotopageDialog\"\n\t\t\t\t\t><span class=\"dojoxGridWardButtonInner\">⊥</span\n\t\t\t\t></div\n\t\t\t></td\n\t\t></tr\n\t></table\n></div>\n"}}); +define("dojox/grid/enhanced/plugins/Pagination", [ + "dojo/_base/kernel", + "dojo/_base/declare", + "dojo/_base/array", + "dojo/_base/connect", + "dojo/_base/lang", + "dojo/_base/html", + "dojo/_base/event", + "dojo/_base/window", + "dojo/query", + "dojo/string", + "dojo/i18n", + "dojo/keys", + "dojo/text!../templates/Pagination.html", + "./Dialog", + "./_StoreLayer", + "../_Plugin", + "../../EnhancedGrid", + "dijit/form/Button", + "dijit/form/NumberTextBox", + "dijit/focus", + "dijit/_Widget", + "dijit/_TemplatedMixin", + "dijit/_WidgetsInTemplateMixin", + "dojox/html/metrics", + "dojo/i18n!../nls/Pagination" +], function(kernel, declare, array, connect, lang, html, event, win, query, + string, i18n, keys, template, Dialog, layers, _Plugin, EnhancedGrid, + Button, NumberTextBox, dijitFocus, _Widget, _TemplatedMixin, _WidgetsInTemplateMixin, metrics){ + +var _GotoPagePane = declare("dojox.grid.enhanced.plugins.pagination._GotoPagePane", [_Widget, _TemplatedMixin, _WidgetsInTemplateMixin], { + templateString: "<div>" + + "<div class='dojoxGridDialogMargin' dojoAttachPoint='_mainMsgNode'></div>" + + "<div class='dojoxGridDialogMargin'>" + + "<input dojoType='dijit.form.NumberTextBox' style='width: 50px;' dojoAttachPoint='_pageInputBox' dojoAttachEvent='onKeyUp: _onKey'></input>" + + "<label dojoAttachPoint='_pageLabelNode'></label>" + + "</div>" + + "<div class='dojoxGridDialogButton'>" + + "<button dojoType='dijit.form.Button' dojoAttachPoint='_confirmBtn' dojoAttachEvent='onClick: _onConfirm'></button>" + + "<button dojoType='dijit.form.Button' dojoAttachPoint='_cancelBtn' dojoAttachEvent='onClick: _onCancel'></button>" + + "</div>" + + "</div>", + widgetsInTemplate: true, + dlg: null, + postMixInProperties: function(){ + this.plugin = this.dlg.plugin; + }, + postCreate: function(){ + this.inherited(arguments); + this._mainMsgNode.innerHTML = this.plugin._nls[12]; + this._confirmBtn.set("label", this.plugin._nls[14]); + this._confirmBtn.set("disabled", true); + this._cancelBtn.set("label", this.plugin._nls[15]); + }, + _onConfirm: function(evt){ + if(this._pageInputBox.isValid() && this._pageInputBox.getDisplayedValue() !== ""){ + this.plugin.currentPage(this._pageInputBox.parse(this._pageInputBox.getDisplayedValue())); + this.dlg._gotoPageDialog.hide(); + this._pageInputBox.reset(); + } + stopEvent(evt); + }, + _onCancel: function(evt){ + this._pageInputBox.reset(); + this.dlg._gotoPageDialog.hide(); + stopEvent(evt); + }, + _onKey: function(evt){ + this._confirmBtn.set("disabled", !this._pageInputBox.isValid() || this._pageInputBox.getDisplayedValue() == ""); + if(!evt.altKey && !evt.metaKey && evt.keyCode === keys.ENTER){ + this._onConfirm(evt); + } + } +}); + +var _GotoPageDialog = declare("dojox.grid.enhanced.plugins.pagination._GotoPageDialog", null, { + pageCount: 0, + dlgPane: null, + constructor: function(plugin){ + this.plugin = plugin; + this.dlgPane = new _GotoPagePane({"dlg": this}); + this.dlgPane.startup(); + this._gotoPageDialog = new Dialog({ + "refNode": plugin.grid.domNode, + "title": this.plugin._nls[11], + "content": this.dlgPane + }); + this._gotoPageDialog.startup(); + }, + _updatePageCount: function(){ + this.pageCount = this.plugin.getTotalPageNum(); + this.dlgPane._pageInputBox.constraints = {fractional:false, min:1, max:this.pageCount}; + this.dlgPane._pageLabelNode.innerHTML = string.substitute(this.plugin._nls[13], [this.pageCount]); + }, + showDialog: function(){ + this._updatePageCount(); + this._gotoPageDialog.show(); + }, + destroy: function(){ + this._gotoPageDialog.destroy(); + } +}); + +var _ForcedPageStoreLayer = declare("dojox.grid.enhanced.plugins._ForcedPageStoreLayer", layers._StoreLayer, { + tags: ["presentation"], + constructor: function(plugin){ + this._plugin = plugin; + }, + _fetch: function(request){ + var _this = this, + plugin = _this._plugin, + grid = plugin.grid, + scope = request.scope || win.global, + onBegin = request.onBegin; + request.start = (plugin._currentPage - 1) * plugin._currentPageSize + request.start; + _this.startIdx = request.start; + _this.endIdx = request.start + plugin._currentPageSize - 1; + var p = plugin._paginator; + if(!plugin._showAll){ + plugin._showAll = !p.sizeSwitch && !p.pageStepper && !p.gotoButton; + } + if(onBegin && plugin._showAll){ + request.onBegin = function(size, req){ + plugin._maxSize = plugin._currentPageSize = size; + _this.startIdx = 0; + _this.endIdx = size - 1; + plugin._paginator._update(); + req.onBegin = onBegin; + req.onBegin.call(scope, size, req); + }; + }else if(onBegin){ + request.onBegin = function(size, req){ + req.start = 0; + req.count = plugin._currentPageSize; + plugin._maxSize = size; + _this.endIdx = _this.endIdx >= size ? (size - 1) : _this.endIdx; + if(_this.startIdx > size && size !== 0){ + grid._pending_requests[req.start] = false; + plugin.firstPage(); + } + plugin._paginator._update(); + req.onBegin = onBegin; + req.onBegin.call(scope, Math.min(plugin._currentPageSize, (size - _this.startIdx)), req); + }; + } + return lang.hitch(this._store, this._originFetch)(request); + } +}); + +var stopEvent = function(evt){ + try{ + event.stop(evt); + }catch(e){} +}; + +var _Focus = declare("dojox.grid.enhanced.plugins.pagination._Focus", null, { + _focusedNode: null, + _isFocused: false, + constructor: function(paginator){ + this._pager = paginator; + var focusMgr = paginator.plugin.grid.focus; + paginator.plugin.connect(paginator, 'onSwitchPageSize', lang.hitch(this, '_onActive')); + paginator.plugin.connect(paginator, 'onPageStep', lang.hitch(this, '_onActive')); + paginator.plugin.connect(paginator, 'onShowGotoPageDialog', lang.hitch(this, '_onActive')); + paginator.plugin.connect(paginator, '_update', lang.hitch(this, '_moveFocus')); + }, + _onFocus: function(evt, step){ + var node, nodes; + if(!this._isFocused){ + node = this._focusedNode || query('[tabindex]', this._pager.domNode)[0]; + }else if(step && this._focusedNode){ + var dir = step > 0 ? -1 : 1, + tabindex = parseInt(this._focusedNode.getAttribute('tabindex'), 10) + dir; + while(tabindex >= -3 && tabindex < 0){ + node = query('[tabindex=' + tabindex + ']', this._pager.domNode)[0]; + if(node){ + break; + }else{ + tabindex += dir; + } + } + } + return this._focus(node, evt); + }, + _onBlur: function(evt, step){ + if(!step || !this._focusedNode){ + this._isFocused = false; + if(this._focusedNode && html.hasClass(this._focusedNode, 'dojoxGridButtonFocus')){ + html.removeClass(this._focusedNode, 'dojoxGridButtonFocus'); + } + return true; + } + var node, dir = step > 0 ? -1 : 1, + tabindex = parseInt(this._focusedNode.getAttribute('tabindex'), 10) + dir; + while(tabindex >= -3 && tabindex < 0){ + node = query('[tabindex=' + tabindex + ']', this._pager.domNode)[0]; + if(node){ + break; + }else{ + tabindex += dir; + } + } + if(!node){ + this._isFocused = false; + if(html.hasClass(this._focusedNode, 'dojoxGridButtonFocus')){ + html.removeClass(this._focusedNode, 'dojoxGridButtonFocus'); + } + } + return node ? false : true; + }, + _onMove: function(rowDelta, colDelta, evt){ + if(this._focusedNode){ + var tabindex = this._focusedNode.getAttribute('tabindex'), + delta = colDelta == 1 ? "nextSibling" : "previousSibling", + node = this._focusedNode[delta]; + while(node){ + if(node.getAttribute('tabindex') == tabindex){ + this._focus(node); + break; + } + node = node[delta]; + } + } + }, + _focus: function(node, evt){ + if(node){ + this._isFocused = true; + if(kernel.isIE && this._focusedNode){ + html.removeClass(this._focusedNode, 'dojoxGridButtonFocus'); + } + this._focusedNode = node; + node.focus(); + if(kernel.isIE){ + html.addClass(node, 'dojoxGridButtonFocus'); + } + stopEvent(evt); + return true; + } + return false; + }, + _onActive: function(e){ + this._focusedNode = e.target; + if(!this._isFocused){ + this._pager.plugin.grid.focus.focusArea('pagination' + this._pager.position); + } + }, + _moveFocus: function(){ + if(this._focusedNode && !this._focusedNode.getAttribute('tabindex')){ + var next = this._focusedNode.nextSibling; + while(next){ + if(next.getAttribute('tabindex')){ + this._focus(next); + return; + } + next = next.nextSibling; + } + var prev = this._focusedNode.previousSibling; + while(prev){ + if(prev.getAttribute('tabindex')){ + this._focus(prev); + return; + } + prev = prev.previousSibling; + } + this._focusedNode = null; + this._onBlur(); + }else if(kernel.isIE && this._focusedNode){ + html.addClass(this._focusedNode, 'dojoxGridButtonFocus'); + } + } +}); + +var _Paginator = declare("dojox.grid.enhanced.plugins._Paginator", [_Widget, _TemplatedMixin], { + templateString: template, + constructor: function(params){ + lang.mixin(this, params); + this.grid = this.plugin.grid; + }, + postCreate: function(){ + this.inherited(arguments); + var _this = this, g = this.grid; + this.plugin.connect(g, "_resize", lang.hitch(this, "_resetGridHeight")); + this._originalResize = g.resize; + g.resize = function(changeSize, resultSize){ + _this._changeSize = changeSize; + _this._resultSize = resultSize; + _this._originalResize.apply(g, arguments); + }; + this.focus = _Focus(this); + this._placeSelf(); + }, + destroy: function(){ + this.inherited(arguments); + this.grid.focus.removeArea("pagination" + this.position); + if(this._gotoPageDialog){ + this._gotoPageDialog.destroy(); + } + this.grid.resize = this._originalResize; + }, + onSwitchPageSize: function(/*Event*/evt){ + + }, + onPageStep: function(/*Event*/evt){ + + }, + onShowGotoPageDialog: function(/*Event*/evt){ + + }, + _update: function(){ + // summary: + // Function to update paging information and update + // pagination bar display. + this._updateDescription(); + this._updatePageStepper(); + this._updateSizeSwitch(); + this._updateGotoButton(); + }, + _registerFocus: function(isTop){ + // summary: + // Function to register pagination bar to focus manager. + var focusMgr = this.grid.focus, + name = "pagination" + this.position, + f = this.focus; + focusMgr.addArea({ + name: name, + onFocus: lang.hitch(this.focus, "_onFocus"), + onBlur: lang.hitch(this.focus, "_onBlur"), + onMove: lang.hitch(this.focus, "_onMove") + }); + focusMgr.placeArea(name, isTop ? "before" : "after", isTop ? "header" : "content"); + }, + _placeSelf: function(){ + // summary: + // Place pagination bar to a position. + // There are two options, top of the grid, bottom of the grid. + var g = this.grid, + isTop = this.position == "top"; + this.placeAt(isTop ? g.viewsHeaderNode : g.viewsNode, isTop ? "before" : "after"); + this._registerFocus(isTop); + }, + _resetGridHeight: function(changeSize, resultSize){ + // summary: + // Function of resize grid height to place this pagination bar. + // Since the grid would be able to add other element in its domNode, we have + // change the grid view size to place the pagination bar. + // This function will resize the grid viewsNode height, scorllboxNode height + var g = this.grid; + changeSize = changeSize || this._changeSize; + resultSize = resultSize || this._resultSize; + delete this._changeSize; + delete this._resultSize; + if(g._autoHeight){ + return; + } + var padBorder = g._getPadBorder().h; + if(!this.plugin.gh){ + this.plugin.gh = html.contentBox(g.domNode).h + 2 * padBorder; + } + if(resultSize){ + changeSize = resultSize; + } + if(changeSize){ + this.plugin.gh = html.contentBox(g.domNode).h + 2 * padBorder; + } + var gh = this.plugin.gh, + hh = g._getHeaderHeight(), + ph = html.marginBox(this.domNode).h; + // ph = this.plugin._paginator.position == "bottom" ? ph * 2 : ph; + if(typeof g.autoHeight === "number"){ + var cgh = gh + ph - padBorder; + html.style(g.domNode, "height", cgh + "px"); + html.style(g.viewsNode, "height", (cgh - ph - hh) + "px"); + this._styleMsgNode(hh, html.marginBox(g.viewsNode).w, cgh - ph - hh); + }else{ + var h = gh - ph - hh - padBorder; + html.style(g.viewsNode, "height", h + "px"); + var hasHScroller = array.some(g.views.views, function(v){ + return v.hasHScrollbar(); + }); + array.forEach(g.viewsNode.childNodes, function(c){ + html.style(c, "height", h + "px"); + }); + array.forEach(g.views.views, function(v){ + if(v.scrollboxNode){ + if(!v.hasHScrollbar() && hasHScroller){ + html.style(v.scrollboxNode, "height", (h - metrics.getScrollbar().h) + "px"); + }else{ + html.style(v.scrollboxNode, "height", h + "px"); + } + } + }); + this._styleMsgNode(hh, html.marginBox(g.viewsNode).w, h); + } + }, + _styleMsgNode: function(top, width, height){ + var messagesNode = this.grid.messagesNode; + html.style(messagesNode, {"position": "absolute", "top": top + "px", "width": width + "px", "height": height + "px", "z-Index": "100"}); + }, + _updateDescription: function(){ + // summary: + // Update size information. + var s = this.plugin.forcePageStoreLayer, + maxSize = this.plugin._maxSize, + nls = this.plugin._nls, + getItemTitle = function(){ + return maxSize <= 0 || maxSize == 1 ? nls[5] : nls[4]; + }; + if(this.description && this.descriptionDiv){ + this.descriptionDiv.innerHTML = maxSize > 0 ? string.substitute(nls[0], [getItemTitle(), maxSize, s.startIdx + 1, s.endIdx + 1]) : "0 " + getItemTitle(); + } + }, + _updateSizeSwitch: function(){ + // summary: + // Update "items per page" information. + html.style(this.sizeSwitchTd, "display", this.sizeSwitch ? "" : "none"); + if(!this.sizeSwitch){ + return; + } + if(this.sizeSwitchTd.childNodes.length < 1){ + this._createSizeSwitchNodes(); + } + this._updateSwitchNodesStyle(); + }, + _createSizeSwitchNodes: function(){ + // summary: + // The function to create the size switch nodes + var node = null, + nls = this.plugin._nls, + connect = lang.hitch(this.plugin, 'connect'); + array.forEach(this.pageSizes, function(size){ + // create page size switch node + var labelValue = isFinite(size) ? string.substitute(nls[2], [size]) : nls[1], + value = isFinite(size) ? size : nls[16]; + node = html.create("span", {innerHTML: value, title: labelValue, value: size, tabindex: "-1"}, this.sizeSwitchTd, "last"); + // for accessibility + node.setAttribute("aria-label", labelValue); + // connect event + connect(node, "onclick", lang.hitch(this, "_onSwitchPageSize")); + connect(node, "onkeydown", lang.hitch(this, "_onSwitchPageSize")); + connect(node, "onmouseover", function(e){ + html.addClass(e.target, "dojoxGridPageTextHover"); + }); + connect(node, "onmouseout", function(e){ + html.removeClass(e.target, "dojoxGridPageTextHover"); + }); + // create a separation node + node = html.create("span", {innerHTML: "|"}, this.sizeSwitchTd, "last"); + html.addClass(node, "dojoxGridSeparator"); + }, this); + // delete last separation node + html.destroy(node); + }, + _updateSwitchNodesStyle: function(){ + // summary: + // Update the switch nodes style + var size = null; + var styleNode = function(node, status){ + if(status){ + html.addClass(node, "dojoxGridActivedSwitch"); + html.removeAttr(node, "tabindex"); + }else{ + html.addClass(node, "dojoxGridInactiveSwitch"); + node.setAttribute("tabindex", "-1"); + } + }; + array.forEach(this.sizeSwitchTd.childNodes, function(node){ + if(node.value){ + html.removeClass(node); + size = node.value; + if(this.plugin._showAll){ + styleNode(node, isNaN(parseInt(size, 10))); + }else{ + styleNode(node, this.plugin._currentPageSize == size); + } + } + }, this); + }, + _updatePageStepper: function(){ + // summary: + // Update the page step nodes + html.style(this.pageStepperTd, "display", this.pageStepper ? "" : "none"); + if(!this.pageStepper){ + return; + } + if(this.pageStepperDiv.childNodes.length < 1){ + this._createPageStepNodes(); + this._createWardBtns(); + }else{ + this._resetPageStepNodes(); + } + this._updatePageStepNodesStyle(); + }, + _createPageStepNodes: function(){ + // summary: + // Create the page step nodes if they do not exist + var startPage = this._getStartPage(), + stepSize = this._getStepPageSize(), + label = "", node = null, i = startPage, + connect = lang.hitch(this.plugin, 'connect'); + for(; i < startPage + this.maxPageStep + 1; i++){ + label = string.substitute(this.plugin._nls[3], [i]); + node = html.create("div", {innerHTML: i, value: i, title: label}, this.pageStepperDiv, "last"); + node.setAttribute("aria-label", label); + // connect event + connect(node, "onclick", lang.hitch(this, "_onPageStep")); + connect(node, "onkeydown", lang.hitch(this, "_onPageStep")); + connect(node, "onmouseover", function(e){ + html.addClass(e.target, "dojoxGridPageTextHover"); + }); + connect(node, "onmouseout", function(e){ + html.removeClass(e.target, "dojoxGridPageTextHover"); + }); + html.style(node, "display", i < startPage + stepSize ? "" : "none"); + } + }, + _createWardBtns: function(){ + // summary: + // Create the previous/next/first/last button + var _this = this, nls = this.plugin._nls; + var highContrastLabel = {prevPage: "<", firstPage: "«", nextPage: ">", lastPage: "»"}; + var createWardBtn = function(value, label, position){ + var node = html.create("div", {value: value, title: label, tabindex: "-2"}, _this.pageStepperDiv, position); + _this.plugin.connect(node, "onclick", lang.hitch(_this, "_onPageStep")); + _this.plugin.connect(node, "onkeydown", lang.hitch(_this, "_onPageStep")); + node.setAttribute("aria-label", label); + // for high contrast + var highConrastNode = html.create("span", {value: value, title: label, innerHTML: highContrastLabel[value]}, node, position); + html.addClass(highConrastNode, "dojoxGridWardButtonInner"); + }; + createWardBtn("prevPage", nls[6], "first"); + createWardBtn("firstPage", nls[7], "first"); + createWardBtn("nextPage", nls[8], "last"); + createWardBtn("lastPage", nls[9], "last"); + }, + _resetPageStepNodes: function(){ + // summary: + // The page step nodes might be changed when fetch data, we need to + // update/reset them + var startPage = this._getStartPage(), + stepSize = this._getStepPageSize(), + stepNodes = this.pageStepperDiv.childNodes, + node = null, i = startPage, j = 2, tip; + for(; j < stepNodes.length - 2; j++, i++){ + node = stepNodes[j]; + if(i < startPage + stepSize){ + tip = string.substitute(this.plugin._nls[3], [i]); + html.attr(node, { + "innerHTML": i, + "title": tip, + "value": i + }); + html.style(node, "display", ""); + node.setAttribute("aria-label", tip); + }else{ + html.style(node, "display", "none"); + } + } + }, + _updatePageStepNodesStyle: function(){ + // summary: + // Update the style of the page step nodes + var value = null, + curPage = this.plugin.currentPage(), + pageCount = this.plugin.getTotalPageNum(); + var updateClass = function(node, isWardBtn, status){ + var value = node.value, + enableClass = isWardBtn ? "dojoxGrid" + value + "Btn" : "dojoxGridInactived", + disableClass = isWardBtn ? "dojoxGrid" + value + "BtnDisable" : "dojoxGridActived"; + if(status){ + html.addClass(node, disableClass); + html.removeAttr(node, "tabindex"); + }else{ + html.addClass(node, enableClass); + node.setAttribute("tabindex", "-2"); + } + }; + array.forEach(this.pageStepperDiv.childNodes, function(node){ + html.removeClass(node); + if(isNaN(parseInt(node.value, 10))){ + html.addClass(node, "dojoxGridWardButton"); + var disablePageNum = node.value == "prevPage" || node.value == "firstPage" ? 1 : pageCount; + updateClass(node, true, (curPage === disablePageNum)); + }else{ + value = parseInt(node.value, 10); + updateClass(node, false, (value === curPage || html.style(node, "display") === "none")); + } + }, this); + }, + _showGotoButton: function(flag){ + this.gotoButton = flag; + this._updateGotoButton(); + }, + _updateGotoButton: function(){ + // summary: + // Create/destroy the goto page button + if(!this.gotoButton){ + if(this._gotoPageDialog){ + this._gotoPageDialog.destroy(); + } + html.removeAttr(this.gotoPageDiv, "tabindex"); + html.style(this.gotoPageTd, 'display', 'none'); + return; + } + if(html.style(this.gotoPageTd, 'display') == 'none'){ + html.style(this.gotoPageTd, 'display', ''); + } + this.gotoPageDiv.setAttribute('title', this.plugin._nls[10]); + html.toggleClass(this.gotoPageDiv, "dojoxGridPaginatorGotoDivDisabled", this.plugin.getTotalPageNum() <= 1); + if(this.plugin.getTotalPageNum() <= 1){ + html.removeAttr(this.gotoPageDiv, "tabindex"); + }else{ + this.gotoPageDiv.setAttribute("tabindex", "-3"); + } + }, + _openGotopageDialog: function(e){ + // summary: + // Show the goto page dialog + if(this.plugin.getTotalPageNum() <= 1){ + return; + } + if(e.type === "keydown" && e.keyCode !== keys.ENTER && e.keyCode !== keys.SPACE){ + return; + } + if(!this._gotoPageDialog){ + this._gotoPageDialog = new _GotoPageDialog(this.plugin); + } + this._gotoPageDialog.showDialog(); + this.onShowGotoPageDialog(e); + }, + _onSwitchPageSize: function(/*Event*/e){ + // summary: + // The handler of switch the page size + if(e.type === "keydown" && e.keyCode !== keys.ENTER && e.keyCode !== keys.SPACE){ + return; + } + this.onSwitchPageSize(e); + this.plugin.currentPageSize(e.target.value); + }, + _onPageStep: function(/*Event*/e){ + // summary: + // The handler jump page event + if(e.type === "keydown" && e.keyCode !== keys.ENTER && e.keyCode !== keys.SPACE){ + return; + } + var p = this.plugin, + value = e.target.value; + this.onPageStep(e); + if(!isNaN(parseInt(value, 10))){ + p.currentPage(parseInt(value, 10)); + }else{ + p[value](); + } + }, + _getStartPage: function(){ + var cp = this.plugin.currentPage(), + ms = this.maxPageStep, + hs = parseInt(ms / 2, 10), + tp = this.plugin.getTotalPageNum(); + if(cp < hs || (cp - hs) < 1 || tp <= ms){ + return 1; + }else{ + return tp - cp < hs && cp - ms >= 0 ? tp - ms + 1 : cp - hs; + } + }, + _getStepPageSize: function(){ + var sp = this._getStartPage(), + tp = this.plugin.getTotalPageNum(), + ms = this.maxPageStep; + return sp + ms > tp ? tp - sp + 1 : ms; + } +}); + +var Pagination = declare("dojox.grid.enhanced.plugins.Pagination", _Plugin, { + // summary: + // The typical pagination way to deal with huge dataset + // an alternative for the default virtual scrolling manner. + name: "pagination", + // defaultPageSize: Integer + // Number of rows in a page, 25 by default. + defaultPageSize: 25, + // defaultPage: Integer + // Which page will be displayed initially, 1st page by default. + defaultPage: 1, + // description: boolean + // Whether the description information will be displayed, true by default. + description: true, + // sizeSwitch: boolean + // Whether the page size switch options will be displayed, true by default. + sizeSwitch: true, + // pageStepper: boolean + // Whether the page switch options will be displayed, true by default. + pageStepper: true, + // gotoButton: boolean + // Whether the goto page button will be displayed, false by default. + gotoButton: false, + // pageSizes: Array + // Array of page sizes for switching, e.g. [10, 25, 50, 100, Infinity] by default, + // Infinity or any NaN value will be treated as "all". + pageSizes: [10, 25, 50, 100, Infinity], + // maxPageStep: Integer + // The max number of page sizes to be displayed, 7 by default. + maxPageStep: 7, + // position: string + // The position of the pagination bar - "top"|"bottom", "bottom" by default. + position: 'bottom', + + init: function(){ + var g = this.grid; + g.usingPagination = true; + this._initOptions(); + this._currentPage = this.defaultPage; + this._currentPageSize = this.grid.rowsPerPage = this.defaultPageSize; + // wrap store layer + this._store = g.store; + this.forcePageStoreLayer = new _ForcedPageStoreLayer(this); + layers.wrap(g, "_storeLayerFetch", this.forcePageStoreLayer); + // create pagination bar + this._paginator = this.option.position != "top" ? + new _Paginator(lang.mixin(this.option, {position: "bottom", plugin: this})) : + new _Paginator(lang.mixin(this.option, {position: "top", plugin: this})); + this._regApis(); + }, + destroy: function(){ + this.inherited(arguments); + this._paginator.destroy(); + var g = this.grid; + g.unwrap(this.forcePageStoreLayer.name()); + g.scrollToRow = this._gridOriginalfuncs[0]; + g._onNew = this._gridOriginalfuncs[1]; + g.removeSelectedRows = this._gridOriginalfuncs[2]; + this._paginator = null; + this._nls = null; + }, + currentPage: function(page){ + // summary: + // Shift to the given page, return current page number. If there + // is no valid page was passed in, just return current page num. + // page: Integer + // The page to go to, starting at 1. + // return: + // Current page number + if(page <= this.getTotalPageNum() && page > 0 && this._currentPage !== page){ + this._currentPage = page; + this.grid._refresh(true); + this.grid.resize(); + } + return this._currentPage; + }, + nextPage: function(){ + // summary: + // Go to the next page. + this.currentPage(this._currentPage + 1); + }, + prevPage: function(){ + // summary: + // Go to the previous page. + this.currentPage(this._currentPage - 1); + }, + firstPage: function(){ + // summary: + // Go to the first page + this.currentPage(1); + }, + lastPage: function(){ + // summary: + // Go to the last page + this.currentPage(this.getTotalPageNum()); + }, + currentPageSize: function(size){ + // summary: + // Change the size of current page or return the current page size. + // size: Integer || null + // An integer identifying the number of rows per page. If the size + // is an Infinity, all rows will be displayed; if an invalid value pssed + // in, the current page size will be returned. + // return + // Current size of items per page. + if(!isNaN(size)){ + var g = this.grid, + startIndex = this._currentPageSize * (this._currentPage - 1), endIndex; + this._showAll = !isFinite(size); + this.grid.usingPagination = !this._showAll; + this._currentPageSize = this._showAll ? this._maxSize : size; + g.rowsPerPage = this._showAll ? this._defaultRowsPerPage : size; + endIndex = startIndex + Math.min(this._currentPageSize, this._maxSize); + if(endIndex > this._maxSize){ + this.lastPage(); + }else{ + var cp = Math.ceil(startIndex / this._currentPageSize) + 1; + if(cp !== this._currentPage){ + this.currentPage(cp); + }else{ + this.grid._refresh(true); + } + } + this.grid.resize(); + } + return this._currentPageSize; + }, + getTotalPageNum: function(){ + // summary: + // Get total page number + return Math.ceil(this._maxSize / this._currentPageSize); + }, + getTotalRowCount: function(){ + // summary: + // Function for get total row count + return this._maxSize; + }, + scrollToRow: function(inRowIndex){ + // summary: + // Override the grid.scrollToRow(), could jump to the right page + // and scroll to the specific row + // inRowIndex: integer + // The row index + var page = parseInt(inRowIndex / this._currentPageSize, 10) + 1; + if(page > this.getTotalPageNum()){ + return; + } + this.currentPage(page); + var rowIdx = inRowIndex % this._currentPageSize; + return this._gridOriginalfuncs[0](rowIdx); + }, + removeSelectedRows: function(){ + this._multiRemoving = true; + this._gridOriginalfuncs[2].apply(); + this._multiRemoving = false; + this.grid.resize(); + this.grid._refresh(); + }, + showGotoPageButton: function(flag){ + // summary: + // For show/hide the go to page button dynamically + // flag: boolean + // Show the go to page button when flag is true, otherwise hide it + this._paginator.gotoButton = flag; + this._paginator._updateGotoButton(); + }, + // [DEPRECATED] ============ + gotoPage: function(page){ + kernel.deprecated("dojox.grid.enhanced.EnhancedGrid.gotoPage(page)", "use dojox.grid.enhanced.EnhancedGrid.currentPage(page) instead", "1.8"); + this.currentPage(page); + }, + gotoFirstPage: function(){ + kernel.deprecated("dojox.grid.enhanced.EnhancedGrid.gotoFirstPage()", "use dojox.grid.enhanced.EnhancedGrid.firstPage() instead", "1.8"); + this.firstPage(); + }, + gotoLastPage: function(){ + kernel.deprecated("dojox.grid.enhanced.EnhancedGrid.gotoLastPage()", "use dojox.grid.enhanced.EnhancedGrid.lastPage() instead", "1.8"); + this.lastPage(); + }, + changePageSize: function(size){ + kernel.deprecated("dojox.grid.enhanced.EnhancedGrid.changePageSize(size)", "use dojox.grid.enhanced.EnhancedGrid.currentPageSize(size) instead", "1.8"); + this.currentPageSize(size); + }, + // =============== Protected ================ + _nls: null, + _showAll: false, + _maxSize: 0, + // =============== Private =============== + _defaultRowsPerPage: 25, + _currentPage: 1, + _currentPageSize: 25, + + _initOptions: function(){ + this._defaultRowsPerPage = this.grid.rowsPerPage || 25; + this.defaultPage = this.option.defaultPage >= 1 ? parseInt(this.option.defaultPage, 10) : 1; + this.option.description = this.option.description !== undefined ? !!this.option.description : this.description; + this.option.sizeSwitch = this.option.sizeSwitch !== undefined ? !!this.option.sizeSwitch : this.sizeSwitch; + this.option.pageStepper = this.option.pageStepper !== undefined ? !!this.option.pageStepper : this.pageStepper; + this.option.gotoButton = this.option.gotoButton !== undefined ? !!this.option.gotoButton : this.gotoButton; + if(lang.isArray(this.option.pageSizes)){ + var pageSizes = []; + array.forEach(this.option.pageSizes, function(size){ + size = typeof size == 'number' ? size : parseInt(size, 10); + if(!isNaN(size) && size > 0){ + pageSizes.push(size); + }else if(array.indexOf(pageSizes, Infinity) < 0){ + pageSizes.push(Infinity); + } + }, this); + this.option.pageSizes = pageSizes.sort(function(a, b){return a - b;}); + }else{ + this.option.pageSizes = this.pageSizes; + } + this.defaultPageSize = this.option.defaultPageSize >= 1 ? parseInt(this.option.defaultPageSize, 10) : this.pageSizes[0]; + this.option.maxPageStep = this.option.maxPageStep > 0 ? this.option.maxPageStep : this.maxPageStep; + this.option.position = lang.isString(this.option.position) ? this.option.position.toLowerCase() : this.position; + var nls = i18n.getLocalization("dojox.grid.enhanced", "Pagination"); + this._nls = [ + nls.descTemplate, + nls.allItemsLabelTemplate, + nls.pageSizeLabelTemplate, + nls.pageStepLabelTemplate, + nls.itemTitle, + nls.singularItemTitle, + nls.prevTip, + nls.firstTip, + nls.nextTip, + nls.lastTip, + nls.gotoButtonTitle, + nls.dialogTitle, + nls.dialogIndication, + nls.pageCountIndication, + nls.dialogConfirm, + nls.dialogCancel, + nls.all + ]; + }, + _regApis: function(){ + var g = this.grid; + // New added APIs + g.currentPage = lang.hitch(this, this.currentPage); + g.nextPage = lang.hitch(this, this.nextPage); + g.prevPage = lang.hitch(this, this.prevPage); + g.firstPage = lang.hitch(this, this.firstPage); + g.lastPage = lang.hitch(this, this.lastPage); + g.currentPageSize = lang.hitch(this, this.currentPageSize); + g.showGotoPageButton = lang.hitch(this, this.showGotoPageButton); + g.getTotalRowCount = lang.hitch(this, this.getTotalRowCount); + g.getTotalPageNum = lang.hitch(this, this.getTotalPageNum); + + g.gotoPage = lang.hitch(this, this.gotoPage); + g.gotoFirstPage = lang.hitch(this, this.gotoFirstPage); + g.gotoLastPage = lang.hitch(this, this.gotoLastPage); + g.changePageSize = lang.hitch(this, this.changePageSize); + // Changed APIs + this._gridOriginalfuncs = [ + lang.hitch(g, g.scrollToRow), + lang.hitch(g, g._onNew), + lang.hitch(g, g.removeSelectedRows) + ]; + g.scrollToRow = lang.hitch(this, this.scrollToRow); + g.removeSelectedRows = lang.hitch(this, this.removeSelectedRows); + g._onNew = lang.hitch(this, this._onNew); + this.connect(g, "_onDelete", lang.hitch(this, this._onDelete)); + }, + _onNew: function(item, parentInfo){ + var totalPages = this.getTotalPageNum(); + if(((this._currentPage === totalPages || totalPages === 0) && this.grid.get('rowCount') < this._currentPageSize) || this._showAll){ + lang.hitch(this.grid, this._gridOriginalfuncs[1])(item, parentInfo); + this.forcePageStoreLayer.endIdx++; + } + this._maxSize++; + if(this._showAll){ + this._currentPageSize++; + } + if(this._showAll && this.grid.autoHeight){ + this.grid._refresh(); + }else{ + this._paginator._update(); + } + }, + _onDelete: function(){ + if(!this._multiRemoving){ + this.grid.resize(); + if(this._showAll){ + this.grid._refresh(); + } + } + if(this.grid.get('rowCount') === 0){ + this.prevPage(); + } + } +}); + +EnhancedGrid.registerPlugin(Pagination/*name:'pagination'*/); + +return Pagination; + +});
\ No newline at end of file |
