diff --git a/manager/assets/modext/widgets/core/modx.grid.js b/manager/assets/modext/widgets/core/modx.grid.js index 1a53fb18dd4..6ddde1741db 100644 --- a/manager/assets/modext/widgets/core/modx.grid.js +++ b/manager/assets/modext/widgets/core/modx.grid.js @@ -741,4 +741,251 @@ Ext.reg('grid-local',MODx.grid.LocalGrid); Ext.reg('modx-grid-local',MODx.grid.LocalGrid); /* grid extensions */ -Ext.ns('Ext.ux.grid');Ext.ux.grid.RowExpander=Ext.extend(Ext.util.Observable,{expandOnEnter:true,expandOnDblClick:true,header:'',width:20,sortable:false,fixed:true,menuDisabled:true,dataIndex:'',id:'expander',lazyRender:true,enableCaching:false,constructor:function(a){Ext.apply(this,a);this.addEvents({beforeexpand:true,expand:true,beforecollapse:true,collapse:true});Ext.ux.grid.RowExpander.superclass.constructor.call(this);if(this.tpl){if(typeof this.tpl=='string'){this.tpl=new Ext.Template(this.tpl)}this.tpl.compile()}this.state={};this.bodyContent={}},getRowClass:function(a,b,p,c){p.cols=p.cols-1;var d=this.bodyContent[a.id];if(!d&&!this.lazyRender){d=this.getBodyContent(a,b)}if(d){p.body=d}return this.state[a.id]?'x-grid3-row-expanded':'x-grid3-row-collapsed'},init:function(a){this.grid=a;var b=a.getView();b.getRowClass=this.getRowClass.createDelegate(this);b.enableRowBody=true;a.on('render',this.onRender,this);a.on('destroy',this.onDestroy,this)},onRender:function(){var a=this.grid;var b=a.getView().mainBody;b.on('mousedown',this.onMouseDown,this,{delegate:'.x-grid3-row-expander'});if(this.expandOnEnter){this.keyNav=new Ext.KeyNav(this.grid.getGridEl(),{'enter':this.onEnter,scope:this})}if(this.expandOnDblClick){a.on('rowdblclick',this.onRowDblClick,this)}},onDestroy:function(){this.keyNav.disable();delete this.keyNav;var a=this.grid.getView().mainBody;a.un('mousedown',this.onMouseDown,this)},onRowDblClick:function(a,b,e){this.toggleRow(b)},onEnter:function(e){var g=this.grid;var a=g.getSelectionModel();var b=a.getSelections();for(var i=0,len=b.length;i '},beforeExpand:function(a,b,c){if(this.fireEvent('beforeexpand',this,a,b,c)!==false){if(this.tpl&&this.lazyRender){b.innerHTML=this.getBodyContent(a,c)}return true}else{return false}},toggleRow:function(a){if(typeof a=='number'){a=this.grid.view.getRow(a)}this[Ext.fly(a).hasClass('x-grid3-row-collapsed')?'expandRow':'collapseRow'](a)},expandRow:function(a){if(typeof a=='number'){a=this.grid.view.getRow(a)}var b=this.grid.store.getAt(a.rowIndex);var c=Ext.DomQuery.selectNode('tr:nth(2) div.x-grid3-row-body',a);if(this.beforeExpand(b,c,a.rowIndex)){this.state[b.id]=true;Ext.fly(a).replaceClass('x-grid3-row-collapsed','x-grid3-row-expanded');this.fireEvent('expand',this,b,c,a.rowIndex)}},collapseRow:function(a){if(typeof a=='number'){a=this.grid.view.getRow(a)}var b=this.grid.store.getAt(a.rowIndex);var c=Ext.fly(a).child('tr:nth(1) div.x-grid3-row-body',true);if(this.fireEvent('beforecollapse',this,b,c,a.rowIndex)!==false){this.state[b.id]=false;Ext.fly(a).replaceClass('x-grid3-row-expanded','x-grid3-row-collapsed');this.fireEvent('collapse',this,b,c,a.rowIndex)}},expandAll:function(){var a=this.grid.getView().getRows();for(var i=0;i '}};Ext.preg('checkcolumn',Ext.ux.grid.CheckColumn);Ext.grid.CheckColumn=Ext.ux.grid.CheckColumn;Ext.grid.PropertyColumnModel=function(a,b){var g=Ext.grid,f=Ext.form;this.grid=a;g.PropertyColumnModel.superclass.constructor.call(this,[{header:this.nameText,width:50,sortable:true,dataIndex:'name',id:'name',menuDisabled:true},{header:this.valueText,width:50,resizable:false,dataIndex:'value',id:'value',menuDisabled:true}]);this.store=b;var c=new f.Field({autoCreate:{tag:'select',children:[{tag:'option',value:'true',html:'true'},{tag:'option',value:'false',html:'false'}]},getValue:function(){return this.el.dom.value=='true'}});this.editors={'date':new g.GridEditor(new f.DateField({selectOnFocus:true})),'string':new g.GridEditor(new f.TextField({selectOnFocus:true})),'number':new g.GridEditor(new f.NumberField({selectOnFocus:true,style:'text-align:left;'})),'boolean':new g.GridEditor(c)};this.renderCellDelegate=this.renderCell.createDelegate(this);this.renderPropDelegate=this.renderProp.createDelegate(this)};Ext.extend(Ext.grid.PropertyColumnModel,Ext.grid.ColumnModel,{nameText:'Name',valueText:'Value',dateFormat:'m/j/Y',renderDate:function(a){return a.dateFormat(this.dateFormat)},renderBool:function(a){return a?'true':'false'},isCellEditable:function(a,b){return a==1},getRenderer:function(a){return a==1?this.renderCellDelegate:this.renderPropDelegate},renderProp:function(v){return this.getPropertyName(v)},renderCell:function(a){var b=a;if(Ext.isDate(a)){b=this.renderDate(a)}else if(typeof a=='boolean'){b=this.renderBool(a)}return Ext.util.Format.htmlEncode(b)},getPropertyName:function(a){var b=this.grid.propertyNames;return b&&b[a]?b[a]:a},getCellEditor:function(a,b){var p=this.store.getProperty(b),n=p.data.name,val=p.data.value;if(this.grid.customEditors[n]){return this.grid.customEditors[n]}if(Ext.isDate(val)){return this.editors.date}else if(typeof val=='number'){return this.editors.number}else if(typeof val=='boolean'){return this.editors['boolean']}else{return this.editors.string}},destroy:function(){Ext.grid.PropertyColumnModel.superclass.destroy.call(this);for(var a in this.editors){Ext.destroy(a)}}}); +/*! + * Ext JS Library 3.4.0 + * Copyright(c) 2006-2011 Sencha Inc. + * licensing@sencha.com + * http://www.sencha.com/license + */ +Ext.ns('Ext.ux.grid'); + +/** + * @class Ext.ux.grid.RowExpander + * @extends Ext.util.Observable + * Plugin (ptype = 'rowexpander') that adds the ability to have a Column in a grid which enables + * a second row body which expands/contracts. The expand/contract behavior is configurable to react + * on clicking of the column, double click of the row, and/or hitting enter while a row is selected. + * + * @ptype rowexpander + */ +Ext.ux.grid.RowExpander = Ext.extend(Ext.util.Observable, { + /** + * @cfg {Boolean} expandOnEnter + * true to toggle selected row(s) between expanded/collapsed when the enter + * key is pressed (defaults to true). + */ + expandOnEnter : true, + /** + * @cfg {Boolean} expandOnDblClick + * true to toggle a row between expanded/collapsed when double clicked + * (defaults to true). + */ + expandOnDblClick : true, + + header : '', + width : 20, + sortable : false, + fixed : true, + hideable: false, + menuDisabled : true, + dataIndex : '', + id : 'expander', + lazyRender : true, + enableCaching : true, + + constructor: function(config){ + Ext.apply(this, config); + + this.addEvents({ + /** + * @event beforeexpand + * Fires before the row expands. Have the listener return false to prevent the row from expanding. + * @param {Object} this RowExpander object. + * @param {Object} Ext.data.Record Record for the selected row. + * @param {Object} body body element for the secondary row. + * @param {Number} rowIndex The current row index. + */ + beforeexpand: true, + /** + * @event expand + * Fires after the row expands. + * @param {Object} this RowExpander object. + * @param {Object} Ext.data.Record Record for the selected row. + * @param {Object} body body element for the secondary row. + * @param {Number} rowIndex The current row index. + */ + expand: true, + /** + * @event beforecollapse + * Fires before the row collapses. Have the listener return false to prevent the row from collapsing. + * @param {Object} this RowExpander object. + * @param {Object} Ext.data.Record Record for the selected row. + * @param {Object} body body element for the secondary row. + * @param {Number} rowIndex The current row index. + */ + beforecollapse: true, + /** + * @event collapse + * Fires after the row collapses. + * @param {Object} this RowExpander object. + * @param {Object} Ext.data.Record Record for the selected row. + * @param {Object} body body element for the secondary row. + * @param {Number} rowIndex The current row index. + */ + collapse: true + }); + + Ext.ux.grid.RowExpander.superclass.constructor.call(this); + + if(this.tpl){ + if(typeof this.tpl == 'string'){ + this.tpl = new Ext.Template(this.tpl); + } + this.tpl.compile(); + } + + this.state = {}; + this.bodyContent = {}; + }, + + getRowClass : function(record, rowIndex, p, ds){ + p.cols = p.cols-1; + var content = this.bodyContent[record.id]; + if(!content && !this.lazyRender){ + content = this.getBodyContent(record, rowIndex); + } + if(content){ + p.body = content; + } + return this.state[record.id] ? 'x-grid3-row-expanded' : 'x-grid3-row-collapsed'; + }, + + init : function(grid){ + this.grid = grid; + + var view = grid.getView(); + view.getRowClass = this.getRowClass.createDelegate(this); + + view.enableRowBody = true; + + + grid.on('render', this.onRender, this); + grid.on('destroy', this.onDestroy, this); + }, + + // @private + onRender: function() { + var grid = this.grid; + var mainBody = grid.getView().mainBody; + mainBody.on('mousedown', this.onMouseDown, this, {delegate: '.x-grid3-row-expander'}); + if (this.expandOnEnter) { + this.keyNav = new Ext.KeyNav(this.grid.getGridEl(), { + 'enter' : this.onEnter, + scope: this + }); + } + if (this.expandOnDblClick) { + grid.on('rowdblclick', this.onRowDblClick, this); + } + }, + + // @private + onDestroy: function() { + if(this.keyNav){ + this.keyNav.disable(); + delete this.keyNav; + } + /* + * A majority of the time, the plugin will be destroyed along with the grid, + * which means the mainBody won't be available. On the off chance that the plugin + * isn't destroyed with the grid, take care of removing the listener. + */ + var mainBody = this.grid.getView().mainBody; + if(mainBody){ + mainBody.un('mousedown', this.onMouseDown, this); + } + }, + // @private + onRowDblClick: function(grid, rowIdx, e) { + this.toggleRow(rowIdx); + }, + + onEnter: function(e) { + var g = this.grid; + var sm = g.getSelectionModel(); + var sels = sm.getSelections(); + for (var i = 0, len = sels.length; i < len; i++) { + var rowIdx = g.getStore().indexOf(sels[i]); + this.toggleRow(rowIdx); + } + }, + + getBodyContent : function(record, index){ + if(!this.enableCaching){ + return this.tpl.apply(record.data); + } + var content = this.bodyContent[record.id]; + if(!content){ + content = this.tpl.apply(record.data); + this.bodyContent[record.id] = content; + } + return content; + }, + + onMouseDown : function(e, t){ + e.stopEvent(); + var row = e.getTarget('.x-grid3-row'); + this.toggleRow(row); + }, + + renderer : function(v, p, record){ + p.cellAttr = 'rowspan="2"'; + return '
 
'; + }, + + beforeExpand : function(record, body, rowIndex){ + if(this.fireEvent('beforeexpand', this, record, body, rowIndex) !== false){ + if(this.tpl && this.lazyRender){ + body.innerHTML = this.getBodyContent(record, rowIndex); + } + return true; + }else{ + return false; + } + }, + + toggleRow : function(row){ + if(typeof row == 'number'){ + row = this.grid.view.getRow(row); + } + this[Ext.fly(row).hasClass('x-grid3-row-collapsed') ? 'expandRow' : 'collapseRow'](row); + }, + + expandRow : function(row){ + if(typeof row == 'number'){ + row = this.grid.view.getRow(row); + } + var record = this.grid.store.getAt(row.rowIndex); + var body = Ext.DomQuery.selectNode('tr:nth(2) div.x-grid3-row-body', row); + if(this.beforeExpand(record, body, row.rowIndex)){ + this.state[record.id] = true; + Ext.fly(row).replaceClass('x-grid3-row-collapsed', 'x-grid3-row-expanded'); + this.fireEvent('expand', this, record, body, row.rowIndex); + } + }, + + collapseRow : function(row){ + if(typeof row == 'number'){ + row = this.grid.view.getRow(row); + } + var record = this.grid.store.getAt(row.rowIndex); + var body = Ext.fly(row).child('tr:nth(1) div.x-grid3-row-body', true); + if(this.fireEvent('beforecollapse', this, record, body, row.rowIndex) !== false){ + this.state[record.id] = false; + Ext.fly(row).replaceClass('x-grid3-row-expanded', 'x-grid3-row-collapsed'); + this.fireEvent('collapse', this, record, body, row.rowIndex); + } + } +}); + +Ext.preg('rowexpander', Ext.ux.grid.RowExpander); + +//backwards compat +Ext.grid.RowExpander = Ext.ux.grid.RowExpander; + +Ext.ns('Ext.ux.grid');Ext.ux.grid.CheckColumn=function(a){Ext.apply(this,a);if(!this.id){this.id=Ext.id()}this.renderer=this.renderer.createDelegate(this)};Ext.ux.grid.CheckColumn.prototype={init:function(b){this.grid=b;this.grid.on('render',function(){var a=this.grid.getView();a.mainBody.on('mousedown',this.onMouseDown,this)},this);this.grid.on('destroy',this.onDestroy,this)},onMouseDown:function(e,t){this.grid.fireEvent('rowclick');if(t.className&&t.className.indexOf('x-grid3-cc-'+this.id)!=-1){e.stopEvent();var a=this.grid.getView().findRowIndex(t);var b=this.grid.store.getAt(a);b.set(this.dataIndex,!b.data[this.dataIndex]);this.grid.fireEvent('afteredit')}},renderer:function(v,p,a){p.css+=' x-grid3-check-col-td';return'
 
'},onDestroy:function(){var mainBody = this.grid.getView().mainBody; + if(mainBody){ + mainBody.un('mousedown', this.onMouseDown, this); + }}};Ext.preg('checkcolumn',Ext.ux.grid.CheckColumn);Ext.grid.CheckColumn=Ext.ux.grid.CheckColumn; + +Ext.grid.PropertyColumnModel=function(a,b){var g=Ext.grid,f=Ext.form;this.grid=a;g.PropertyColumnModel.superclass.constructor.call(this,[{header:this.nameText,width:50,sortable:true,dataIndex:'name',id:'name',menuDisabled:true},{header:this.valueText,width:50,resizable:false,dataIndex:'value',id:'value',menuDisabled:true}]);this.store=b;var c=new f.Field({autoCreate:{tag:'select',children:[{tag:'option',value:'true',html:'true'},{tag:'option',value:'false',html:'false'}]},getValue:function(){return this.el.dom.value=='true'}});this.editors={'date':new g.GridEditor(new f.DateField({selectOnFocus:true})),'string':new g.GridEditor(new f.TextField({selectOnFocus:true})),'number':new g.GridEditor(new f.NumberField({selectOnFocus:true,style:'text-align:left;'})),'boolean':new g.GridEditor(c)};this.renderCellDelegate=this.renderCell.createDelegate(this);this.renderPropDelegate=this.renderProp.createDelegate(this)};Ext.extend(Ext.grid.PropertyColumnModel,Ext.grid.ColumnModel,{nameText:'Name',valueText:'Value',dateFormat:'m/j/Y',renderDate:function(a){return a.dateFormat(this.dateFormat)},renderBool:function(a){return a?'true':'false'},isCellEditable:function(a,b){return a==1},getRenderer:function(a){return a==1?this.renderCellDelegate:this.renderPropDelegate},renderProp:function(v){return this.getPropertyName(v)},renderCell:function(a){var b=a;if(Ext.isDate(a)){b=this.renderDate(a)}else if(typeof a=='boolean'){b=this.renderBool(a)}return Ext.util.Format.htmlEncode(b)},getPropertyName:function(a){var b=this.grid.propertyNames;return b&&b[a]?b[a]:a},getCellEditor:function(a,b){var p=this.store.getProperty(b),n=p.data.name,val=p.data.value;if(this.grid.customEditors[n]){return this.grid.customEditors[n]}if(Ext.isDate(val)){return this.editors.date}else if(typeof val=='number'){return this.editors.number}else if(typeof val=='boolean'){return this.editors['boolean']}else{return this.editors.string}},destroy:function(){Ext.grid.PropertyColumnModel.superclass.destroy.call(this);for(var a in this.editors){Ext.destroy(a)}}});