ext-all-debug.js
资源名称:demo.zip [点击查看]
上传用户:chliyg
上传日期:2016-05-15
资源大小:3196k
文件大小:951k
源码类别:
Jsp/Servlet
开发平台:
Java
- });
- Ext.reg('timefield', Ext.form.TimeField); Ext.form.Label = Ext.extend(Ext.BoxComponent, { onRender : function(ct, position){ if(!this.el){ this.el = document.createElement('label'); this.el.id = this.getId(); this.el.innerHTML = this.text ? Ext.util.Format.htmlEncode(this.text) : (this.html || ''); if(this.forId){ this.el.setAttribute('htmlFor', this.forId); } } Ext.form.Label.superclass.onRender.call(this, ct, position); }, setText: function(t, encode){ this.text = t; if(this.rendered){ this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t; } return this; } }); Ext.reg('label', Ext.form.Label); Ext.form.Action = function(form, options){ this.form = form; this.options = options || {}; }; Ext.form.Action.CLIENT_INVALID = 'client'; Ext.form.Action.SERVER_INVALID = 'server'; Ext.form.Action.CONNECT_FAILURE = 'connect'; Ext.form.Action.LOAD_FAILURE = 'load'; Ext.form.Action.prototype = { type : 'default', run : function(options){ }, success : function(response){ }, handleResponse : function(response){ }, failure : function(response){ this.response = response; this.failureType = Ext.form.Action.CONNECT_FAILURE; this.form.afterAction(this, false); }, processResponse : function(response){ this.response = response; if(!response.responseText){ return true; } this.result = this.handleResponse(response); return this.result; }, getUrl : function(appendParams){ var url = this.options.url || this.form.url || this.form.el.dom.action; if(appendParams){ var p = this.getParams(); if(p){ url += (url.indexOf('?') != -1 ? '&' : '?') + p; } } return url; }, getMethod : function(){ return (this.options.method || this.form.method || this.form.el.dom.method || 'POST').toUpperCase(); }, getParams : function(){ var bp = this.form.baseParams; var p = this.options.params; if(p){ if(typeof p == "object"){ p = Ext.urlEncode(Ext.applyIf(p, bp)); }else if(typeof p == 'string' && bp){ p += '&' + Ext.urlEncode(bp); } }else if(bp){ p = Ext.urlEncode(bp); } return p; }, createCallback : function(opts){ var opts = opts || {}; return { success: this.success, failure: this.failure, scope: this, timeout: (opts.timeout*1000) || (this.form.timeout*1000), upload: this.form.fileUpload ? this.success : undefined }; } }; Ext.form.Action.Submit = function(form, options){ Ext.form.Action.Submit.superclass.constructor.call(this, form, options); }; Ext.extend(Ext.form.Action.Submit, Ext.form.Action, { type : 'submit', run : function(){ var o = this.options; var method = this.getMethod(); var isGet = method == 'GET'; if(o.clientValidation === false || this.form.isValid()){ Ext.Ajax.request(Ext.apply(this.createCallback(o), { form:this.form.el.dom, url:this.getUrl(isGet), method: method, headers: o.headers, params:!isGet ? this.getParams() : null, isUpload: this.form.fileUpload })); }else if (o.clientValidation !== false){ this.failureType = Ext.form.Action.CLIENT_INVALID; this.form.afterAction(this, false); } }, success : function(response){ var result = this.processResponse(response); if(result === true || result.success){ this.form.afterAction(this, true); return; } if(result.errors){ this.form.markInvalid(result.errors); this.failureType = Ext.form.Action.SERVER_INVALID; } this.form.afterAction(this, false); }, handleResponse : function(response){ if(this.form.errorReader){ var rs = this.form.errorReader.read(response); var errors = []; if(rs.records){ for(var i = 0, len = rs.records.length; i < len; i++) { var r = rs.records[i]; errors[i] = r.data; } } if(errors.length < 1){ errors = null; } return { success : rs.success, errors : errors }; } return Ext.decode(response.responseText); } }); Ext.form.Action.Load = function(form, options){ Ext.form.Action.Load.superclass.constructor.call(this, form, options); this.reader = this.form.reader; }; Ext.extend(Ext.form.Action.Load, Ext.form.Action, { type : 'load', run : function(){ Ext.Ajax.request(Ext.apply( this.createCallback(this.options), { method:this.getMethod(), url:this.getUrl(false), headers: this.options.headers, params:this.getParams() })); }, success : function(response){ var result = this.processResponse(response); if(result === true || !result.success || !result.data){ this.failureType = Ext.form.Action.LOAD_FAILURE; this.form.afterAction(this, false); return; } this.form.clearInvalid(); this.form.setValues(result.data); this.form.afterAction(this, true); }, handleResponse : function(response){ if(this.form.reader){ var rs = this.form.reader.read(response); var data = rs.records && rs.records[0] ? rs.records[0].data : null; return { success : rs.success, data : data }; } return Ext.decode(response.responseText); } }); Ext.form.Action.ACTION_TYPES = { 'load' : Ext.form.Action.Load, 'submit' : Ext.form.Action.Submit }; Ext.form.VTypes = function(){ var alpha = /^[a-zA-Z_]+$/; var alphanum = /^[a-zA-Z0-9_]+$/; var email = /^([w]+)(.[w]+)*@([w-]+.){1,5}([A-Za-z]){2,4}$/; var url = /(((https?)|(ftp))://([-w]+.)+w{2,3}(/[%-w]+(.w{2,})?)*(([w-.?\/+@&#;`~=%!]*)(.w{2,})?)*/?)/i; return { 'email' : function(v){ return email.test(v); }, 'emailText' : 'This field should be an e-mail address in the format "user@domain.com"', 'emailMask' : /[a-z0-9_.-@]/i, 'url' : function(v){ return url.test(v); }, 'urlText' : 'This field should be a URL in the format "http:/'+'/www.domain.com"', 'alpha' : function(v){ return alpha.test(v); }, 'alphaText' : 'This field should only contain letters and _', 'alphaMask' : /[a-z_]/i, 'alphanum' : function(v){ return alphanum.test(v); }, 'alphanumText' : 'This field should only contain letters, numbers and _', 'alphanumMask' : /[a-z0-9_]/i }; }();
- Ext.grid.GridPanel = Ext.extend(Ext.Panel, {
- ddText : "{0} selected row{1}",
- minColumnWidth : 25,
- trackMouseOver : true,
- enableDragDrop : false,
- enableColumnMove : true,
- enableColumnHide : true,
- enableHdMenu : true,
- stripeRows : false,
- autoExpandColumn : false,
- autoExpandMin : 50,
- autoExpandMax : 1000,
- view : null,
- loadMask : false,
- deferRowRender : true,
- rendered : false,
- viewReady: false,
- stateEvents: ["columnmove", "columnresize", "sortchange"],
- initComponent : function(){
- Ext.grid.GridPanel.superclass.initComponent.call(this);
- this.autoScroll = false;
- this.autoWidth = false;
- if(Ext.isArray(this.columns)){
- this.colModel = new Ext.grid.ColumnModel(this.columns);
- delete this.columns;
- }
- if(this.ds){
- this.store = this.ds;
- delete this.ds;
- }
- if(this.cm){
- this.colModel = this.cm;
- delete this.cm;
- }
- if(this.sm){
- this.selModel = this.sm;
- delete this.sm;
- }
- this.store = Ext.StoreMgr.lookup(this.store);
- this.addEvents(
- "click",
- "dblclick",
- "contextmenu",
- "mousedown",
- "mouseup",
- "mouseover",
- "mouseout",
- "keypress",
- "keydown",
- "cellmousedown",
- "rowmousedown",
- "headermousedown",
- "cellclick",
- "celldblclick",
- "rowclick",
- "rowdblclick",
- "headerclick",
- "headerdblclick",
- "rowcontextmenu",
- "cellcontextmenu",
- "headercontextmenu",
- "bodyscroll",
- "columnresize",
- "columnmove",
- "sortchange"
- );
- },
- onRender : function(ct, position){
- Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);
- var c = this.body;
- this.el.addClass('x-grid-panel');
- var view = this.getView();
- view.init(this);
- c.on("mousedown", this.onMouseDown, this);
- c.on("click", this.onClick, this);
- c.on("dblclick", this.onDblClick, this);
- c.on("contextmenu", this.onContextMenu, this);
- c.on("keydown", this.onKeyDown, this);
- this.relayEvents(c, ["mousedown","mouseup","mouseover","mouseout","keypress"]);
- this.getSelectionModel().init(this);
- this.view.render();
- },
- initEvents : function(){
- Ext.grid.GridPanel.superclass.initEvents.call(this);
- if(this.loadMask){
- this.loadMask = new Ext.LoadMask(this.bwrap,
- Ext.apply({store:this.store}, this.loadMask));
- }
- },
- initStateEvents : function(){
- Ext.grid.GridPanel.superclass.initStateEvents.call(this);
- this.colModel.on('hiddenchange', this.saveState, this, {delay: 100});
- },
- applyState : function(state){
- var cm = this.colModel;
- var cs = state.columns;
- if(cs){
- for(var i = 0, len = cs.length; i < len; i++){
- var s = cs[i];
- var c = cm.getColumnById(s.id);
- if(c){
- c.hidden = s.hidden;
- c.width = s.width;
- var oldIndex = cm.getIndexById(s.id);
- if(oldIndex != i){
- cm.moveColumn(oldIndex, i);
- }
- }
- }
- }
- if(state.sort){
- this.store[this.store.remoteSort ? 'setDefaultSort' : 'sort'](state.sort.field, state.sort.direction);
- }
- },
- getState : function(){
- var o = {columns: []};
- for(var i = 0, c; c = this.colModel.config[i]; i++){
- o.columns[i] = {
- id: c.id,
- width: c.width
- };
- if(c.hidden){
- o.columns[i].hidden = true;
- }
- }
- var ss = this.store.getSortState();
- if(ss){
- o.sort = ss;
- }
- return o;
- },
- afterRender : function(){
- Ext.grid.GridPanel.superclass.afterRender.call(this);
- this.view.layout();
- if(this.deferRowRender){
- this.view.afterRender.defer(10, this.view);
- }else{
- this.view.afterRender();
- }
- this.viewReady = true;
- },
- reconfigure : function(store, colModel){
- if(this.loadMask){
- this.loadMask.destroy();
- this.loadMask = new Ext.LoadMask(this.bwrap,
- Ext.apply({store:store}, this.initialConfig.loadMask));
- }
- this.view.bind(store, colModel);
- this.store = store;
- this.colModel = colModel;
- if(this.rendered){
- this.view.refresh(true);
- }
- },
- onKeyDown : function(e){
- this.fireEvent("keydown", e);
- },
- onDestroy : function(){
- if(this.rendered){
- if(this.loadMask){
- this.loadMask.destroy();
- }
- var c = this.body;
- c.removeAllListeners();
- this.view.destroy();
- c.update("");
- }
- this.colModel.purgeListeners();
- Ext.grid.GridPanel.superclass.onDestroy.call(this);
- },
- processEvent : function(name, e){
- this.fireEvent(name, e);
- var t = e.getTarget();
- var v = this.view;
- var header = v.findHeaderIndex(t);
- if(header !== false){
- this.fireEvent("header" + name, this, header, e);
- }else{
- var row = v.findRowIndex(t);
- var cell = v.findCellIndex(t);
- if(row !== false){
- this.fireEvent("row" + name, this, row, e);
- if(cell !== false){
- this.fireEvent("cell" + name, this, row, cell, e);
- }
- }
- }
- },
- onClick : function(e){
- this.processEvent("click", e);
- },
- onMouseDown : function(e){
- this.processEvent("mousedown", e);
- },
- onContextMenu : function(e, t){
- this.processEvent("contextmenu", e);
- },
- onDblClick : function(e){
- this.processEvent("dblclick", e);
- },
- walkCells : function(row, col, step, fn, scope){
- var cm = this.colModel, clen = cm.getColumnCount();
- var ds = this.store, rlen = ds.getCount(), first = true;
- if(step < 0){
- if(col < 0){
- row--;
- first = false;
- }
- while(row >= 0){
- if(!first){
- col = clen-1;
- }
- first = false;
- while(col >= 0){
- if(fn.call(scope || this, row, col, cm) === true){
- return [row, col];
- }
- col--;
- }
- row--;
- }
- } else {
- if(col >= clen){
- row++;
- first = false;
- }
- while(row < rlen){
- if(!first){
- col = 0;
- }
- first = false;
- while(col < clen){
- if(fn.call(scope || this, row, col, cm) === true){
- return [row, col];
- }
- col++;
- }
- row++;
- }
- }
- return null;
- },
- getSelections : function(){
- return this.selModel.getSelections();
- },
- onResize : function(){
- Ext.grid.GridPanel.superclass.onResize.apply(this, arguments);
- if(this.viewReady){
- this.view.layout();
- }
- },
- getGridEl : function(){
- return this.body;
- },
- stopEditing : function(){},
- getSelectionModel : function(){
- if(!this.selModel){
- this.selModel = new Ext.grid.RowSelectionModel(
- this.disableSelection ? {selectRow: Ext.emptyFn} : null);
- }
- return this.selModel;
- },
- getStore : function(){
- return this.store;
- },
- getColumnModel : function(){
- return this.colModel;
- },
- getView : function(){
- if(!this.view){
- this.view = new Ext.grid.GridView(this.viewConfig);
- }
- return this.view;
- },
- getDragDropText : function(){
- var count = this.selModel.getCount();
- return String.format(this.ddText, count, count == 1 ? '' : 's');
- }
- });
- Ext.reg('grid', Ext.grid.GridPanel); Ext.grid.GridView = function(config){ Ext.apply(this, config); this.addEvents( "beforerowremoved", "beforerowsinserted", "beforerefresh", "rowremoved", "rowsinserted", "rowupdated", "refresh" ); Ext.grid.GridView.superclass.constructor.call(this); }; Ext.extend(Ext.grid.GridView, Ext.util.Observable, { deferEmptyText: true, scrollOffset: 19, autoFill: false, forceFit: false, sortClasses : ["sort-asc", "sort-desc"], sortAscText : "Sort Ascending", sortDescText : "Sort Descending", columnsText : "Columns", borderWidth: 2, tdClass: 'x-grid3-cell', hdCls: 'x-grid3-hd', cellSelectorDepth: 4, rowSelectorDepth: 10, cellSelector: 'td.x-grid3-cell', rowSelector: 'div.x-grid3-row', initTemplates : function(){ var ts = this.templates || {}; if(!ts.master){ ts.master = new Ext.Template( '<div class="x-grid3" hidefocus="true">', '<div class="x-grid3-viewport">', '<div class="x-grid3-header"><div class="x-grid3-header-inner"><div class="x-grid3-header-offset">{header}</div></div><div class="x-clear"></div></div>', '<div class="x-grid3-scroller"><div class="x-grid3-body">{body}</div><a href="#" class="x-grid3-focus" tabIndex="-1"></a></div>', "</div>", '<div class="x-grid3-resize-marker"> </div>', '<div class="x-grid3-resize-proxy"> </div>', "</div>" ); } if(!ts.header){ ts.header = new Ext.Template( '<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">', '<thead><tr class="x-grid3-hd-row">{cells}</tr></thead>', "</table>" ); } if(!ts.hcell){ ts.hcell = new Ext.Template( '<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id}" style="{style}"><div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '', '{value}<img class="x-grid3-sort-icon" src="', Ext.BLANK_IMAGE_URL, '" />', "</div></td>" ); } if(!ts.body){ ts.body = new Ext.Template('{rows}'); } if(!ts.row){ ts.row = new Ext.Template( '<div class="x-grid3-row {alt}" style="{tstyle}"><table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">', '<tbody><tr>{cells}</tr>', (this.enableRowBody ? '<tr class="x-grid3-row-body-tr" style="{bodyStyle}"><td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on"><div class="x-grid3-row-body">{body}</div></td></tr>' : ''), '</tbody></table></div>' ); } if(!ts.cell){ ts.cell = new Ext.Template( '<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>', '<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>', "</td>" ); } for(var k in ts){ var t = ts[k]; if(t && typeof t.compile == 'function' && !t.compiled){ t.disableFormats = true; t.compile(); } } this.templates = ts; this.colRe = new RegExp("x-grid3-td-([^\s]+)", ""); }, fly : function(el){ if(!this._flyweight){ this._flyweight = new Ext.Element.Flyweight(document.body); } this._flyweight.dom = el; return this._flyweight; }, getEditorParent : function(ed){ return this.scroller.dom; }, initElements : function(){ var E = Ext.Element; var el = this.grid.getGridEl().dom.firstChild; var cs = el.childNodes; this.el = new E(el); this.mainWrap = new E(cs[0]); this.mainHd = new E(this.mainWrap.dom.firstChild); if(this.grid.hideHeaders){ this.mainHd.setDisplayed(false); } this.innerHd = this.mainHd.dom.firstChild; this.scroller = new E(this.mainWrap.dom.childNodes[1]); if(this.forceFit){ this.scroller.setStyle('overflow-x', 'hidden'); } this.mainBody = new E(this.scroller.dom.firstChild); this.focusEl = new E(this.scroller.dom.childNodes[1]); this.focusEl.swallowEvent("click", true); this.resizeMarker = new E(cs[1]); this.resizeProxy = new E(cs[2]); }, getRows : function(){ return this.hasRows() ? this.mainBody.dom.childNodes : []; }, findCell : function(el){ if(!el){ return false; } return this.fly(el).findParent(this.cellSelector, this.cellSelectorDepth); }, findCellIndex : function(el, requiredCls){ var cell = this.findCell(el); if(cell && (!requiredCls || this.fly(cell).hasClass(requiredCls))){ return this.getCellIndex(cell); } return false; }, getCellIndex : function(el){ if(el){ var m = el.className.match(this.colRe); if(m && m[1]){ return this.cm.getIndexById(m[1]); } } return false; }, findHeaderCell : function(el){ var cell = this.findCell(el); return cell && this.fly(cell).hasClass(this.hdCls) ? cell : null; }, findHeaderIndex : function(el){ return this.findCellIndex(el, this.hdCls); }, findRow : function(el){ if(!el){ return false; } return this.fly(el).findParent(this.rowSelector, this.rowSelectorDepth); }, findRowIndex : function(el){ var r = this.findRow(el); return r ? r.rowIndex : false; }, getRow : function(row){ return this.getRows()[row]; }, getCell : function(row, col){ return this.getRow(row).getElementsByTagName('td')[col]; }, getHeaderCell : function(index){ return this.mainHd.dom.getElementsByTagName('td')[index]; }, addRowClass : function(row, cls){ var r = this.getRow(row); if(r){ this.fly(r).addClass(cls); } }, removeRowClass : function(row, cls){ var r = this.getRow(row); if(r){ this.fly(r).removeClass(cls); } }, removeRow : function(row){ Ext.removeNode(this.getRow(row)); this.focusRow(row); }, removeRows : function(firstRow, lastRow){ var bd = this.mainBody.dom; for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){ Ext.removeNode(bd.childNodes[firstRow]); } this.focusRow(firstRow); }, getScrollState : function(){ var sb = this.scroller.dom; return {left: sb.scrollLeft, top: sb.scrollTop}; }, restoreScroll : function(state){ var sb = this.scroller.dom; sb.scrollLeft = state.left; sb.scrollTop = state.top; }, scrollToTop : function(){ this.scroller.dom.scrollTop = 0; this.scroller.dom.scrollLeft = 0; }, syncScroll : function(){ this.syncHeaderScroll(); var mb = this.scroller.dom; this.grid.fireEvent("bodyscroll", mb.scrollLeft, mb.scrollTop); }, syncHeaderScroll : function(){ var mb = this.scroller.dom; this.innerHd.scrollLeft = mb.scrollLeft; this.innerHd.scrollLeft = mb.scrollLeft; }, updateSortIcon : function(col, dir){ var sc = this.sortClasses; var hds = this.mainHd.select('td').removeClass(sc); hds.item(col).addClass(sc[dir == "DESC" ? 1 : 0]); }, updateAllColumnWidths : function(){ var tw = this.getTotalWidth(); var clen = this.cm.getColumnCount(); var ws = []; for(var i = 0; i < clen; i++){ ws[i] = this.getColumnWidth(i); } this.innerHd.firstChild.firstChild.style.width = tw; for(var i = 0; i < clen; i++){ var hd = this.getHeaderCell(i); hd.style.width = ws[i]; } var ns = this.getRows(); for(var i = 0, len = ns.length; i < len; i++){ ns[i].style.width = tw; ns[i].firstChild.style.width = tw; var row = ns[i].firstChild.rows[0]; for(var j = 0; j < clen; j++){ row.childNodes[j].style.width = ws[j]; } } this.onAllColumnWidthsUpdated(ws, tw); }, updateColumnWidth : function(col, width){ var w = this.getColumnWidth(col); var tw = this.getTotalWidth(); this.innerHd.firstChild.firstChild.style.width = tw; var hd = this.getHeaderCell(col); hd.style.width = w; var ns = this.getRows(); for(var i = 0, len = ns.length; i < len; i++){ ns[i].style.width = tw; ns[i].firstChild.style.width = tw; ns[i].firstChild.rows[0].childNodes[col].style.width = w; } this.onColumnWidthUpdated(col, w, tw); }, updateColumnHidden : function(col, hidden){ var tw = this.getTotalWidth(); this.innerHd.firstChild.firstChild.style.width = tw; var display = hidden ? 'none' : ''; var hd = this.getHeaderCell(col); hd.style.display = display; var ns = this.getRows(); for(var i = 0, len = ns.length; i < len; i++){ ns[i].style.width = tw; ns[i].firstChild.style.width = tw; ns[i].firstChild.rows[0].childNodes[col].style.display = display; } this.onColumnHiddenUpdated(col, hidden, tw); delete this.lastViewWidth; this.layout(); }, doRender : function(cs, rs, ds, startRow, colCount, stripe){ var ts = this.templates, ct = ts.cell, rt = ts.row, last = colCount-1; var tstyle = 'width:'+this.getTotalWidth()+';'; var buf = [], cb, c, p = {}, rp = {tstyle: tstyle}, r; for(var j = 0, len = rs.length; j < len; j++){ r = rs[j]; cb = []; var rowIndex = (j+startRow); for(var i = 0; i < colCount; i++){ c = cs[i]; p.id = c.id; p.css = i == 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : ''); p.attr = p.cellAttr = ""; p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds); p.style = c.style; if(p.value == undefined || p.value === "") p.value = " "; if(r.dirty && typeof r.modified[c.name] !== 'undefined'){ p.css += ' x-grid3-dirty-cell'; } cb[cb.length] = ct.apply(p); } var alt = []; if(stripe && ((rowIndex+1) % 2 == 0)){ alt[0] = "x-grid3-row-alt"; } if(r.dirty){ alt[1] = " x-grid3-dirty-row"; } rp.cols = colCount; if(this.getRowClass){ alt[2] = this.getRowClass(r, rowIndex, rp, ds); } rp.alt = alt.join(" "); rp.cells = cb.join(""); buf[buf.length] = rt.apply(rp); } return buf.join(""); }, processRows : function(startRow, skipStripe){ if(this.ds.getCount() < 1){ return; } skipStripe = skipStripe || !this.grid.stripeRows; startRow = startRow || 0; var rows = this.getRows(); var cls = ' x-grid3-row-alt '; for(var i = startRow, len = rows.length; i < len; i++){ var row = rows[i]; row.rowIndex = i; if(!skipStripe){ var isAlt = ((i+1) % 2 == 0); var hasAlt = (' '+row.className + ' ').indexOf(cls) != -1; if(isAlt == hasAlt){ continue; } if(isAlt){ row.className += " x-grid3-row-alt"; }else{ row.className = row.className.replace("x-grid3-row-alt", ""); } } } }, afterRender: function(){ this.mainBody.dom.innerHTML = this.renderRows(); this.processRows(0, true); if(this.deferEmptyText !== true){ this.applyEmptyText(); } }, renderUI : function(){ var header = this.renderHeaders(); var body = this.templates.body.apply({rows:''}); var html = this.templates.master.apply({ body: body, header: header }); var g = this.grid; g.getGridEl().dom.innerHTML = html; this.initElements(); Ext.fly(this.innerHd).on("click", this.handleHdDown, this); this.mainHd.on("mouseover", this.handleHdOver, this); this.mainHd.on("mouseout", this.handleHdOut, this); this.mainHd.on("mousemove", this.handleHdMove, this); this.scroller.on('scroll', this.syncScroll, this); if(g.enableColumnResize !== false){ this.splitone = new Ext.grid.GridView.SplitDragZone(g, this.mainHd.dom); } if(g.enableColumnMove){ this.columnDrag = new Ext.grid.GridView.ColumnDragZone(g, this.innerHd); this.columnDrop = new Ext.grid.HeaderDropZone(g, this.mainHd.dom); } if(g.enableHdMenu !== false){ if(g.enableColumnHide !== false){ this.colMenu = new Ext.menu.Menu({id:g.id + "-hcols-menu"}); this.colMenu.on("beforeshow", this.beforeColMenuShow, this); this.colMenu.on("itemclick", this.handleHdMenuClick, this); } this.hmenu = new Ext.menu.Menu({id: g.id + "-hctx"}); this.hmenu.add( {id:"asc", text: this.sortAscText, cls: "xg-hmenu-sort-asc"}, {id:"desc", text: this.sortDescText, cls: "xg-hmenu-sort-desc"} ); if(g.enableColumnHide !== false){ this.hmenu.add('-', {id:"columns", text: this.columnsText, menu: this.colMenu, iconCls: 'x-cols-icon'} ); } this.hmenu.on("itemclick", this.handleHdMenuClick, this); } if(g.enableDragDrop || g.enableDrag){ this.dragZone = new Ext.grid.GridDragZone(g, { ddGroup : g.ddGroup || 'GridDD' }); } this.updateHeaderSortState(); }, layout : function(){ if(!this.mainBody){ return; } var g = this.grid; var c = g.getGridEl(); var csize = c.getSize(true); var vw = csize.width; if(vw < 20 || csize.height < 20){ return; } if(g.autoHeight){ this.scroller.dom.style.overflow = 'visible'; }else{ this.el.setSize(csize.width, csize.height); var hdHeight = this.mainHd.getHeight(); var vh = csize.height - (hdHeight); this.scroller.setSize(vw, vh); if(this.innerHd){ this.innerHd.style.width = (vw)+'px'; } } if(this.forceFit){ if(this.lastViewWidth != vw){ this.fitColumns(false, false); this.lastViewWidth = vw; } }else { this.autoExpand(); this.syncHeaderScroll(); } this.onLayout(vw, vh); }, onLayout : function(vw, vh){ }, onColumnWidthUpdated : function(col, w, tw){ }, onAllColumnWidthsUpdated : function(ws, tw){ }, onColumnHiddenUpdated : function(col, hidden, tw){ }, updateColumnText : function(col, text){ }, afterMove : function(colIndex){ }, init: function(grid){ this.grid = grid; this.initTemplates(); this.initData(grid.store, grid.colModel); this.initUI(grid); }, getColumnId : function(index){ return this.cm.getColumnId(index); }, renderHeaders : function(){ var cm = this.cm, ts = this.templates; var ct = ts.hcell; var cb = [], sb = [], p = {}; for(var i = 0, len = cm.getColumnCount(); i < len; i++){ p.id = cm.getColumnId(i); p.value = cm.getColumnHeader(i) || ""; p.style = this.getColumnStyle(i, true); p.tooltip = this.getColumnTooltip(i); if(cm.config[i].align == 'right'){ p.istyle = 'padding-right:16px'; } else { delete p.istyle; } cb[cb.length] = ct.apply(p); } return ts.header.apply({cells: cb.join(""), tstyle:'width:'+this.getTotalWidth()+';'}); }, getColumnTooltip : function(i){ var tt = this.cm.getColumnTooltip(i); if(tt){ if(Ext.QuickTips.isEnabled()){ return 'ext:qtip="'+tt+'"'; }else{ return 'title="'+tt+'"'; } } return ""; }, beforeUpdate : function(){ this.grid.stopEditing(true); }, updateHeaders : function(){ this.innerHd.firstChild.innerHTML = this.renderHeaders(); }, focusRow : function(row){ this.focusCell(row, 0, false); }, focusCell : function(row, col, hscroll){ row = Math.min(row, Math.max(0, this.getRows().length-1)); var xy = this.ensureVisible(row, col, hscroll); this.focusEl.setXY(xy||this.scroller.getXY()); if(Ext.isGecko){ this.focusEl.focus(); }else{ this.focusEl.focus.defer(1, this.focusEl); } }, ensureVisible : function(row, col, hscroll){ if(typeof row != "number"){ row = row.rowIndex; } if(!this.ds){ return; } if(row < 0 || row >= this.ds.getCount()){ return; } col = (col !== undefined ? col : 0); var rowEl = this.getRow(row), cellEl; if(!(hscroll === false && col === 0)){ while(this.cm.isHidden(col)){ col++; } cellEl = this.getCell(row, col); } if(!rowEl){ return; } var c = this.scroller.dom; var ctop = 0; var p = rowEl, stop = this.el.dom; while(p && p != stop){ ctop += p.offsetTop; p = p.offsetParent; } ctop -= this.mainHd.dom.offsetHeight; var cbot = ctop + rowEl.offsetHeight; var ch = c.clientHeight; var stop = parseInt(c.scrollTop, 10); var sbot = stop + ch; if(ctop < stop){ c.scrollTop = ctop; }else if(cbot > sbot){ c.scrollTop = cbot-ch; } if(hscroll !== false){ var cleft = parseInt(cellEl.offsetLeft, 10); var cright = cleft + cellEl.offsetWidth; var sleft = parseInt(c.scrollLeft, 10); var sright = sleft + c.clientWidth; if(cleft < sleft){ c.scrollLeft = cleft; }else if(cright > sright){ c.scrollLeft = cright-c.clientWidth; } } return cellEl ? Ext.fly(cellEl).getXY() : [c.scrollLeft+this.el.getX(), Ext.fly(rowEl).getY()]; }, insertRows : function(dm, firstRow, lastRow, isUpdate){ if(!isUpdate && firstRow === 0 && lastRow >= dm.getCount()-1){ this.refresh(); }else{ if(!isUpdate){ this.fireEvent("beforerowsinserted", this, firstRow, lastRow); } var html = this.renderRows(firstRow, lastRow); var before = this.getRow(firstRow); if(before){ Ext.DomHelper.insertHtml('beforeBegin', before, html); }else{ Ext.DomHelper.insertHtml('beforeEnd', this.mainBody.dom, html); } if(!isUpdate){ this.fireEvent("rowsinserted", this, firstRow, lastRow); this.processRows(firstRow); } } this.focusRow(firstRow); }, deleteRows : function(dm, firstRow, lastRow){ if(dm.getRowCount()<1){ this.refresh(); }else{ this.fireEvent("beforerowsdeleted", this, firstRow, lastRow); this.removeRows(firstRow, lastRow); this.processRows(firstRow); this.fireEvent("rowsdeleted", this, firstRow, lastRow); } }, getColumnStyle : function(col, isHeader){ var style = !isHeader ? (this.cm.config[col].css || '') : ''; style += 'width:'+this.getColumnWidth(col)+';'; if(this.cm.isHidden(col)){ style += 'display:none;'; } var align = this.cm.config[col].align; if(align){ style += 'text-align:'+align+';'; } return style; }, getColumnWidth : function(col){ var w = this.cm.getColumnWidth(col); if(typeof w == 'number'){ return (Ext.isBorderBox ? w : (w-this.borderWidth > 0 ? w-this.borderWidth:0)) + 'px'; } return w; }, getTotalWidth : function(){ return this.cm.getTotalWidth()+'px'; }, fitColumns : function(preventRefresh, onlyExpand, omitColumn){ var cm = this.cm, leftOver, dist, i; var tw = cm.getTotalWidth(false); var aw = this.grid.getGridEl().getWidth(true)-this.scrollOffset; if(aw < 20){ return; } var extra = aw - tw; if(extra === 0){ return false; } var vc = cm.getColumnCount(true); var ac = vc-(typeof omitColumn == 'number' ? 1 : 0); if(ac === 0){ ac = 1; omitColumn = undefined; } var colCount = cm.getColumnCount(); var cols = []; var extraCol = 0; var width = 0; var w; for (i = 0; i < colCount; i++){ if(!cm.isHidden(i) && !cm.isFixed(i) && i !== omitColumn){ w = cm.getColumnWidth(i); cols.push(i); extraCol = i; cols.push(w); width += w; } } var frac = (aw - cm.getTotalWidth())/width; while (cols.length){ w = cols.pop(); i = cols.pop(); cm.setColumnWidth(i, Math.max(this.grid.minColumnWidth, Math.floor(w + w*frac)), true); } if((tw = cm.getTotalWidth(false)) > aw){ var adjustCol = ac != vc ? omitColumn : extraCol; cm.setColumnWidth(adjustCol, Math.max(1, cm.getColumnWidth(adjustCol)- (tw-aw)), true); } if(preventRefresh !== true){ this.updateAllColumnWidths(); } return true; }, autoExpand : function(preventUpdate){ var g = this.grid, cm = this.cm; if(!this.userResized && g.autoExpandColumn){ var tw = cm.getTotalWidth(false); var aw = this.grid.getGridEl().getWidth(true)-this.scrollOffset; if(tw != aw){ var ci = cm.getIndexById(g.autoExpandColumn); var currentWidth = cm.getColumnWidth(ci); var cw = Math.min(Math.max(((aw-tw)+currentWidth), g.autoExpandMin), g.autoExpandMax); if(cw != currentWidth){ cm.setColumnWidth(ci, cw, true); if(preventUpdate !== true){ this.updateColumnWidth(ci, cw); } } } } }, getColumnData : function(){ var cs = [], cm = this.cm, colCount = cm.getColumnCount(); for(var i = 0; i < colCount; i++){ var name = cm.getDataIndex(i); cs[i] = { name : (typeof name == 'undefined' ? this.ds.fields.get(i).name : name), renderer : cm.getRenderer(i), id : cm.getColumnId(i), style : this.getColumnStyle(i) }; } return cs; }, renderRows : function(startRow, endRow){ var g = this.grid, cm = g.colModel, ds = g.store, stripe = g.stripeRows; var colCount = cm.getColumnCount(); if(ds.getCount() < 1){ return ""; } var cs = this.getColumnData(); startRow = startRow || 0; endRow = typeof endRow == "undefined"? ds.getCount()-1 : endRow; var rs = ds.getRange(startRow, endRow); return this.doRender(cs, rs, ds, startRow, colCount, stripe); }, renderBody : function(){ var markup = this.renderRows(); return this.templates.body.apply({rows: markup}); }, refreshRow : function(record){ var ds = this.ds, index; if(typeof record == 'number'){ index = record; record = ds.getAt(index); }else{ index = ds.indexOf(record); } var cls = []; this.insertRows(ds, index, index, true); this.getRow(index).rowIndex = index; this.onRemove(ds, record, index+1, true); this.fireEvent("rowupdated", this, index, record); }, refresh : function(headersToo){ this.fireEvent("beforerefresh", this); this.grid.stopEditing(true); var result = this.renderBody(); this.mainBody.update(result); if(headersToo === true){ this.updateHeaders(); this.updateHeaderSortState(); } this.processRows(0, true); this.layout(); this.applyEmptyText(); this.fireEvent("refresh", this); }, applyEmptyText : function(){ if(this.emptyText && !this.hasRows()){ this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>'); } }, updateHeaderSortState : function(){ var state = this.ds.getSortState(); if(!state){ return; } if(!this.sortState || (this.sortState.field != state.field || this.sortState.direction != state.direction)){ this.grid.fireEvent('sortchange', this.grid, state); } this.sortState = state; var sortColumn = this.cm.findColumnIndex(state.field); if(sortColumn != -1){ var sortDir = state.direction; this.updateSortIcon(sortColumn, sortDir); } }, destroy : function(){ if(this.colMenu){ this.colMenu.removeAll(); Ext.menu.MenuMgr.unregister(this.colMenu); this.colMenu.getEl().remove(); delete this.colMenu; } if(this.hmenu){ this.hmenu.removeAll(); Ext.menu.MenuMgr.unregister(this.hmenu); this.hmenu.getEl().remove(); delete this.hmenu; } if(this.grid.enableColumnMove){ var dds = Ext.dd.DDM.ids['gridHeader' + this.grid.getGridEl().id]; if(dds){ for(var dd in dds){ if(!dds[dd].config.isTarget && dds[dd].dragElId){ var elid = dds[dd].dragElId; dds[dd].unreg(); Ext.get(elid).remove(); } else if(dds[dd].config.isTarget){ dds[dd].proxyTop.remove(); dds[dd].proxyBottom.remove(); dds[dd].unreg(); } if(Ext.dd.DDM.locationCache[dd]){ delete Ext.dd.DDM.locationCache[dd]; } } delete Ext.dd.DDM.ids['gridHeader' + this.grid.getGridEl().id]; } } Ext.destroy(this.resizeMarker, this.resizeProxy); if(this.dragZone){ this.dragZone.unreg(); } this.initData(null, null); Ext.EventManager.removeResizeListener(this.onWindowResize, this); }, onDenyColumnHide : function(){ }, render : function(){ if(this.autoFill){ this.fitColumns(true, true); }else if(this.forceFit){ this.fitColumns(true, false); }else if(this.grid.autoExpandColumn){ this.autoExpand(true); } this.renderUI(); }, initData : function(ds, cm){ if(this.ds){ this.ds.un("load", this.onLoad, this); this.ds.un("datachanged", this.onDataChange, this); this.ds.un("add", this.onAdd, this); this.ds.un("remove", this.onRemove, this); this.ds.un("update", this.onUpdate, this); this.ds.un("clear", this.onClear, this); } if(ds){ ds.on("load", this.onLoad, this); ds.on("datachanged", this.onDataChange, this); ds.on("add", this.onAdd, this); ds.on("remove", this.onRemove, this); ds.on("update", this.onUpdate, this); ds.on("clear", this.onClear, this); } this.ds = ds; if(this.cm){ this.cm.un("configchange", this.onColConfigChange, this); this.cm.un("widthchange", this.onColWidthChange, this); this.cm.un("headerchange", this.onHeaderChange, this); this.cm.un("hiddenchange", this.onHiddenChange, this); this.cm.un("columnmoved", this.onColumnMove, this); this.cm.un("columnlockchange", this.onColumnLock, this); } if(cm){ delete this.lastViewWidth; cm.on("configchange", this.onColConfigChange, this); cm.on("widthchange", this.onColWidthChange, this); cm.on("headerchange", this.onHeaderChange, this); cm.on("hiddenchange", this.onHiddenChange, this); cm.on("columnmoved", this.onColumnMove, this); cm.on("columnlockchange", this.onColumnLock, this); } this.cm = cm; }, onDataChange : function(){ this.refresh(); this.updateHeaderSortState(); }, onClear : function(){ this.refresh(); }, onUpdate : function(ds, record){ this.refreshRow(record); }, onAdd : function(ds, records, index){ this.insertRows(ds, index, index + (records.length-1)); }, onRemove : function(ds, record, index, isUpdate){ if(isUpdate !== true){ this.fireEvent("beforerowremoved", this, index, record); } this.removeRow(index); if(isUpdate !== true){ this.processRows(index); this.applyEmptyText(); this.fireEvent("rowremoved", this, index, record); } }, onLoad : function(){ this.scrollToTop(); }, onColWidthChange : function(cm, col, width){ this.updateColumnWidth(col, width); }, onHeaderChange : function(cm, col, text){ this.updateHeaders(); }, onHiddenChange : function(cm, col, hidden){ this.updateColumnHidden(col, hidden); }, onColumnMove : function(cm, oldIndex, newIndex){ this.indexMap = null; var s = this.getScrollState(); this.refresh(true); this.restoreScroll(s); this.afterMove(newIndex); }, onColConfigChange : function(){ delete this.lastViewWidth; this.indexMap = null; this.refresh(true); }, initUI : function(grid){ grid.on("headerclick", this.onHeaderClick, this); if(grid.trackMouseOver){ grid.on("mouseover", this.onRowOver, this); grid.on("mouseout", this.onRowOut, this); } }, initEvents : function(){ }, onHeaderClick : function(g, index){ if(this.headersDisabled || !this.cm.isSortable(index)){ return; } g.stopEditing(true); g.store.sort(this.cm.getDataIndex(index)); }, onRowOver : function(e, t){ var row; if((row = this.findRowIndex(t)) !== false){ this.addRowClass(row, "x-grid3-row-over"); } }, onRowOut : function(e, t){ var row; if((row = this.findRowIndex(t)) !== false && row !== this.findRowIndex(e.getRelatedTarget())){ this.removeRowClass(row, "x-grid3-row-over"); } }, handleWheel : function(e){ e.stopPropagation(); }, onRowSelect : function(row){ this.addRowClass(row, "x-grid3-row-selected"); }, onRowDeselect : function(row){ this.removeRowClass(row, "x-grid3-row-selected"); }, onCellSelect : function(row, col){ var cell = this.getCell(row, col); if(cell){ this.fly(cell).addClass("x-grid3-cell-selected"); } }, onCellDeselect : function(row, col){ var cell = this.getCell(row, col); if(cell){ this.fly(cell).removeClass("x-grid3-cell-selected"); } }, onColumnSplitterMoved : function(i, w){ this.userResized = true; var cm = this.grid.colModel; cm.setColumnWidth(i, w, true); if(this.forceFit){ this.fitColumns(true, false, i); this.updateAllColumnWidths(); }else{ this.updateColumnWidth(i, w); } this.grid.fireEvent("columnresize", i, w); }, handleHdMenuClick : function(item){ var index = this.hdCtxIndex; var cm = this.cm, ds = this.ds; switch(item.id){ case "asc": ds.sort(cm.getDataIndex(index), "ASC"); break; case "desc": ds.sort(cm.getDataIndex(index), "DESC"); break; default: index = cm.getIndexById(item.id.substr(4)); if(index != -1){ if(item.checked && cm.getColumnsBy(this.isHideableColumn, this).length <= 1){ this.onDenyColumnHide(); return false; } cm.setHidden(index, item.checked); } } return true; }, isHideableColumn : function(c){ return !c.hidden && !c.fixed; }, beforeColMenuShow : function(){ var cm = this.cm, colCount = cm.getColumnCount(); this.colMenu.removeAll(); for(var i = 0; i < colCount; i++){ if(cm.config[i].fixed !== true && cm.config[i].hideable !== false){ this.colMenu.add(new Ext.menu.CheckItem({ id: "col-"+cm.getColumnId(i), text: cm.getColumnHeader(i), checked: !cm.isHidden(i), hideOnClick:false, disabled: cm.config[i].hideable === false })); } } }, handleHdDown : function(e, t){ if(Ext.fly(t).hasClass('x-grid3-hd-btn')){ e.stopEvent(); var hd = this.findHeaderCell(t); Ext.fly(hd).addClass('x-grid3-hd-menu-open'); var index = this.getCellIndex(hd); this.hdCtxIndex = index; var ms = this.hmenu.items, cm = this.cm; ms.get("asc").setDisabled(!cm.isSortable(index)); ms.get("desc").setDisabled(!cm.isSortable(index)); this.hmenu.on("hide", function(){ Ext.fly(hd).removeClass('x-grid3-hd-menu-open'); }, this, {single:true}); this.hmenu.show(t, "tl-bl?"); } }, handleHdOver : function(e, t){ var hd = this.findHeaderCell(t); if(hd && !this.headersDisabled){ this.activeHd = hd; this.activeHdIndex = this.getCellIndex(hd); var fly = this.fly(hd); this.activeHdRegion = fly.getRegion(); if(!this.cm.isMenuDisabled(this.activeHdIndex)){ fly.addClass("x-grid3-hd-over"); this.activeHdBtn = fly.child('.x-grid3-hd-btn'); if(this.activeHdBtn){ this.activeHdBtn.dom.style.height = (hd.firstChild.offsetHeight-1)+'px'; } } } }, handleHdMove : function(e, t){ if(this.activeHd && !this.headersDisabled){ var hw = this.splitHandleWidth || 5; var r = this.activeHdRegion; var x = e.getPageX(); var ss = this.activeHd.style; if(x - r.left <= hw && this.cm.isResizable(this.activeHdIndex-1)){ ss.cursor = Ext.isAir ? 'move' : Ext.isSafari ? 'e-resize' : 'col-resize'; }else if(r.right - x <= (!this.activeHdBtn ? hw : 2) && this.cm.isResizable(this.activeHdIndex)){ ss.cursor = Ext.isAir ? 'move' : Ext.isSafari ? 'w-resize' : 'col-resize'; }else{ ss.cursor = ''; } } }, handleHdOut : function(e, t){ var hd = this.findHeaderCell(t); if(hd && (!Ext.isIE || !e.within(hd, true))){ this.activeHd = null; this.fly(hd).removeClass("x-grid3-hd-over"); hd.style.cursor = ''; } }, hasRows : function(){ var fc = this.mainBody.dom.firstChild; return fc && fc.className != 'x-grid-empty'; }, bind : function(d, c){ this.initData(d, c); } }); Ext.grid.GridView.SplitDragZone = function(grid, hd){ this.grid = grid; this.view = grid.getView(); this.marker = this.view.resizeMarker; this.proxy = this.view.resizeProxy; Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this, hd, "gridSplitters" + this.grid.getGridEl().id, { dragElId : Ext.id(this.proxy.dom), resizeFrame:false }); this.scroll = false; this.hw = this.view.splitHandleWidth || 5; }; Ext.extend(Ext.grid.GridView.SplitDragZone, Ext.dd.DDProxy, { b4StartDrag : function(x, y){ this.view.headersDisabled = true; var h = this.view.mainWrap.getHeight(); this.marker.setHeight(h); this.marker.show(); this.marker.alignTo(this.view.getHeaderCell(this.cellIndex), 'tl-tl', [-2, 0]); this.proxy.setHeight(h); var w = this.cm.getColumnWidth(this.cellIndex); var minw = Math.max(w-this.grid.minColumnWidth, 0); this.resetConstraints(); this.setXConstraint(minw, 1000); this.setYConstraint(0, 0); this.minX = x - minw; this.maxX = x + 1000; this.startPos = x; Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y); }, handleMouseDown : function(e){ var t = this.view.findHeaderCell(e.getTarget()); if(t){ var xy = this.view.fly(t).getXY(), x = xy[0], y = xy[1]; var exy = e.getXY(), ex = exy[0], ey = exy[1]; var w = t.offsetWidth, adjust = false; if((ex - x) <= this.hw){ adjust = -1; }else if((x+w) - ex <= this.hw){ adjust = 0; } if(adjust !== false){ this.cm = this.grid.colModel; var ci = this.view.getCellIndex(t); if(adjust == -1){ if (ci + adjust < 0) { return; } while(this.cm.isHidden(ci+adjust)){ --adjust; if(ci+adjust < 0){ return; } } } this.cellIndex = ci+adjust; this.split = t.dom; if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){ Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this, arguments); } }else if(this.view.columnDrag){ this.view.columnDrag.callHandleMouseDown(e); } } }, endDrag : function(e){ this.marker.hide(); var v = this.view; var endX = Math.max(this.minX, e.getPageX()); var diff = endX - this.startPos; v.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff); setTimeout(function(){ v.headersDisabled = false; }, 50); }, autoOffset : function(){ this.setDelta(0,0); } });
- Ext.grid.GroupingView = Ext.extend(Ext.grid.GridView, {
- hideGroupedColumn:false,
- showGroupName:true,
- startCollapsed:false,
- enableGrouping:true,
- enableGroupingMenu:true,
- enableNoGroups:true,
- emptyGroupText : '(None)',
- ignoreAdd: false,
- groupTextTpl : '{text}',
- gidSeed : 1000,
- initTemplates : function(){
- Ext.grid.GroupingView.superclass.initTemplates.call(this);
- this.state = {};
- var sm = this.grid.getSelectionModel();
- sm.on(sm.selectRow ? 'beforerowselect' : 'beforecellselect',
- this.onBeforeRowSelect, this);
- if(!this.startGroup){
- this.startGroup = new Ext.XTemplate(
- '<div id="{groupId}" class="x-grid-group {cls}">',
- '<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div>', this.groupTextTpl ,'</div></div>',
- '<div id="{groupId}-bd" class="x-grid-group-body">'
- );
- }
- this.startGroup.compile();
- this.endGroup = '</div></div>';
- },
- findGroup : function(el){
- return Ext.fly(el).up('.x-grid-group', this.mainBody.dom);
- },
- getGroups : function(){
- return this.hasRows() ? this.mainBody.dom.childNodes : [];
- },
- onAdd : function(){
- if(this.enableGrouping && !this.ignoreAdd){
- var ss = this.getScrollState();
- this.refresh();
- this.restoreScroll(ss);
- }else if(!this.enableGrouping){
- Ext.grid.GroupingView.superclass.onAdd.apply(this, arguments);
- }
- },
- onRemove : function(ds, record, index, isUpdate){
- Ext.grid.GroupingView.superclass.onRemove.apply(this, arguments);
- var g = document.getElementById(record._groupId);
- if(g && g.childNodes[1].childNodes.length < 1){
- Ext.removeNode(g);
- }
- this.applyEmptyText();
- },
- refreshRow : function(record){
- if(this.ds.getCount()==1){
- this.refresh();
- }else{
- this.isUpdating = true;
- Ext.grid.GroupingView.superclass.refreshRow.apply(this, arguments);
- this.isUpdating = false;
- }
- },
- beforeMenuShow : function(){
- var field = this.getGroupField();
- var g = this.hmenu.items.get('groupBy');
- if(g){
- g.setDisabled(this.cm.config[this.hdCtxIndex].groupable === false);
- }
- var s = this.hmenu.items.get('showGroups');
- if(s){
- s.setDisabled(!field && this.cm.config[this.hdCtxIndex].groupable === false);
- s.setChecked(!!field, true);
- }
- },
- renderUI : function(){
- Ext.grid.GroupingView.superclass.renderUI.call(this);
- this.mainBody.on('mousedown', this.interceptMouse, this);
- if(this.enableGroupingMenu && this.hmenu){
- this.hmenu.add('-',{
- id:'groupBy',
- text: this.groupByText,
- handler: this.onGroupByClick,
- scope: this,
- iconCls:'x-group-by-icon'
- });
- if(this.enableNoGroups){
- this.hmenu.add({
- id:'showGroups',
- text: this.showGroupsText,
- checked: true,
- checkHandler: this.onShowGroupsClick,
- scope: this
- });
- }
- this.hmenu.on('beforeshow', this.beforeMenuShow, this);
- }
- },
- onGroupByClick : function(){
- this.grid.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));
- this.beforeMenuShow(); },
- onShowGroupsClick : function(mi, checked){
- if(checked){
- this.onGroupByClick();
- }else{
- this.grid.store.clearGrouping();
- }
- },
- toggleGroup : function(group, expanded){
- this.grid.stopEditing(true);
- group = Ext.getDom(group);
- var gel = Ext.fly(group);
- expanded = expanded !== undefined ?
- expanded : gel.hasClass('x-grid-group-collapsed');
- this.state[gel.dom.id] = expanded;
- gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');
- },
- toggleAllGroups : function(expanded){
- var groups = this.getGroups();
- for(var i = 0, len = groups.length; i < len; i++){
- this.toggleGroup(groups[i], expanded);
- }
- },
- expandAllGroups : function(){
- this.toggleAllGroups(true);
- },
- collapseAllGroups : function(){
- this.toggleAllGroups(false);
- },
- interceptMouse : function(e){
- var hd = e.getTarget('.x-grid-group-hd', this.mainBody);
- if(hd){
- e.stopEvent();
- this.toggleGroup(hd.parentNode);
- }
- },
- getGroup : function(v, r, groupRenderer, rowIndex, colIndex, ds){
- var g = groupRenderer ? groupRenderer(v, {}, r, rowIndex, colIndex, ds) : String(v);
- if(g === ''){
- g = this.cm.config[colIndex].emptyGroupText || this.emptyGroupText;
- }
- return g;
- },
- getGroupField : function(){
- return this.grid.store.getGroupState();
- },
- renderRows : function(){
- var groupField = this.getGroupField();
- var eg = !!groupField;
- if(this.hideGroupedColumn) {
- var colIndex = this.cm.findColumnIndex(groupField);
- if(!eg && this.lastGroupField !== undefined) {
- this.mainBody.update('');
- this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField), false);
- delete this.lastGroupField;
- }else if (eg && this.lastGroupField === undefined) {
- this.lastGroupField = groupField;
- this.cm.setHidden(colIndex, true);
- }else if (eg && this.lastGroupField !== undefined && groupField !== this.lastGroupField) {
- this.mainBody.update('');
- var oldIndex = this.cm.findColumnIndex(this.lastGroupField);
- this.cm.setHidden(oldIndex, false);
- this.lastGroupField = groupField;
- this.cm.setHidden(colIndex, true);
- }
- }
- return Ext.grid.GroupingView.superclass.renderRows.apply(
- this, arguments);
- },
- doRender : function(cs, rs, ds, startRow, colCount, stripe){
- if(rs.length < 1){
- return '';
- }
- var groupField = this.getGroupField();
- var colIndex = this.cm.findColumnIndex(groupField);
- this.enableGrouping = !!groupField;
- if(!this.enableGrouping || this.isUpdating){
- return Ext.grid.GroupingView.superclass.doRender.apply(
- this, arguments);
- }
- var gstyle = 'width:'+this.getTotalWidth()+';';
- var gidPrefix = this.grid.getGridEl().id;
- var cfg = this.cm.config[colIndex];
- var groupRenderer = cfg.groupRenderer || cfg.renderer;
- var prefix = this.showGroupName ?
- (cfg.groupName || cfg.header)+': ' : '';
- var groups = [], curGroup, i, len, gid;
- for(i = 0, len = rs.length; i < len; i++){
- var rowIndex = startRow + i;
- var r = rs[i],
- gvalue = r.data[groupField],
- g = this.getGroup(gvalue, r, groupRenderer, rowIndex, colIndex, ds);
- if(!curGroup || curGroup.group != g){
- gid = gidPrefix + '-gp-' + groupField + '-' + Ext.util.Format.htmlEncode(g);
- var isCollapsed = typeof this.state[gid] !== 'undefined' ? !this.state[gid] : this.startCollapsed;
- var gcls = isCollapsed ? 'x-grid-group-collapsed' : '';
- curGroup = {
- group: g,
- gvalue: gvalue,
- text: prefix + g,
- groupId: gid,
- startRow: rowIndex,
- rs: [r],
- cls: gcls,
- style: gstyle
- };
- groups.push(curGroup);
- }else{
- curGroup.rs.push(r);
- }
- r._groupId = gid;
- }
- var buf = [];
- for(i = 0, len = groups.length; i < len; i++){
- var g = groups[i];
- this.doGroupStart(buf, g, cs, ds, colCount);
- buf[buf.length] = Ext.grid.GroupingView.superclass.doRender.call(
- this, cs, g.rs, ds, g.startRow, colCount, stripe);
- this.doGroupEnd(buf, g, cs, ds, colCount);
- }
- return buf.join('');
- },
- getGroupId : function(value){
- var gidPrefix = this.grid.getGridEl().id;
- var groupField = this.getGroupField();
- var colIndex = this.cm.findColumnIndex(groupField);
- var cfg = this.cm.config[colIndex];
- var groupRenderer = cfg.groupRenderer || cfg.renderer;
- var gtext = this.getGroup(value, {data:{}}, groupRenderer, 0, colIndex, this.ds);
- return gidPrefix + '-gp-' + groupField + '-' + Ext.util.Format.htmlEncode(value);
- },
- doGroupStart : function(buf, g, cs, ds, colCount){
- buf[buf.length] = this.startGroup.apply(g);
- },
- doGroupEnd : function(buf, g, cs, ds, colCount){
- buf[buf.length] = this.endGroup;
- },
- getRows : function(){
- if(!this.enableGrouping){
- return Ext.grid.GroupingView.superclass.getRows.call(this);
- }
- var r = [];
- var g, gs = this.getGroups();
- for(var i = 0, len = gs.length; i < len; i++){
- g = gs[i].childNodes[1].childNodes;
- for(var j = 0, jlen = g.length; j < jlen; j++){
- r[r.length] = g[j];
- }
- }
- return r;
- },
- updateGroupWidths : function(){
- if(!this.enableGrouping || !this.hasRows()){
- return;
- }
- var tw = Math.max(this.cm.getTotalWidth(), this.el.dom.offsetWidth-this.scrollOffset) +'px';
- var gs = this.getGroups();
- for(var i = 0, len = gs.length; i < len; i++){
- gs[i].firstChild.style.width = tw;
- }
- },
- onColumnWidthUpdated : function(col, w, tw){
- this.updateGroupWidths();
- },
- onAllColumnWidthsUpdated : function(ws, tw){
- this.updateGroupWidths();
- },
- onColumnHiddenUpdated : function(col, hidden, tw){
- this.updateGroupWidths();
- },
- onLayout : function(){
- this.updateGroupWidths();
- },
- onBeforeRowSelect : function(sm, rowIndex){
- if(!this.enableGrouping){
- return;
- }
- var row = this.getRow(rowIndex);
- if(row && !row.offsetParent){
- var g = this.findGroup(row);
- this.toggleGroup(g, true);
- }
- },
- groupByText: 'Group By This Field',
- showGroupsText: 'Show in Groups'
- });
- Ext.grid.GroupingView.GROUP_ID = 1000; Ext.grid.HeaderDragZone = function(grid, hd, hd2){
- this.grid = grid;
- this.view = grid.getView();
- this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
- Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);
- if(hd2){
- this.setHandleElId(Ext.id(hd));
- this.setOuterHandleElId(Ext.id(hd2));
- }
- this.scroll = false;
- };
- Ext.extend(Ext.grid.HeaderDragZone, Ext.dd.DragZone, {
- maxDragWidth: 120,
- getDragData : function(e){
- var t = Ext.lib.Event.getTarget(e);
- var h = this.view.findHeaderCell(t);
- if(h){
- return {ddel: h.firstChild, header:h};
- }
- return false;
- },
- onInitDrag : function(e){
- this.view.headersDisabled = true;
- var clone = this.dragData.ddel.cloneNode(true);
- clone.id = Ext.id();
- clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";
- this.proxy.update(clone);
- return true;
- },
- afterValidDrop : function(){
- var v = this.view;
- setTimeout(function(){
- v.headersDisabled = false;
- }, 50);
- },
- afterInvalidDrop : function(){
- var v = this.view;
- setTimeout(function(){
- v.headersDisabled = false;
- }, 50);
- }
- });
- Ext.grid.HeaderDropZone = function(grid, hd, hd2){
- this.grid = grid;
- this.view = grid.getView();
- this.proxyTop = Ext.DomHelper.append(document.body, {
- cls:"col-move-top", html:" "
- }, true);
- this.proxyBottom = Ext.DomHelper.append(document.body, {
- cls:"col-move-bottom", html:" "
- }, true);
- this.proxyTop.hide = this.proxyBottom.hide = function(){
- this.setLeftTop(-100,-100);
- this.setStyle("visibility", "hidden");
- };
- this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
- Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);
- };
- Ext.extend(Ext.grid.HeaderDropZone, Ext.dd.DropZone, {
- proxyOffsets : [-4, -9],
- fly: Ext.Element.fly,
- getTargetFromEvent : function(e){
- var t = Ext.lib.Event.getTarget(e);
- var cindex = this.view.findCellIndex(t);
- if(cindex !== false){
- return this.view.getHeaderCell(cindex);
- }
- },
- nextVisible : function(h){
- var v = this.view, cm = this.grid.colModel;
- h = h.nextSibling;
- while(h){
- if(!cm.isHidden(v.getCellIndex(h))){
- return h;
- }
- h = h.nextSibling;
- }
- return null;
- },
- prevVisible : function(h){
- var v = this.view, cm = this.grid.colModel;
- h = h.prevSibling;
- while(h){
- if(!cm.isHidden(v.getCellIndex(h))){
- return h;
- }
- h = h.prevSibling;
- }
- return null;
- },
- positionIndicator : function(h, n, e){
- var x = Ext.lib.Event.getPageX(e);
- var r = Ext.lib.Dom.getRegion(n.firstChild);
- var px, pt, py = r.top + this.proxyOffsets[1];
- if((r.right - x) <= (r.right-r.left)/2){
- px = r.right+this.view.borderWidth;
- pt = "after";
- }else{
- px = r.left;
- pt = "before";
- }
- var oldIndex = this.view.getCellIndex(h);
- var newIndex = this.view.getCellIndex(n);
- if(this.grid.colModel.isFixed(newIndex)){
- return false;
- }
- var locked = this.grid.colModel.isLocked(newIndex);
- if(pt == "after"){
- newIndex++;
- }
- if(oldIndex < newIndex){
- newIndex--;
- }
- if(oldIndex == newIndex && (locked == this.grid.colModel.isLocked(oldIndex))){
- return false;
- }
- px += this.proxyOffsets[0];
- this.proxyTop.setLeftTop(px, py);
- this.proxyTop.show();
- if(!this.bottomOffset){
- this.bottomOffset = this.view.mainHd.getHeight();
- }
- this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);
- this.proxyBottom.show();
- return pt;
- },
- onNodeEnter : function(n, dd, e, data){
- if(data.header != n){
- this.positionIndicator(data.header, n, e);
- }
- },
- onNodeOver : function(n, dd, e, data){
- var result = false;
- if(data.header != n){
- result = this.positionIndicator(data.header, n, e);
- }
- if(!result){
- this.proxyTop.hide();
- this.proxyBottom.hide();
- }
- return result ? this.dropAllowed : this.dropNotAllowed;
- },
- onNodeOut : function(n, dd, e, data){
- this.proxyTop.hide();
- this.proxyBottom.hide();
- },
- onNodeDrop : function(n, dd, e, data){
- var h = data.header;
- if(h != n){
- var cm = this.grid.colModel;
- var x = Ext.lib.Event.getPageX(e);
- var r = Ext.lib.Dom.getRegion(n.firstChild);
- var pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before";
- var oldIndex = this.view.getCellIndex(h);
- var newIndex = this.view.getCellIndex(n);
- var locked = cm.isLocked(newIndex);
- if(pt == "after"){
- newIndex++;
- }
- if(oldIndex < newIndex){
- newIndex--;
- }
- if(oldIndex == newIndex && (locked == cm.isLocked(oldIndex))){
- return false;
- }
- cm.setLocked(oldIndex, locked, true);
- cm.moveColumn(oldIndex, newIndex);
- this.grid.fireEvent("columnmove", oldIndex, newIndex);
- return true;
- }
- return false;
- }
- });
- Ext.grid.GridView.ColumnDragZone = function(grid, hd){
- Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);
- this.proxy.el.addClass('x-grid3-col-dd');
- };
- Ext.extend(Ext.grid.GridView.ColumnDragZone, Ext.grid.HeaderDragZone, {
- handleMouseDown : function(e){
- },
- callHandleMouseDown : function(e){
- Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);
- }
- }); Ext.grid.SplitDragZone = function(grid, hd, hd2){ this.grid = grid; this.view = grid.getView(); this.proxy = this.view.resizeProxy; Ext.grid.SplitDragZone.superclass.constructor.call(this, hd, "gridSplitters" + this.grid.getGridEl().id, { dragElId : Ext.id(this.proxy.dom), resizeFrame:false }); this.setHandleElId(Ext.id(hd)); this.setOuterHandleElId(Ext.id(hd2)); this.scroll = false; }; Ext.extend(Ext.grid.SplitDragZone, Ext.dd.DDProxy, { fly: Ext.Element.fly, b4StartDrag : function(x, y){ this.view.headersDisabled = true; this.proxy.setHeight(this.view.mainWrap.getHeight()); var w = this.cm.getColumnWidth(this.cellIndex); var minw = Math.max(w-this.grid.minColumnWidth, 0); this.resetConstraints(); this.setXConstraint(minw, 1000); this.setYConstraint(0, 0); this.minX = x - minw; this.maxX = x + 1000; this.startPos = x; Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y); }, handleMouseDown : function(e){ ev = Ext.EventObject.setEvent(e); var t = this.fly(ev.getTarget()); if(t.hasClass("x-grid-split")){ this.cellIndex = this.view.getCellIndex(t.dom); this.split = t.dom; this.cm = this.grid.colModel; if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){ Ext.grid.SplitDragZone.superclass.handleMouseDown.apply(this, arguments); } } }, endDrag : function(e){ this.view.headersDisabled = false; var endX = Math.max(this.minX, Ext.lib.Event.getPageX(e)); var diff = endX - this.startPos; this.view.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff); }, autoOffset : function(){ this.setDelta(0,0); } }); Ext.grid.GridDragZone = function(grid, config){ this.view = grid.getView(); Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config); if(this.view.lockedBody){ this.setHandleElId(Ext.id(this.view.mainBody.dom)); this.setOuterHandleElId(Ext.id(this.view.lockedBody.dom)); } this.scroll = false; this.grid = grid; this.ddel = document.createElement('div'); this.ddel.className = 'x-grid-dd-wrap'; }; Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, { ddGroup : "GridDD", getDragData : function(e){ var t = Ext.lib.Event.getTarget(e); var rowIndex = this.view.findRowIndex(t); if(rowIndex !== false){ var sm = this.grid.selModel; if(!sm.isSelected(rowIndex) || e.hasModifier()){ sm.handleMouseDown(this.grid, rowIndex, e); } return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()}; } return false; }, onInitDrag : function(e){ var data = this.dragData; this.ddel.innerHTML = this.grid.getDragDropText(); this.proxy.update(this.ddel); }, afterRepair : function(){ this.dragging = false; }, getRepairXY : function(e, data){ return false; }, onEndDrag : function(data, e){ }, onValidDrop : function(dd, e, id){ this.hideProxy(); }, beforeInvalidDrop : function(e, id){ } }); Ext.grid.ColumnModel = function(config){ this.defaultWidth = 100; this.defaultSortable = false; if(config.columns){ Ext.apply(this, config); this.setConfig(config.columns, true); }else{ this.setConfig(config, true); } this.addEvents( "widthchange", "headerchange", "hiddenchange", "columnmoved", "columnlockchange", "configchange" ); Ext.grid.ColumnModel.superclass.constructor.call(this); }; Ext.extend(Ext.grid.ColumnModel, Ext.util.Observable, { getColumnId : function(index){ return this.config[index].id; }, setConfig : function(config, initial){ if(!initial){ delete this.totalWidth; for(var i = 0, len = this.config.length; i < len; i++){ var c = this.config[i]; if(c.editor){ c.editor.destroy(); } } } this.config = config; this.lookup = {}; for(var i = 0, len = config.length; i < len; i++){ var c = config[i]; if(typeof c.renderer == "string"){ c.renderer = Ext.util.Format[c.renderer]; } if(typeof c.id == "undefined"){ c.id = i; } if(c.editor && c.editor.isFormField){ c.editor = new Ext.grid.GridEditor(c.editor); } this.lookup[c.id] = c; } if(!initial){ this.fireEvent('configchange', this); } }, getColumnById : function(id){ return this.lookup[id]; }, getIndexById : function(id){ for(var i = 0, len = this.config.length; i < len; i++){ if(this.config[i].id == id){ return i; } } return -1; }, moveColumn : function(oldIndex, newIndex){ var c = this.config[oldIndex]; this.config.splice(oldIndex, 1); this.config.splice(newIndex, 0, c); this.dataMap = null; this.fireEvent("columnmoved", this, oldIndex, newIndex); }, isLocked : function(colIndex){ return this.config[colIndex].locked === true; }, setLocked : function(colIndex, value, suppressEvent){ if(this.isLocked(colIndex) == value){ return; } this.config[colIndex].locked = value; if(!suppressEvent){ this.fireEvent("columnlockchange", this, colIndex, value); } }, getTotalLockedWidth : function(){ var totalWidth = 0; for(var i = 0; i < this.config.length; i++){ if(this.isLocked(i) && !this.isHidden(i)){ this.totalWidth += this.getColumnWidth(i); } } return totalWidth; }, getLockedCount : function(){ for(var i = 0, len = this.config.length; i < len; i++){ if(!this.isLocked(i)){ return i; } } }, getColumnCount : function(visibleOnly){ if(visibleOnly === true){ var c = 0; for(var i = 0, len = this.config.length; i < len; i++){ if(!this.isHidden(i)){ c++; } } return c; } return this.config.length; }, getColumnsBy : function(fn, scope){ var r = []; for(var i = 0, len = this.config.length; i < len; i++){ var c = this.config[i]; if(fn.call(scope||this, c, i) === true){ r[r.length] = c; } } return r; }, isSortable : function(col){ if(typeof this.config[col].sortable == "undefined"){ return this.defaultSortable; } return this.config[col].sortable; }, isMenuDisabled : function(col){ return !!this.config[col].menuDisabled; }, getRenderer : function(col){ if(!this.config[col].renderer){ return Ext.grid.ColumnModel.defaultRenderer; } return this.config[col].renderer; }, setRenderer : function(col, fn){ this.config[col].renderer = fn; }, getColumnWidth : function(col){ return this.config[col].width || this.defaultWidth; }, setColumnWidth : function(col, width, suppressEvent){ this.config[col].width = width; this.totalWidth = null; if(!suppressEvent){ this.fireEvent("widthchange", this, col, width); } }, getTotalWidth : function(includeHidden){ if(!this.totalWidth){ this.totalWidth = 0; for(var i = 0, len = this.config.length; i < len; i++){ if(includeHidden || !this.isHidden(i)){ this.totalWidth += this.getColumnWidth(i); } } } return this.totalWidth; }, getColumnHeader : function(col){ return this.config[col].header; }, setColumnHeader : function(col, header){ this.config[col].header = header; this.fireEvent("headerchange", this, col, header); }, getColumnTooltip : function(col){ return this.config[col].tooltip; }, setColumnTooltip : function(col, tooltip){ this.config[col].tooltip = tooltip; }, getDataIndex : function(col){ return this.config[col].dataIndex; }, setDataIndex : function(col, dataIndex){ this.config[col].dataIndex = dataIndex; }, findColumnIndex : function(dataIndex){ var c = this.config; for(var i = 0, len = c.length; i < len; i++){ if(c[i].dataIndex == dataIndex){ return i; } } return -1; }, isCellEditable : function(colIndex, rowIndex){ return (this.config[colIndex].editable || (typeof this.config[colIndex].editable == "undefined" && this.config[colIndex].editor)) ? true : false; }, getCellEditor : function(colIndex, rowIndex){ return this.config[colIndex].editor; }, setEditable : function(col, editable){ this.config[col].editable = editable; }, isHidden : function(colIndex){ return this.config[colIndex].hidden; }, isFixed : function(colIndex){ return this.config[colIndex].fixed; }, isResizable : function(colIndex){ return colIndex >= 0 && this.config[colIndex].resizable !== false && this.config[colIndex].fixed !== true; }, setHidden : function(colIndex, hidden){ var c = this.config[colIndex]; if(c.hidden !== hidden){ c.hidden = hidden; this.totalWidth = null; this.fireEvent("hiddenchange", this, colIndex, hidden); } }, setEditor : function(col, editor){ this.config[col].editor = editor; } }); Ext.grid.ColumnModel.defaultRenderer = function(value){ if(typeof value == "string" && value.length < 1){ return " "; } return value; }; Ext.grid.DefaultColumnModel = Ext.grid.ColumnModel;
- Ext.grid.AbstractSelectionModel = function(){
- this.locked = false;
- Ext.grid.AbstractSelectionModel.superclass.constructor.call(this);
- };
- Ext.extend(Ext.grid.AbstractSelectionModel, Ext.util.Observable, {
- init : function(grid){
- this.grid = grid;
- this.initEvents();
- },
- lock : function(){
- this.locked = true;
- },
- unlock : function(){
- this.locked = false;
- },
- isLocked : function(){
- return this.locked;
- }
- }); Ext.grid.RowSelectionModel = function(config){ Ext.apply(this, config); this.selections = new Ext.util.MixedCollection(false, function(o){ return o.id; }); this.last = false; this.lastActive = false; this.addEvents( "selectionchange", "beforerowselect", "rowselect", "rowdeselect" ); Ext.grid.RowSelectionModel.superclass.constructor.call(this); }; Ext.extend(Ext.grid.RowSelectionModel, Ext.grid.AbstractSelectionModel, { singleSelect : false, initEvents : function(){ if(!this.grid.enableDragDrop && !this.grid.enableDrag){ this.grid.on("rowmousedown", this.handleMouseDown, this); }else{ this.grid.on("rowclick", function(grid, rowIndex, e) { if(e.button === 0 && !e.shiftKey && !e.ctrlKey) { this.selectRow(rowIndex, false); grid.view.focusRow(rowIndex); } }, this); } this.rowNav = new Ext.KeyNav(this.grid.getGridEl(), { "up" : function(e){ if(!e.shiftKey){ this.selectPrevious(e.shiftKey); }else if(this.last !== false && this.lastActive !== false){ var last = this.last; this.selectRange(this.last, this.lastActive-1); this.grid.getView().focusRow(this.lastActive); if(last !== false){ this.last = last; } }else{ this.selectFirstRow(); } }, "down" : function(e){ if(!e.shiftKey){ this.selectNext(e.shiftKey); }else if(this.last !== false && this.lastActive !== false){ var last = this.last; this.selectRange(this.last, this.lastActive+1); this.grid.getView().focusRow(this.lastActive); if(last !== false){ this.last = last; } }else{ this.selectFirstRow(); } }, scope: this }); var view = this.grid.view; view.on("refresh", this.onRefresh, this); view.on("rowupdated", this.onRowUpdated, this); view.on("rowremoved", this.onRemove, this); }, onRefresh : function(){ var ds = this.grid.store, index; var s = this.getSelections(); this.clearSelections(true); for(var i = 0, len = s.length; i < len; i++){ var r = s[i]; if((index = ds.indexOfId(r.id)) != -1){ this.selectRow(index, true); } } if(s.length != this.selections.getCount()){ this.fireEvent("selectionchange", this); } }, onRemove : function(v, index, r){ if(this.selections.remove(r) !== false){ this.fireEvent('selectionchange', this); } }, onRowUpdated : function(v, index, r){ if(this.isSelected(r)){ v.onRowSelect(index); } }, selectRecords : function(records, keepExisting){ if(!keepExisting){ this.clearSelections(); } var ds = this.grid.store; for(var i = 0, len = records.length; i < len; i++){ this.selectRow(ds.indexOf(records[i]), true); } }, getCount : function(){ return this.selections.length; }, selectFirstRow : function(){ this.selectRow(0); }, selectLastRow : function(keepExisting){ this.selectRow(this.grid.store.getCount() - 1, keepExisting); }, selectNext : function(keepExisting){ if(this.hasNext()){ this.selectRow(this.last+1, keepExisting); this.grid.getView().focusRow(this.last); return true; } return false; }, selectPrevious : function(keepExisting){ if(this.hasPrevious()){ this.selectRow(this.last-1, keepExisting); this.grid.getView().focusRow(this.last); return true; } return false; }, hasNext : function(){ return this.last !== false && (this.last+1) < this.grid.store.getCount(); }, hasPrevious : function(){ return !!this.last; }, getSelections : function(){ return [].concat(this.selections.items); }, getSelected : function(){ return this.selections.itemAt(0); }, each : function(fn, scope){ var s = this.getSelections(); for(var i = 0, len = s.length; i < len; i++){ if(fn.call(scope || this, s[i], i) === false){ return false; } } return true; }, clearSelections : function(fast){ if(this.locked) return; if(fast !== true){ var ds = this.grid.store; var s = this.selections; s.each(function(r){ this.deselectRow(ds.indexOfId(r.id)); }, this); s.clear(); }else{ this.selections.clear(); } this.last = false; }, selectAll : function(){ if(this.locked) return; this.selections.clear(); for(var i = 0, len = this.grid.store.getCount(); i < len; i++){ this.selectRow(i, true); } }, hasSelection : function(){ return this.selections.length > 0; }, isSelected : function(index){ var r = typeof index == "number" ? this.grid.store.getAt(index) : index; return (r && this.selections.key(r.id) ? true : false); }, isIdSelected : function(id){ return (this.selections.key(id) ? true : false); }, handleMouseDown : function(g, rowIndex, e){ if(e.button !== 0 || this.isLocked()){ return; }; var view = this.grid.getView(); if(e.shiftKey && this.last !== false){ var last = this.last; this.selectRange(last, rowIndex, e.ctrlKey); this.last = last; view.focusRow(rowIndex); }else{ var isSelected = this.isSelected(rowIndex); if(e.ctrlKey && isSelected){ this.deselectRow(rowIndex); }else if(!isSelected || this.getCount() > 1){ this.selectRow(rowIndex, e.ctrlKey || e.shiftKey); view.focusRow(rowIndex); } } }, selectRows : function(rows, keepExisting){ if(!keepExisting){ this.clearSelections(); } for(var i = 0, len = rows.length; i < len; i++){ this.selectRow(rows[i], true); } }, selectRange : function(startRow, endRow, keepExisting){ if(this.locked) return; if(!keepExisting){ this.clearSelections(); } if(startRow <= endRow){ for(var i = startRow; i <= endRow; i++){ this.selectRow(i, true); } }else{ for(var i = startRow; i >= endRow; i--){ this.selectRow(i, true); } } }, deselectRange : function(startRow, endRow, preventViewNotify){ if(this.locked) return; for(var i = startRow; i <= endRow; i++){ this.deselectRow(i, preventViewNotify); } }, selectRow : function(index, keepExisting, preventViewNotify){ if(this.locked || (index < 0 || index >= this.grid.store.getCount()) || this.isSelected(index)) return; var r = this.grid.store.getAt(index); if(r && this.fireEvent("beforerowselect", this, index, keepExisting, r) !== false){ if(!keepExisting || this.singleSelect){ this.clearSelections(); } this.selections.add(r); this.last = this.lastActive = index; if(!preventViewNotify){ this.grid.getView().onRowSelect(index); } this.fireEvent("rowselect", this, index, r); this.fireEvent("selectionchange", this); } }, deselectRow : function(index, preventViewNotify){ if(this.locked) return; if(this.last == index){ this.last = false; } if(this.lastActive == index){ this.lastActive = false; } var r = this.grid.store.getAt(index); if(r){ this.selections.remove(r); if(!preventViewNotify){ this.grid.getView().onRowDeselect(index); } this.fireEvent("rowdeselect", this, index, r); this.fireEvent("selectionchange", this); } }, restoreLast : function(){ if(this._last){ this.last = this._last; } }, acceptsNav : function(row, col, cm){ return !cm.isHidden(col) && cm.isCellEditable(col, row); }, onEditorKey : function(field, e){ var k = e.getKey(), newCell, g = this.grid, ed = g.activeEditor; var shift = e.shiftKey; if(k == e.TAB){ e.stopEvent(); ed.completeEdit(); if(shift){ newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this); }else{ newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this); } }else if(k == e.ENTER){ e.stopEvent(); ed.completeEdit(); if(this.moveEditorOnEnter !== false){ if(shift){ newCell = g.walkCells(ed.row - 1, ed.col, -1, this.acceptsNav, this); }else{ newCell = g.walkCells(ed.row + 1, ed.col, 1, this.acceptsNav, this); } } }else if(k == e.ESC){ ed.cancelEdit(); } if(newCell){ g.startEditing(newCell[0], newCell[1]); } } }); Ext.grid.CellSelectionModel = function(config){ Ext.apply(this, config); this.selection = null; this.addEvents( "beforecellselect", "cellselect", "selectionchange" ); Ext.grid.CellSelectionModel.superclass.constructor.call(this); }; Ext.extend(Ext.grid.CellSelectionModel, Ext.grid.AbstractSelectionModel, { initEvents : function(){ this.grid.on("cellmousedown", this.handleMouseDown, this); this.grid.getGridEl().on(Ext.isIE || Ext.isSafari3 ? "keydown" : "keypress", this.handleKeyDown, this); var view = this.grid.view; view.on("refresh", this.onViewChange, this); view.on("rowupdated", this.onRowUpdated, this); view.on("beforerowremoved", this.clearSelections, this); view.on("beforerowsinserted", this.clearSelections, this); if(this.grid.isEditor){ this.grid.on("beforeedit", this.beforeEdit, this); } }, beforeEdit : function(e){ this.select(e.row, e.column, false, true, e.record); }, onRowUpdated : function(v, index, r){ if(this.selection && this.selection.record == r){ v.onCellSelect(index, this.selection.cell[1]); } }, onViewChange : function(){ this.clearSelections(true); }, getSelectedCell : function(){ return this.selection ? this.selection.cell : null; }, clearSelections : function(preventNotify){ var s = this.selection; if(s){ if(preventNotify !== true){ this.grid.view.onCellDeselect(s.cell[0], s.cell[1]); } this.selection = null; this.fireEvent("selectionchange", this, null); } }, hasSelection : function(){ return this.selection ? true : false; }, handleMouseDown : function(g, row, cell, e){ if(e.button !== 0 || this.isLocked()){ return; }; this.select(row, cell); }, select : function(rowIndex, colIndex, preventViewNotify, preventFocus, r){ if(this.fireEvent("beforecellselect", this, rowIndex, colIndex) !== false){ this.clearSelections(); r = r || this.grid.store.getAt(rowIndex); this.selection = { record : r, cell : [rowIndex, colIndex] }; if(!preventViewNotify){ var v = this.grid.getView(); v.onCellSelect(rowIndex, colIndex); if(preventFocus !== true){ v.focusCell(rowIndex, colIndex); } } this.fireEvent("cellselect", this, rowIndex, colIndex); this.fireEvent("selectionchange", this, this.selection); } }, isSelectable : function(rowIndex, colIndex, cm){ return !cm.isHidden(colIndex); }, handleKeyDown : function(e){ if(!e.isNavKeyPress()){ return; } var g = this.grid, s = this.selection; if(!s){ e.stopEvent(); var cell = g.walkCells(0, 0, 1, this.isSelectable, this); if(cell){ this.select(cell[0], cell[1]); } return; } var sm = this; var walk = function(row, col, step){ return g.walkCells(row, col, step, sm.isSelectable, sm); }; var k = e.getKey(), r = s.cell[0], c = s.cell[1]; var newCell; switch(k){ case e.TAB: if(e.shiftKey){ newCell = walk(r, c-1, -1); }else{ newCell = walk(r, c+1, 1); } break; case e.DOWN: newCell = walk(r+1, c, 1); break; case e.UP: newCell = walk(r-1, c, -1); break; case e.RIGHT: newCell = walk(r, c+1, 1); break; case e.LEFT: newCell = walk(r, c-1, -1); break; case e.ENTER: if(g.isEditor && !g.editing){ g.startEditing(r, c); e.stopEvent(); return; } break; }; if(newCell){ this.select(newCell[0], newCell[1]); e.stopEvent(); } }, acceptsNav : function(row, col, cm){ return !cm.isHidden(col) && cm.isCellEditable(col, row); }, onEditorKey : function(field, e){ var k = e.getKey(), newCell, g = this.grid, ed = g.activeEditor; if(k == e.TAB){ if(e.shiftKey){ newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this); }else{ newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this); } e.stopEvent(); }else if(k == e.ENTER){ ed.completeEdit(); e.stopEvent(); }else if(k == e.ESC){ e.stopEvent(); ed.cancelEdit(); } if(newCell){ g.startEditing(newCell[0], newCell[1]); } } }); Ext.grid.EditorGridPanel = Ext.extend(Ext.grid.GridPanel, { clicksToEdit: 2, isEditor : true, detectEdit: false, autoEncode : false, trackMouseOver: false, initComponent : function(){ Ext.grid.EditorGridPanel.superclass.initComponent.call(this); if(!this.selModel){ this.selModel = new Ext.grid.CellSelectionModel(); } this.activeEditor = null; this.addEvents( "beforeedit", "afteredit", "validateedit" ); }, initEvents : function(){ Ext.grid.EditorGridPanel.superclass.initEvents.call(this); this.on("bodyscroll", this.stopEditing, this, [true]); if(this.clicksToEdit == 1){ this.on("cellclick", this.onCellDblClick, this); }else { if(this.clicksToEdit == 'auto' && this.view.mainBody){ this.view.mainBody.on("mousedown", this.onAutoEditClick, this); } this.on("celldblclick", this.onCellDblClick, this); } this.getGridEl().addClass("xedit-grid"); }, onCellDblClick : function(g, row, col){ this.startEditing(row, col); }, onAutoEditClick : function(e, t){ if(e.button !== 0){ return; } var row = this.view.findRowIndex(t); var col = this.view.findCellIndex(t); if(row !== false && col !== false){ this.stopEditing(); if(this.selModel.getSelectedCell){ var sc = this.selModel.getSelectedCell(); if(sc && sc.cell[0] === row && sc.cell[1] === col){ this.startEditing(row, col); } }else{ if(this.selModel.isSelected(row)){ this.startEditing(row, col); } } } }, onEditComplete : function(ed, value, startValue){ this.editing = false; this.activeEditor = null; ed.un("specialkey", this.selModel.onEditorKey, this.selModel); var r = ed.record; var field = this.colModel.getDataIndex(ed.col); value = this.postEditValue(value, startValue, r, field); if(String(value) !== String(startValue)){ var e = { grid: this, record: r, field: field, originalValue: startValue, value: value, row: ed.row, column: ed.col, cancel:false }; if(this.fireEvent("validateedit", e) !== false && !e.cancel){ r.set(field, e.value); delete e.cancel; this.fireEvent("afteredit", e); } } this.view.focusCell(ed.row, ed.col); }, startEditing : function(row, col){ this.stopEditing(); if(this.colModel.isCellEditable(col, row)){ this.view.ensureVisible(row, col, true); var r = this.store.getAt(row); var field = this.colModel.getDataIndex(col); var e = { grid: this, record: r, field: field, value: r.data[field], row: row, column: col, cancel:false }; if(this.fireEvent("beforeedit", e) !== false && !e.cancel){ this.editing = true; var ed = this.colModel.getCellEditor(col, row); if(!ed.rendered){ ed.render(this.view.getEditorParent(ed)); } (function(){ ed.row = row; ed.col = col; ed.record = r; ed.on("complete", this.onEditComplete, this, {single: true}); ed.on("specialkey", this.selModel.onEditorKey, this.selModel); this.activeEditor = ed; var v = this.preEditValue(r, field); ed.startEdit(this.view.getCell(row, col).firstChild, v); }).defer(50, this); } } }, preEditValue : function(r, field){ var value = r.data[field]; return this.autoEncode && typeof value == 'string' ? Ext.util.Format.htmlDecode(value) : value; }, postEditValue : function(value, originalValue, r, field){ return this.autoEncode && typeof value == 'string' ? Ext.util.Format.htmlEncode(value) : value; }, stopEditing : function(cancel){ if(this.activeEditor){ this.activeEditor[cancel === true ? 'cancelEdit' : 'completeEdit'](); } this.activeEditor = null; }, onDestroy: function() { if(this.rendered){ var cols = this.colModel.config; for(var i = 0, len = cols.length; i < len; i++){ var c = cols[i]; Ext.destroy(c.editor); } } Ext.grid.EditorGridPanel.superclass.onDestroy.call(this); } }); Ext.reg('editorgrid', Ext.grid.EditorGridPanel); Ext.grid.GridEditor = function(field, config){ Ext.grid.GridEditor.superclass.constructor.call(this, field, config); field.monitorTab = false; }; Ext.extend(Ext.grid.GridEditor, Ext.Editor, { alignment: "tl-tl", autoSize: "width", hideEl : false, cls: "x-small-editor x-grid-editor", shim:false, shadow:false }); Ext.grid.PropertyRecord = Ext.data.Record.create([ {name:'name',type:'string'}, 'value' ]); Ext.grid.PropertyStore = function(grid, source){ this.grid = grid; this.store = new Ext.data.Store({ recordType : Ext.grid.PropertyRecord }); this.store.on('update', this.onUpdate, this); if(source){ this.setSource(source); } Ext.grid.PropertyStore.superclass.constructor.call(this); }; Ext.extend(Ext.grid.PropertyStore, Ext.util.Observable, { setSource : function(o){ this.source = o; this.store.removeAll(); var data = []; for(var k in o){ if(this.isEditableValue(o[k])){ data.push(new Ext.grid.PropertyRecord({name: k, value: o[k]}, k)); } } this.store.loadRecords({records: data}, {}, true); }, onUpdate : function(ds, record, type){ if(type == Ext.data.Record.EDIT){ var v = record.data['value']; var oldValue = record.modified['value']; if(this.grid.fireEvent('beforepropertychange', this.source, record.id, v, oldValue) !== false){ this.source[record.id] = v; record.commit(); this.grid.fireEvent('propertychange', this.source, record.id, v, oldValue); }else{ record.reject(); } } }, getProperty : function(row){ return this.store.getAt(row); }, isEditableValue: function(val){ if(Ext.isDate(val)){ return true; }else if(typeof val == 'object' || typeof val == 'function'){ return false; } return true; }, setValue : function(prop, value){ this.source[prop] = value; this.store.getById(prop).set('value', value); }, getSource : function(){ return this.source; } }); Ext.grid.PropertyColumnModel = function(grid, store){ this.grid = grid; var g = Ext.grid; 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 = store; this.bselect = Ext.DomHelper.append(document.body, { tag: 'select', cls: 'x-grid-editor x-hide-display', children: [ {tag: 'option', value: 'true', html: 'true'}, {tag: 'option', value: 'false', html: 'false'} ] }); var f = Ext.form; var bfield = new f.Field({ el:this.bselect, bselect : this.bselect, autoShow: true, getValue : function(){ return this.bselect.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(bfield) }; 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(dateVal){ return dateVal.dateFormat(this.dateFormat); }, renderBool : function(bVal){ return bVal ? 'true' : 'false'; }, isCellEditable : function(colIndex, rowIndex){ return colIndex == 1; }, getRenderer : function(col){ return col == 1 ? this.renderCellDelegate : this.renderPropDelegate; }, renderProp : function(v){ return this.getPropertyName(v); }, renderCell : function(val){ var rv = val; if(Ext.isDate(val)){ rv = this.renderDate(val); }else if(typeof val == 'boolean'){ rv = this.renderBool(val); } return Ext.util.Format.htmlEncode(rv); }, getPropertyName : function(name){ var pn = this.grid.propertyNames; return pn && pn[name] ? pn[name] : name; }, getCellEditor : function(colIndex, rowIndex){ var p = this.store.getProperty(rowIndex); var 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']; } } }); Ext.grid.PropertyGrid = Ext.extend(Ext.grid.EditorGridPanel, { enableColumnMove:false, stripeRows:false, trackMouseOver: false, clicksToEdit:1, enableHdMenu : false, viewConfig : { forceFit:true }, initComponent : function(){ this.customEditors = this.customEditors || {}; this.lastEditRow = null; var store = new Ext.grid.PropertyStore(this); this.propStore = store; var cm = new Ext.grid.PropertyColumnModel(this, store); store.store.sort('name', 'ASC'); this.addEvents( 'beforepropertychange', 'propertychange' ); this.cm = cm; this.ds = store.store; Ext.grid.PropertyGrid.superclass.initComponent.call(this); this.selModel.on('beforecellselect', function(sm, rowIndex, colIndex){ if(colIndex === 0){ this.startEditing.defer(200, this, [rowIndex, 1]); return false; } }, this); }, onRender : function(){ Ext.grid.PropertyGrid.superclass.onRender.apply(this, arguments); this.getGridEl().addClass('x-props-grid'); }, afterRender: function(){ Ext.grid.PropertyGrid.superclass.afterRender.apply(this, arguments); if(this.source){ this.setSource(this.source); } }, setSource : function(source){ this.propStore.setSource(source); }, getSource : function(){ return this.propStore.getSource(); } }); Ext.reg("propertygrid", Ext.grid.PropertyGrid);
- Ext.grid.RowNumberer = function(config){
- Ext.apply(this, config);
- if(this.rowspan){
- this.renderer = this.renderer.createDelegate(this);
- }
- };
- Ext.grid.RowNumberer.prototype = {
- header: "",
- width: 23,
- sortable: false,
- fixed:true,
- menuDisabled:true,
- dataIndex: '',
- id: 'numberer',
- rowspan: undefined,
- renderer : function(v, p, record, rowIndex){
- if(this.rowspan){
- p.cellAttr = 'rowspan="'+this.rowspan+'"';
- }
- return rowIndex+1;
- }
- };
- Ext.grid.CheckboxSelectionModel = Ext.extend(Ext.grid.RowSelectionModel, {
- header: '<div class="x-grid3-hd-checker"> </div>',
- width: 20,
- sortable: false,
- menuDisabled:true,
- fixed:true,
- dataIndex: '',
- id: 'checker',
- initEvents : function(){
- Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);
- this.grid.on('render', function(){
- var view = this.grid.getView();
- view.mainBody.on('mousedown', this.onMouseDown, this);
- Ext.fly(view.innerHd).on('mousedown', this.onHdMouseDown, this);
- }, this);
- },
- onMouseDown : function(e, t){
- if(e.button === 0 && t.className == 'x-grid3-row-checker'){ e.stopEvent();
- var row = e.getTarget('.x-grid3-row');
- if(row){
- var index = row.rowIndex;
- if(this.isSelected(index)){
- this.deselectRow(index);
- }else{
- this.selectRow(index, true);
- }
- }
- }
- },
- onHdMouseDown : function(e, t){
- if(t.className == 'x-grid3-hd-checker'){
- e.stopEvent();
- var hd = Ext.fly(t.parentNode);
- var isChecked = hd.hasClass('x-grid3-hd-checker-on');
- if(isChecked){
- hd.removeClass('x-grid3-hd-checker-on');
- this.clearSelections();
- }else{
- hd.addClass('x-grid3-hd-checker-on');
- this.selectAll();
- }
- }
- },
- renderer : function(v, p, record){
- return '<div class="x-grid3-row-checker"> </div>';
- }
- }); Ext.LoadMask = function(el, config){ this.el = Ext.get(el); Ext.apply(this, config); if(this.store){ this.store.on('beforeload', this.onBeforeLoad, this); this.store.on('load', this.onLoad, this); this.store.on('loadexception', this.onLoad, this); this.removeMask = Ext.value(this.removeMask, false); }else{ var um = this.el.getUpdater(); um.showLoadIndicator = false; um.on('beforeupdate', this.onBeforeLoad, this); um.on('update', this.onLoad, this); um.on('failure', this.onLoad, this); this.removeMask = Ext.value(this.removeMask, true); } }; Ext.LoadMask.prototype = { msg : 'Loading...', msgCls : 'x-mask-loading', disabled: false, disable : function(){ this.disabled = true; }, enable : function(){ this.disabled = false; }, onLoad : function(){ this.el.unmask(this.removeMask); }, onBeforeLoad : function(){ if(!this.disabled){ this.el.mask(this.msg, this.msgCls); } }, show: function(){ this.onBeforeLoad(); }, hide: function(){ this.onLoad(); }, destroy : function(){ if(this.store){ this.store.un('beforeload', this.onBeforeLoad, this); this.store.un('load', this.onLoad, this); this.store.un('loadexception', this.onLoad, this); }else{ var um = this.el.getUpdater(); um.un('beforeupdate', this.onBeforeLoad, this); um.un('update', this.onLoad, this); um.un('failure', this.onLoad, this); } } };
- Ext.ProgressBar = Ext.extend(Ext.BoxComponent, {
- baseCls : 'x-progress',
- waitTimer : null,
- initComponent : function(){
- Ext.ProgressBar.superclass.initComponent.call(this);
- this.addEvents(
- "update"
- );
- },
- onRender : function(ct, position){
- Ext.ProgressBar.superclass.onRender.call(this, ct, position);
- var tpl = new Ext.Template(
- '<div class="{cls}-wrap">',
- '<div class="{cls}-inner">',
- '<div class="{cls}-bar">',
- '<div class="{cls}-text">',
- '<div> </div>',
- '</div>',
- '</div>',
- '<div class="{cls}-text {cls}-text-back">',
- '<div> </div>',
- '</div>',
- '</div>',
- '</div>'
- );
- if(position){
- this.el = tpl.insertBefore(position, {cls: this.baseCls}, true);
- }else{
- this.el = tpl.append(ct, {cls: this.baseCls}, true);
- }
- if(this.id){
- this.el.dom.id = this.id;
- }
- var inner = this.el.dom.firstChild;
- this.progressBar = Ext.get(inner.firstChild);
- if(this.textEl){
- this.textEl = Ext.get(this.textEl);
- delete this.textTopEl;
- }else{
- this.textTopEl = Ext.get(this.progressBar.dom.firstChild);
- var textBackEl = Ext.get(inner.childNodes[1]);
- this.textTopEl.setStyle("z-index", 99).addClass('x-hidden');
- this.textEl = new Ext.CompositeElement([this.textTopEl.dom.firstChild, textBackEl.dom.firstChild]);
- this.textEl.setWidth(inner.offsetWidth);
- }
- this.progressBar.setHeight(inner.offsetHeight);
- },
- afterRender : function(){
- Ext.ProgressBar.superclass.afterRender.call(this);
- if(this.value){
- this.updateProgress(this.value, this.text);
- }else{
- this.updateText(this.text);
- }
- },
- updateProgress : function(value, text){
- this.value = value || 0;
- if(text){
- this.updateText(text);
- }
- if(this.rendered){
- var w = Math.floor(value*this.el.dom.firstChild.offsetWidth);
- this.progressBar.setWidth(w);
- if(this.textTopEl){
- this.textTopEl.removeClass('x-hidden').setWidth(w);
- }
- }
- this.fireEvent('update', this, value, text);
- return this;
- },
- wait : function(o){
- if(!this.waitTimer){
- var scope = this;
- o = o || {};
- this.updateText(o.text);
- this.waitTimer = Ext.TaskMgr.start({
- run: function(i){
- var inc = o.increment || 10;
- this.updateProgress(((((i+inc)%inc)+1)*(100/inc))*.01);
- },
- interval: o.interval || 1000,
- duration: o.duration,
- onStop: function(){
- if(o.fn){
- o.fn.apply(o.scope || this);
- }
- this.reset();
- },
- scope: scope
- });
- }
- return this;
- },
- isWaiting : function(){
- return this.waitTimer != null;
- },
- updateText : function(text){
- this.text = text || ' ';
- if(this.rendered){
- this.textEl.update(this.text);
- }
- return this;
- },
- syncProgressBar : function(){
- if(this.value){
- this.updateProgress(this.value, this.text);
- }
- return this;
- },
- setSize : function(w, h){
- Ext.ProgressBar.superclass.setSize.call(this, w, h);
- if(this.textTopEl){
- var inner = this.el.dom.firstChild;
- this.textEl.setSize(inner.offsetWidth, inner.offsetHeight);
- }
- this.syncProgressBar();
- return this;
- },
- reset : function(hide){
- this.updateProgress(0);
- if(this.textTopEl){
- this.textTopEl.addClass('x-hidden');
- }
- if(this.waitTimer){
- this.waitTimer.onStop = null; Ext.TaskMgr.stop(this.waitTimer);
- this.waitTimer = null;
- }
- if(hide === true){
- this.hide();
- }
- return this;
- }
- });
- Ext.reg('progress', Ext.ProgressBar);
- Ext.Slider = Ext.extend(Ext.BoxComponent, {
- vertical: false,
- minValue: 0,
- maxValue: 100,
- keyIncrement: 1,
- increment: 0,
- clickRange: [5,15],
- clickToChange : true,
- animate: true,
- dragging: false,
- initComponent : function(){
- if(this.value === undefined){
- this.value = this.minValue;
- }
- Ext.Slider.superclass.initComponent.call(this);
- this.keyIncrement = Math.max(this.increment, this.keyIncrement);
- this.addEvents(
- 'beforechange',
- 'change',
- 'changecomplete',
- 'dragstart',
- 'drag',
- 'dragend'
- );
- if(this.vertical){
- Ext.apply(this, Ext.Slider.Vertical);
- }
- },
- onRender : function(){
- this.autoEl = {
- cls: 'x-slider ' + (this.vertical ? 'x-slider-vert' : 'x-slider-horz'),
- cn:{cls:'x-slider-end',cn:{cls:'x-slider-inner',cn:[{cls:'x-slider-thumb'},{tag:'a', cls:'x-slider-focus', href:"#", tabIndex: '-1', hidefocus:'on'}]}}
- };
- Ext.Slider.superclass.onRender.apply(this, arguments);
- this.endEl = this.el.first();
- this.innerEl = this.endEl.first();
- this.thumb = this.innerEl.first();
- this.halfThumb = (this.vertical ? this.thumb.getHeight() : this.thumb.getWidth())/2;
- this.focusEl = this.thumb.next();
- this.initEvents();
- },
- initEvents : function(){
- this.thumb.addClassOnOver('x-slider-thumb-over');
- this.mon(this.el, 'mousedown', this.onMouseDown, this);
- this.mon(this.el, 'keydown', this.onKeyDown, this);
- this.focusEl.swallowEvent("click", true);
- this.tracker = new Ext.dd.DragTracker({
- onBeforeStart: this.onBeforeDragStart.createDelegate(this),
- onStart: this.onDragStart.createDelegate(this),
- onDrag: this.onDrag.createDelegate(this),
- onEnd: this.onDragEnd.createDelegate(this),
- tolerance: 3,
- autoStart: 300
- });
- this.tracker.initEl(this.thumb);
- this.on('beforedestroy', this.tracker.destroy, this.tracker);
- },
- onMouseDown : function(e){
- if(this.disabled) {return;}
- if(this.clickToChange && e.target != this.thumb.dom){
- var local = this.innerEl.translatePoints(e.getXY());
- this.onClickChange(local);
- }
- this.focus();
- },
- onClickChange : function(local){
- if(local.top > this.clickRange[0] && local.top < this.clickRange[1]){
- this.setValue(Math.round(this.reverseValue(local.left)), undefined, true);
- }
- },
- onKeyDown : function(e){
- if(this.disabled){e.preventDefault();return;}
- var k = e.getKey();
- switch(k){
- case e.UP:
- case e.RIGHT:
- e.stopEvent();
- if(e.ctrlKey){
- this.setValue(this.maxValue, undefined, true);
- }else{
- this.setValue(this.value+this.keyIncrement, undefined, true);
- }
- break;
- case e.DOWN:
- case e.LEFT:
- e.stopEvent();
- if(e.ctrlKey){
- this.setValue(this.minValue, undefined, true);
- }else{
- this.setValue(this.value-this.keyIncrement, undefined, true);
- }
- break;
- default:
- e.preventDefault();
- }
- },
- doSnap : function(value){
- if(!this.increment || this.increment == 1 || !value) {
- return value;
- }
- var newValue = value, inc = this.increment;
- var m = value % inc;
- if(m > 0){
- if(m > (inc/2)){
- newValue = value + (inc-m);
- }else{
- newValue = value - m;
- }
- }
- return newValue.constrain(this.minValue, this.maxValue);
- },
- afterRender : function(){
- Ext.Slider.superclass.afterRender.apply(this, arguments);
- if(this.value !== undefined){
- var v = this.normalizeValue(this.value);
- if(v !== this.value){
- delete this.value;
- this.setValue(v, false);
- }else{
- this.moveThumb(this.translateValue(v), false);
- }
- }
- },
- getRatio : function(){
- var w = this.innerEl.getWidth();
- var v = this.maxValue - this.minValue;
- return v == 0 ? w : (w/v);
- },
- normalizeValue : function(v){
- if(typeof v != 'number'){
- v = parseInt(v);
- }
- v = Math.round(v);
- v = this.doSnap(v);
- v = v.constrain(this.minValue, this.maxValue);
- return v;
- },
- setValue : function(v, animate, changeComplete){
- v = this.normalizeValue(v);
- if(v !== this.value && this.fireEvent('beforechange', this, v, this.value) !== false){
- this.value = v;
- this.moveThumb(this.translateValue(v), animate !== false);
- this.fireEvent('change', this, v);
- if(changeComplete){
- this.fireEvent('changecomplete', this, v);
- }
- }
- },
- translateValue : function(v){
- var ratio = this.getRatio();
- return (v * ratio)-(this.minValue * ratio)-this.halfThumb;
- },
- reverseValue : function(pos){
- var ratio = this.getRatio();
- return (pos+this.halfThumb+(this.minValue * ratio))/ratio;
- },
- moveThumb: function(v, animate){
- if(!animate || this.animate === false){
- this.thumb.setLeft(v);
- }else{
- this.thumb.shift({left: v, stopFx: true, duration:.35});
- }
- },
- focus : function(){
- this.focusEl.focus(10);
- },
- onBeforeDragStart : function(e){
- return !this.disabled;
- },
- onDragStart: function(e){
- this.thumb.addClass('x-slider-thumb-drag');
- this.dragging = true;
- this.dragStartValue = this.value;
- this.fireEvent('dragstart', this, e);
- },
- onDrag: function(e){
- var pos = this.innerEl.translatePoints(this.tracker.getXY());
- this.setValue(Math.round(this.reverseValue(pos.left)), false);
- this.fireEvent('drag', this, e);
- },
- onDragEnd: function(e){
- this.thumb.removeClass('x-slider-thumb-drag');
- this.dragging = false;
- this.fireEvent('dragend', this, e);
- if(this.dragStartValue != this.value){
- this.fireEvent('changecomplete', this, this.value);
- }
- },
- onResize : function(w, h){
- this.innerEl.setWidth(w - (this.el.getPadding('l') + this.endEl.getPadding('r')));
- this.syncThumb();
- },
- syncThumb : function(){
- if(this.rendered){
- this.moveThumb(this.translateValue(this.value));
- }
- },
- getValue : function(){
- return this.value;
- }
- });
- Ext.reg('slider', Ext.Slider);
- Ext.Slider.Vertical = {
- onResize : function(w, h){
- this.innerEl.setHeight(h - (this.el.getPadding('t') + this.endEl.getPadding('b')));
- this.syncThumb();
- },
- getRatio : function(){
- var h = this.innerEl.getHeight();
- var v = this.maxValue - this.minValue;
- return h/v;
- },
- moveThumb: function(v, animate){
- if(!animate || this.animate === false){
- this.thumb.setBottom(v);
- }else{
- this.thumb.shift({bottom: v, stopFx: true, duration:.35});
- }
- },
- onDrag: function(e){
- var pos = this.innerEl.translatePoints(this.tracker.getXY());
- var bottom = this.innerEl.getHeight()-pos.top;
- this.setValue(Math.round(bottom/this.getRatio()), false);
- this.fireEvent('drag', this, e);
- },
- onClickChange : function(local){
- if(local.left > this.clickRange[0] && local.left < this.clickRange[1]){
- var bottom = this.innerEl.getHeight()-local.top;
- this.setValue(Math.round(bottom/this.getRatio()), undefined, true);
- }
- }
- }; Ext.StatusBar = Ext.extend(Ext.Toolbar, { cls : 'x-statusbar', busyIconCls : 'x-status-busy', busyText : 'Loading...', autoClear : 5000, activeThreadId : 0, initComponent : function(){ if(this.statusAlign=='right'){ this.cls += ' x-status-right'; } Ext.StatusBar.superclass.initComponent.call(this); }, afterRender : function(){ Ext.StatusBar.superclass.afterRender.call(this); var right = this.statusAlign=='right', td = Ext.get(this.nextBlock()); if(right){ this.tr.appendChild(td.dom); }else{ td.insertBefore(this.tr.firstChild); } this.statusEl = td.createChild({ cls: 'x-status-text ' + (this.iconCls || this.defaultIconCls || ''), html: this.text || this.defaultText || '' }); this.statusEl.unselectable(); this.spacerEl = td.insertSibling({ tag: 'td', style: 'width:100%', cn: [{cls:'ytb-spacer'}] }, right ? 'before' : 'after'); }, setStatus : function(o){ o = o || {}; if(typeof o == 'string'){ o = {text:o}; } if(o.text !== undefined){ this.setText(o.text); } if(o.iconCls !== undefined){ this.setIcon(o.iconCls); } if(o.clear){ var c = o.clear, wait = this.autoClear, defaults = {useDefaults: true, anim: true}; if(typeof c == 'object'){ c = Ext.applyIf(c, defaults); if(c.wait){ wait = c.wait; } }else if(typeof c == 'number'){ wait = c; c = defaults; }else if(typeof c == 'boolean'){ c = defaults; } c.threadId = this.activeThreadId; this.clearStatus.defer(wait, this, [c]); } return this; }, clearStatus : function(o){ o = o || {}; if(o.threadId && o.threadId !== this.activeThreadId){ return this; } var text = o.useDefaults ? this.defaultText : '', iconCls = o.useDefaults ? (this.defaultIconCls ? this.defaultIconCls : '') : ''; if(o.anim){ this.statusEl.fadeOut({ remove: false, useDisplay: true, scope: this, callback: function(){ this.setStatus({ text: text, iconCls: iconCls }); this.statusEl.show(); } }); }else{ this.statusEl.hide(); this.setStatus({ text: text, iconCls: iconCls }); this.statusEl.show(); } return this; }, setText : function(text){ this.activeThreadId++; this.text = text || ''; if(this.rendered){ this.statusEl.update(this.text); } return this; }, getText : function(){ return this.text; }, setIcon : function(cls){ this.activeThreadId++; cls = cls || ''; if(this.rendered){ if(this.currIconCls){ this.statusEl.removeClass(this.currIconCls); this.currIconCls = null; } if(cls.length > 0){ this.statusEl.addClass(cls); this.currIconCls = cls; } }else{ this.currIconCls = cls; } return this; }, showBusy : function(o){ if(typeof o == 'string'){ o = {text:o}; } o = Ext.applyIf(o || {}, { text: this.busyText, iconCls: this.busyIconCls }); return this.setStatus(o); } }); Ext.reg('statusbar', Ext.StatusBar);
- Ext.History = (function () {
- var iframe, hiddenField;
- var ready = false;
- var currentToken;
- function getHash() {
- var href = top.location.href, i = href.indexOf("#");
- return i >= 0 ? href.substr(i + 1) : null;
- }
- function doSave() {
- hiddenField.value = currentToken;
- }
- function handleStateChange(token) {
- currentToken = token;
- Ext.History.fireEvent('change', token);
- }
- function updateIFrame (token) {
- var html = ['<html><body><div id="state">',token,'</div></body></html>'].join('');
- try {
- var doc = iframe.contentWindow.document;
- doc.open();
- doc.write(html);
- doc.close();
- return true;
- } catch (e) {
- return false;
- }
- }
- function checkIFrame() {
- if (!iframe.contentWindow || !iframe.contentWindow.document) {
- setTimeout(checkIFrame, 10);
- return;
- }
- var doc = iframe.contentWindow.document;
- var elem = doc.getElementById("state");
- var token = elem ? elem.innerText : null;
- var hash = getHash();
- setInterval(function () {
- doc = iframe.contentWindow.document;
- elem = doc.getElementById("state");
- var newtoken = elem ? elem.innerText : null;
- var newHash = getHash();
- if (newtoken !== token) {
- token = newtoken;
- handleStateChange(token);
- top.location.hash = token;
- hash = token;
- doSave();
- } else if (newHash !== hash) {
- hash = newHash;
- updateIFrame(newHash);
- }
- }, 50);
- ready = true;
- Ext.History.fireEvent('ready', Ext.History);
- }
- function startUp() {
- currentToken = hiddenField.value;
- if (Ext.isIE) {
- checkIFrame();
- } else {
- var hash = getHash();
- setInterval(function () {
- var newHash = getHash();
- if (newHash !== hash) {
- hash = newHash;
- handleStateChange(hash);
- doSave();
- }
- }, 50);
- ready = true;
- Ext.History.fireEvent('ready', Ext.History);
- }
- }
- return {
- fieldId: 'x-history-field',
- iframeId: 'x-history-frame',
- events:{},
- init: function (onReady, scope) {
- if(ready) {
- Ext.callback(onReady, scope, [this]);
- return;
- }
- if(!Ext.isReady){
- Ext.onReady(function(){
- Ext.History.init(onReady, scope);
- });
- return;
- }
- hiddenField = Ext.getDom(Ext.History.fieldId);
- if (Ext.isIE) {
- iframe = Ext.getDom(Ext.History.iframeId);
- }
- this.addEvents('ready', 'change');
- if(onReady){
- this.on('ready', onReady, scope, {single:true});
- }
- startUp();
- },
- add: function (token, preventDup) {
- if(preventDup !== false){
- if(this.getToken() == token){
- return true;
- }
- }
- if (Ext.isIE) {
- return updateIFrame(token);
- } else {
- top.location.hash = token;
- return true;
- }
- },
- back: function(){
- history.go(-1);
- },
- forward: function(){
- history.go(1);
- },
- getToken: function() {
- return ready ? currentToken : getHash();
- }
- };
- })();
- Ext.apply(Ext.History, new Ext.util.Observable()); Ext.debug = {}; (function(){ var cp; function createConsole(){ var scriptPanel = new Ext.debug.ScriptsPanel(); var logView = new Ext.debug.LogPanel(); var tree = new Ext.debug.DomTree(); var tabs = new Ext.TabPanel({ activeTab: 0, border: false, tabPosition: 'bottom', items: [{ title: 'Debug Console', layout:'border', items: [logView, scriptPanel] },{ title: 'DOM Inspector', layout:'border', items: [tree] }] }); cp = new Ext.Panel({ id: 'x-debug-browser', title: 'Console', collapsible: true, animCollapse: false, style: 'position:absolute;left:0;bottom:0;', height:200, logView: logView, layout: 'fit', tools:[{ id: 'close', handler: function(){ cp.destroy(); cp = null; Ext.EventManager.removeResizeListener(handleResize); } }], items: tabs }); cp.render(document.body); cp.resizer = new Ext.Resizable(cp.el, { minHeight:50, handles: "n", pinned: true, transparent:true, resizeElement : function(){ var box = this.proxy.getBox(); this.proxy.hide(); cp.setHeight(box.height); return box; } }); function handleResize(){ cp.setWidth(Ext.getBody().getViewSize().width); } Ext.EventManager.onWindowResize(handleResize); handleResize(); } Ext.apply(Ext, { log : function(){ if(!cp){ createConsole(); } cp.logView.log.apply(cp.logView, arguments); }, logf : function(format, arg1, arg2, etc){ Ext.log(String.format.apply(String, arguments)); }, dump : function(o){ if(typeof o == 'string' || typeof o == 'number' || typeof o == 'undefined' || Ext.isDate(o)){ Ext.log(o); }else if(!o){ Ext.log("null"); }else if(typeof o != "object"){ Ext.log('Unknown return type'); }else if(Ext.isArray(o)){ Ext.log('['+o.join(',')+']'); }else{ var b = ["{n"]; for(var key in o){ var to = typeof o[key]; if(to != "function" && to != "object"){ b.push(String.format(" {0}: {1},n", key, o[key])); } } var s = b.join(""); if(s.length > 3){ s = s.substr(0, s.length-2); } Ext.log(s + "n}"); } }, _timers : {}, time : function(name){ name = name || "def"; Ext._timers[name] = new Date().getTime(); }, timeEnd : function(name, printResults){ var t = new Date().getTime(); name = name || "def"; var v = String.format("{0} ms", t-Ext._timers[name]); Ext._timers[name] = new Date().getTime(); if(printResults !== false){ Ext.log('Timer ' + (name == "def" ? v : name + ": " + v)); } return v; } }); })(); Ext.debug.ScriptsPanel = Ext.extend(Ext.Panel, { id:'x-debug-scripts', region: 'east', minWidth: 200, split: true, width: 350, border: false, layout:'anchor', style:'border-width:0 0 0 1px;', initComponent : function(){ this.scriptField = new Ext.form.TextArea({ anchor: '100% -26', style:'border-width:0;' }); this.trapBox = new Ext.form.Checkbox({ id: 'console-trap', boxLabel: 'Trap Errors', checked: true }); this.toolbar = new Ext.Toolbar([{ text: 'Run', scope: this, handler: this.evalScript },{ text: 'Clear', scope: this, handler: this.clear }, '->', this.trapBox, ' ', ' ' ]); this.items = [this.toolbar, this.scriptField]; Ext.debug.ScriptsPanel.superclass.initComponent.call(this); }, evalScript : function(){ var s = this.scriptField.getValue(); if(this.trapBox.getValue()){ try{ var rt = eval(s); Ext.dump(rt === undefined? '(no return)' : rt); }catch(e){ Ext.log(e.message || e.descript); } }else{ var rt = eval(s); Ext.dump(rt === undefined? '(no return)' : rt); } }, clear : function(){ this.scriptField.setValue(''); this.scriptField.focus(); } }); Ext.debug.LogPanel = Ext.extend(Ext.Panel, { autoScroll: true, region: 'center', border: false, style:'border-width:0 1px 0 0', log : function(){ var markup = [ '<div style="padding:5px !important;border-bottom:1px solid #ccc;">', Ext.util.Format.htmlEncode(Array.prototype.join.call(arguments, ', ')).replace(/n/g, '<br />').replace(/s/g, ' '), '</div>'].join(''); this.body.insertHtml('beforeend', markup); this.body.scrollTo('top', 100000); }, clear : function(){ this.body.update(''); this.body.dom.scrollTop = 0; } }); Ext.debug.DomTree = Ext.extend(Ext.tree.TreePanel, { enableDD:false , lines:false, rootVisible:false, animate:false, hlColor:'ffff9c', autoScroll: true, region:'center', border:false, initComponent : function(){ Ext.debug.DomTree.superclass.initComponent.call(this); var styles = false, hnode; var nonSpace = /^s*$/; var html = Ext.util.Format.htmlEncode; var ellipsis = Ext.util.Format.ellipsis; var styleRe = /s?([a-z-]*):([^;]*)(?:[;snr]*)/gi; function findNode(n){ if(!n || n.nodeType != 1 || n == document.body || n == document){ return false; } var pn = [n], p = n; while((p = p.parentNode) && p.nodeType == 1 && p.tagName.toUpperCase() != 'HTML'){ pn.unshift(p); } var cn = hnode; for(var i = 0, len = pn.length; i < len; i++){ cn.expand(); cn = cn.findChild('htmlNode', pn[i]); if(!cn){ return false; } } cn.select(); var a = cn.ui.anchor; treeEl.dom.scrollTop = Math.max(0 ,a.offsetTop-10); cn.highlight(); return true; } function nodeTitle(n){ var s = n.tagName; if(n.id){ s += '#'+n.id; }else if(n.className){ s += '.'+n.className; } return s; } function onNodeSelect(t, n, last){ return; if(last && last.unframe){ last.unframe(); } var props = {}; if(n && n.htmlNode){ if(frameEl.pressed){ n.frame(); } if(inspecting){ return; } addStyle.enable(); reload.setDisabled(n.leaf); var dom = n.htmlNode; stylePanel.setTitle(nodeTitle(dom)); if(styles && !showAll.pressed){ var s = dom.style ? dom.style.cssText : ''; if(s){ var m; while ((m = styleRe.exec(s)) != null){ props[m[1].toLowerCase()] = m[2]; } } }else if(styles){ var cl = Ext.debug.cssList; var s = dom.style, fly = Ext.fly(dom); if(s){ for(var i = 0, len = cl.length; i<len; i++){ var st = cl[i]; var v = s[st] || fly.getStyle(st); if(v != undefined && v !== null && v !== ''){ props[st] = v; } } } }else{ for(var a in dom){ var v = dom[a]; if((isNaN(a+10)) && v != undefined && v !== null && v !== '' && !(Ext.isGecko && a[0] == a[0].toUpperCase())){ props[a] = v; } } } }else{ if(inspecting){ return; } addStyle.disable(); reload.disabled(); } stylesGrid.setSource(props); stylesGrid.treeNode = n; stylesGrid.view.fitColumns(); } this.loader = new Ext.tree.TreeLoader(); this.loader.load = function(n, cb){ var isBody = n.htmlNode == document.body; var cn = n.htmlNode.childNodes; for(var i = 0, c; c = cn[i]; i++){ if(isBody && c.id == 'x-debug-browser'){ continue; } if(c.nodeType == 1){ n.appendChild(new Ext.debug.HtmlNode(c)); }else if(c.nodeType == 3 && !nonSpace.test(c.nodeValue)){ n.appendChild(new Ext.tree.TreeNode({ text:'<em>' + ellipsis(html(String(c.nodeValue)), 35) + '</em>', cls: 'x-tree-noicon' })); } } cb(); }; this.root = this.setRootNode(new Ext.tree.TreeNode('Ext')); hnode = this.root.appendChild(new Ext.debug.HtmlNode( document.getElementsByTagName('html')[0] )); } }); Ext.debug.HtmlNode = function(){ var html = Ext.util.Format.htmlEncode; var ellipsis = Ext.util.Format.ellipsis; var nonSpace = /^s*$/; var attrs = [ {n: 'id', v: 'id'}, {n: 'className', v: 'class'}, {n: 'name', v: 'name'}, {n: 'type', v: 'type'}, {n: 'src', v: 'src'}, {n: 'href', v: 'href'} ]; function hasChild(n){ for(var i = 0, c; c = n.childNodes[i]; i++){ if(c.nodeType == 1){ return true; } } return false; } function renderNode(n, leaf){ var tag = n.tagName.toLowerCase(); var s = '<' + tag; for(var i = 0, len = attrs.length; i < len; i++){ var a = attrs[i]; var v = n[a.n]; if(v && !nonSpace.test(v)){ s += ' ' + a.v + '="<i>' + html(v) +'</i>"'; } } var style = n.style ? n.style.cssText : ''; if(style){ s += ' style="<i>' + html(style.toLowerCase()) +'</i>"'; } if(leaf && n.childNodes.length > 0){ s+='><em>' + ellipsis(html(String(n.innerHTML)), 35) + '</em></'+tag+'>'; }else if(leaf){ s += ' />'; }else{ s += '>'; } return s; } var HtmlNode = function(n){ var leaf = !hasChild(n); this.htmlNode = n; this.tagName = n.tagName.toLowerCase(); var attr = { text : renderNode(n, leaf), leaf : leaf, cls: 'x-tree-noicon' }; HtmlNode.superclass.constructor.call(this, attr); this.attributes.htmlNode = n; if(!leaf){ this.on('expand', this.onExpand, this); this.on('collapse', this.onCollapse, this); } }; Ext.extend(HtmlNode, Ext.tree.AsyncTreeNode, { cls: 'x-tree-noicon', preventHScroll: true, refresh : function(highlight){ var leaf = !hasChild(this.htmlNode); this.setText(renderNode(this.htmlNode, leaf)); if(highlight){ Ext.fly(this.ui.textNode).highlight(); } }, onExpand : function(){ if(!this.closeNode && this.parentNode){ this.closeNode = this.parentNode.insertBefore(new Ext.tree.TreeNode({ text:'</' + this.tagName + '>', cls: 'x-tree-noicon' }), this.nextSibling); }else if(this.closeNode){ this.closeNode.ui.show(); } }, onCollapse : function(){ if(this.closeNode){ this.closeNode.ui.hide(); } }, render : function(bulkRender){ HtmlNode.superclass.render.call(this, bulkRender); }, highlightNode : function(){ }, highlight : function(){ }, frame : function(){ this.htmlNode.style.border = '1px solid #0000ff'; }, unframe : function(){ this.htmlNode.style.border = ''; } }); return HtmlNode; }();