123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978 |
- 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{
- if(evt){
- 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 = (g.domNode.clientHeight || html.style(g.domNode, 'height')) + 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;
- if(this.grid.store.save){
- this.grid.store.save();
- }
- 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;
- });
|