From db7e71656e7505cebb07646176f843b013c76288 Mon Sep 17 00:00:00 2001 From: Alan Knowles Date: Fri, 18 Mar 2011 03:53:54 +0000 Subject: [PATCH] Fix focus of grid body, by moving focus element to start of HTML --- Roo/ContentPanel.js | 1 + Roo/grid/GridView.js | 60 +++++++++---- roojs-all.js | 10 +-- roojs-debug.js | 203 ++++++++++++++++++++++++------------------- roojs-ui-debug.js | 203 ++++++++++++++++++++++++------------------- roojs-ui.js | 10 +-- 6 files changed, 286 insertions(+), 201 deletions(-) diff --git a/Roo/ContentPanel.js b/Roo/ContentPanel.js index 3e6e795776..393b03b160 100644 --- a/Roo/ContentPanel.js +++ b/Roo/ContentPanel.js @@ -112,6 +112,7 @@ Roo.ContentPanel = function(el, config, content){ } else { // fix randome scrolling this.el.on('scroll', function() { + Roo.log('fix random scolling'); this.scrollTo('top',0); }); } diff --git a/Roo/grid/GridView.js b/Roo/grid/GridView.js index ee22306ded..42617f458b 100644 --- a/Roo/grid/GridView.js +++ b/Roo/grid/GridView.js @@ -119,6 +119,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { if(!tpls.master){ tpls.master = new Roo.Template( '
', + '', '
', '
', '
', @@ -130,7 +131,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { '
{body}
', "
", '
', - '', + '
 
', "
" ); @@ -308,25 +309,27 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var cs = el.childNodes; this.el = new E(el); - this.headerPanel = new E(el.firstChild); + + this.focusEl = new E(el.firstChild); + this.focusEl.swallowEvent("click", true); + + this.headerPanel = new E(cs[1]); this.headerPanel.enableDisplayMode("block"); - this.scroller = new E(cs[1]); + this.scroller = new E(cs[2]); this.scrollSizer = new E(this.scroller.dom.firstChild); - this.lockedWrap = new E(cs[2]); + this.lockedWrap = new E(cs[3]); this.lockedHd = new E(this.lockedWrap.dom.firstChild); this.lockedBody = new E(this.lockedWrap.dom.childNodes[1]); - this.mainWrap = new E(cs[3]); + this.mainWrap = new E(cs[4]); this.mainHd = new E(this.mainWrap.dom.firstChild); this.mainBody = new E(this.mainWrap.dom.childNodes[1]); - this.footerPanel = new E(cs[4]); + this.footerPanel = new E(cs[5]); this.footerPanel.enableDisplayMode("block"); - this.focusEl = new E(cs[5]); - this.focusEl.swallowEvent("click", true); this.resizeProxy = new E(cs[6]); this.headerSelector = String.format( @@ -512,7 +515,9 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * Focuses the specified row. * @param {Number} row The row index */ - focusRow : function(row){ + focusRow : function(row) + { + //Roo.log('GridView.focusRow'); var x = this.scroller.dom.scrollLeft; this.focusCell(row, 0, false); this.scroller.dom.scrollLeft = x; @@ -524,7 +529,9 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * @param {Number} col The column index * @param {Boolean} hscroll false to disable horizontal scrolling */ - focusCell : function(row, col, hscroll){ + focusCell : function(row, col, hscroll) + { + //Roo.log('GridView.focusCell'); var el = this.ensureVisible(row, col, hscroll); this.focusEl.alignTo(el, "tl-tl"); if(Roo.isGecko){ @@ -540,12 +547,15 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * @param {Number} col The column index * @param {Boolean} hscroll false to disable horizontal scrolling */ - ensureVisible : function(row, col, hscroll){ + ensureVisible : function(row, col, hscroll) + { + //Roo.log('GridView.ensureVisible,' + row + ',' + col); + //return null; //disable for testing. if(typeof row != "number"){ row = row.rowIndex; } if(row < 0 && row >= this.ds.getCount()){ - return; + return null; } col = (col !== undefined ? col : 0); var cm = this.grid.colModel; @@ -555,7 +565,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var el = this.getCell(row, col); if(!el){ - return; + return null; } var c = this.scroller.dom; @@ -563,19 +573,31 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var cleft = parseInt(el.offsetLeft, 10); var cbot = ctop + el.offsetHeight; var cright = cleft + el.offsetWidth; - + var ch = c.clientHeight - this.mainHd.dom.offsetHeight; var stop = parseInt(c.scrollTop, 10); var sleft = parseInt(c.scrollLeft, 10); var sbot = stop + ch; var sright = sleft + c.clientWidth; - + /* + Roo.log('GridView.ensureVisible:' + + ' ctop:' + ctop + + ' c.clientHeight:' + c.clientHeight + + ' this.mainHd.dom.offsetHeight:' + this.mainHd.dom.offsetHeight + + ' stop:' + stop + + ' cbot:' + cbot + + ' sbot:' + sbot + + ' ch:' + ch + ); + */ if(ctop < stop){ - c.scrollTop = ctop; + c.scrollTop = ctop; + //Roo.log("set scrolltop to ctop DISABLE?"); }else if(cbot > sbot){ + //Roo.log("set scrolltop to cbot-ch"); c.scrollTop = cbot-ch; } - + if(hscroll !== false){ if(cleft < sleft){ c.scrollLeft = cleft; @@ -583,6 +605,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { c.scrollLeft = cright-c.clientWidth; } } + return el; }, @@ -744,6 +767,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, getScrollState : function(){ + var sb = this.scroller.dom; return {left: sb.scrollLeft, top: sb.scrollTop}; }, @@ -775,6 +799,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, restoreScroll : function(state){ + //Roo.log('GridView.restoreScroll'); var sb = this.scroller.dom; sb.scrollLeft = state.left; sb.scrollTop = state.top; @@ -782,6 +807,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, syncScroll : function(){ + //Roo.log('GridView.syncScroll'); var sb = this.scroller.dom; var sh = this.mainHd.dom; var bs = this.mainBody.dom; diff --git a/roojs-all.js b/roojs-all.js index 4a6f1a8c16..1295225b47 100644 --- a/roojs-all.js +++ b/roojs-all.js @@ -842,7 +842,7 @@ Roo.ContentPanel=function(el,A,B){if(el.autoCreate){A=el;el=Roo.id();} this.el=Roo.get(el);if(!this.el&&A&&A.autoCreate){if(typeof A.autoCreate=="object"){if(!A.autoCreate.id){A.autoCreate.id=A.id||el;} this.el=Roo.DomHelper.append(document.body,A.autoCreate,true);}else {this.el=Roo.DomHelper.append(document.body,{tag:"div",cls:"x-layout-inactive-content",id:A.id||el},true);}} this.closable=false;this.loaded=false;this.active=false;if(typeof A=="string"){this.title=A;}else {Roo.apply(this,A);}if(this.toolbar&&!this.toolbar.el&&this.toolbar.xtype){this.wrapEl=this.el.wrap();this.toolbar=new Roo.Toolbar(this.el.insertSibling(false,'before'),[],this.toolbar);}if(this.resizeEl){this.resizeEl=Roo.get(this.resizeEl,true);}else {this.resizeEl=this.el;} -this.addEvents({"activate":true,"deactivate":true,"resize":true});if(this.autoScroll){this.resizeEl.setStyle("overflow","auto");}else {this.el.on('scroll',function(){this.scrollTo('top',0);});} +this.addEvents({"activate":true,"deactivate":true,"resize":true});if(this.autoScroll){this.resizeEl.setStyle("overflow","auto");}else {this.el.on('scroll',function(){Roo.log('fix random scolling');this.scrollTo('top',0);});} B=B||this.content;if(B){this.setContent(B);}if(A&&A.url){this.setUrl(this.url,this.params,this.loadOnce);} Roo.ContentPanel.superclass.constructor.call(this);};Roo.extend(Roo.ContentPanel,Roo.util.Observable,{tabTip:'',setRegion:function(A){this.region=A;if(A){this.el.replaceClass("x-layout-inactive-content","x-layout-active-content");}else {this.el.replaceClass("x-layout-active-content","x-layout-inactive-content");}},getToolbar:function(){return this.toolbar;},setActiveState:function(A){this.active=A;if(!A){this.fireEvent("deactivate",this);}else {this.fireEvent("activate",this);}},setContent:function(A,B){this.el.update(A,B);},ignoreResize:function(w,h){if(this.lastSize&&this.lastSize.width==w&&this.lastSize.height==h){return true;}else {this.lastSize={width:w,height:h};return false;}},getUpdateManager:function(){return this.el.getUpdateManager();},load:function(){var um=this.el.getUpdateManager();um.update.apply(um,arguments);return this;},setUrl:function(A,B,C){if(this.refreshDelegate){this.removeListener("activate",this.refreshDelegate);} this.refreshDelegate=this._handleRefresh.createDelegate(this,[A,B,C]);this.on("activate",this.refreshDelegate);return this.el.getUpdateManager();},_handleRefresh:function(A,B,C){if(!C||!this.loaded){var D=this.el.getUpdateManager();D.update(A,B,this._setLoaded.createDelegate(this));}},_setLoaded:function(){this.loaded=true;},getId:function(){return this.el.id;},getEl:function(){return this.wrapEl||this.el;},adjustForComponents:function(A,B){if(this.resizeEl!=this.el){A-=this.el.getFrameWidth('lr');B-=this.el.getFrameWidth('tb');}if(this.toolbar){var te=this.toolbar.getEl();B-=te.getHeight();te.setWidth(A);}if(this.adjustments){A+=this.adjustments[0];B+=this.adjustments[1];}return {"width":A,"height":B};},setSize:function(A,B){if(this.fitToFrame&&!this.ignoreResize(A,B)){if(this.fitContainer&&this.resizeEl!=this.el){this.el.setSize(A,B);}var C=this.adjustForComponents(A,B);this.resizeEl.setSize(this.autoWidth?"auto":C.width,this.autoHeight?"auto":C.height);this.fireEvent('resize',this,C.width,C.height);}},getTitle:function(){return this.title;},setTitle:function(A){this.title=A;if(this.region){this.region.updatePanelTitle(this,A);}},isClosable:function(){return this.closable;},beforeSlide:function(){this.el.clip();this.resizeEl.clip();},afterSlide:function(){this.el.unclip();this.resizeEl.unclip();},refresh:function(){if(this.refreshDelegate){this.loaded=false;this.refreshDelegate();}},destroy:function(){this.el.removeAllListeners();var A=document.createElement("span");A.appendChild(this.el.dom);A.innerHTML="";this.el.remove();this.el=null;},addxtype:function(A){if(A.xtype.match(/^Form$/)){var el=this.el.createChild();this.form=new Roo.form.Form(A);if(this.form.allItems.length)this.form.render(el.dom);return this.form;}if(['View','JsonView'].indexOf(A.xtype)>-1){A.el=this.el.appendChild(document.createElement("div"));var B=new Roo[A.xtype](A);B.render(false,'');return B;}return false;}});Roo.GridPanel=function(A,B){this.wrapper=Roo.DomHelper.append(document.body,{tag:"div",cls:"x-layout-grid-wrapper x-layout-inactive-content"},true);this.wrapper.dom.appendChild(A.getGridEl().dom);Roo.GridPanel.superclass.constructor.call(this,this.wrapper,B);if(this.toolbar){this.toolbar.el.insertBefore(this.wrapper.dom.firstChild);}if(this.footer&&!this.footer.el&&this.footer.xtype){this.footer.container=this.grid.getView().getFooterPanel(true);this.footer.dataSource=this.grid.dataSource;this.footer=Roo.factory(this.footer,Roo);} @@ -874,17 +874,17 @@ cm.setLocked(B,D,true);cm.moveColumn(B,C);this.grid.fireEvent("columnmove",B,C); Roo.grid.GridView=function(A){Roo.grid.GridView.superclass.constructor.call(this);this.el=null;Roo.apply(this,A);};Roo.extend(Roo.grid.GridView,Roo.grid.AbstractGridView,{rowClass:"x-grid-row",cellClass:"x-grid-col",tdClass:"x-grid-td",hdClass:"x-grid-hd",splitClass:"x-grid-split",sortClasses:["sort-asc","sort-desc"],enableMoveAnim:false,hlColor:"C3DAF9",dh:Roo.DomHelper,fly:Roo.Element.fly,css:Roo.util.CSS,borderWidth:1,splitOffset:3,scrollIncrement:22,cellRE:/(?:.*?)x-grid-(?:hd|cell|csplit)-(?:[\d]+)-([\d]+)(?:.*?)/,findRE:/\s?(?:x-grid-hd|x-grid-col|x-grid-csplit)\s/,bind: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("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){this.generateRules(cm);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;},init:function(A){Roo.grid.GridView.superclass.init.call(this,A);this.bind(A.dataSource,A.colModel);A.on("headerclick",this.handleHeaderClick,this);if(A.trackMouseOver){A.on("mouseover",this.onRowOver,this);A.on("mouseout",this.onRowOut,this);} -A.cancelTextSelection=function(){};this.gridId=A.id;var B=this.templates||{};if(!B.master){B.master=new Roo.Template('
','
','
','
','
{lockedHeader}
','
{lockedBody}
',"
",'
','
{header}
','
{body}
',"
",'
','','
 
',"
");B.master.disableformats=true;}if(!B.header){B.header=new Roo.Template('','{cells}',"
{splits}");B.header.disableformats=true;} +A.cancelTextSelection=function(){};this.gridId=A.id;var B=this.templates||{};if(!B.master){B.master=new Roo.Template('
','','
','
','
','
{lockedHeader}
','
{lockedBody}
',"
",'
','
{header}
','
{body}
',"
",'
','
 
',"
");B.master.disableformats=true;}if(!B.header){B.header=new Roo.Template('','{cells}',"
{splits}");B.header.disableformats=true;} B.header.compile();if(!B.hcell){B.hcell=new Roo.Template('
','
{value}
',"
");B.hcell.disableFormats=true;} B.hcell.compile();if(!B.hsplit){B.hsplit=new Roo.Template('
 
');B.hsplit.disableFormats=true;} B.hsplit.compile();if(!B.body){B.body=new Roo.Template('',"{rows}","
");B.body.disableFormats=true;} B.body.compile();if(!B.row){B.row=new Roo.Template('{cells}');B.row.disableFormats=true;} B.row.compile();if(!B.cell){B.cell=new Roo.Template('','
{value}
',"");B.cell.disableFormats=true;} B.cell.compile();this.templates=B;},onColWidthChange:function(){this.updateColumns.apply(this,arguments);},onHeaderChange:function(){this.updateHeaders.apply(this,arguments);},onHiddenChange:function(){this.handleHiddenChange.apply(this,arguments);},onColumnMove:function(){this.handleColumnMove.apply(this,arguments);},onColumnLock:function(){this.handleLockChange.apply(this,arguments);},onDataChange:function(){this.refresh();this.updateHeaderSortState();},onClear:function(){this.refresh();},onUpdate:function(ds,A){this.refreshRow(A);},refreshRow:function(A){var ds=this.ds,B;if(typeof A=='number'){B=A;A=ds.getAt(B);}else {B=ds.indexOf(A);} -this.insertRows(ds,B,B,true);this.onRemove(ds,A,B+1,true);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowupdated",this,B,A);},onAdd:function(ds,A,B){this.insertRows(ds,B,B+(A.length-1));},onRemove:function(ds,A,B,C){if(C!==true){this.fireEvent("beforerowremoved",this,B,A);}var bt=this.getBodyTable(),lt=this.getLockedTable();if(bt.rows[B]){bt.firstChild.removeChild(bt.rows[B]);}if(lt.rows[B]){lt.firstChild.removeChild(lt.rows[B]);}if(C!==true){this.stripeRows(B);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowremoved",this,B,A);}},onLoad:function(){this.scrollToTop();},scrollToTop:function(){if(this.scroller){this.scroller.dom.scrollTop=0;this.syncScroll();}},getHeaderPanel:function(A){if(A){this.headerPanel.show();}return this.headerPanel;},getFooterPanel:function(A){if(A){this.footerPanel.show();}return this.footerPanel;},initElements:function(){var E=Roo.Element;var el=this.grid.getGridEl().dom.firstChild;var cs=el.childNodes;this.el=new E(el);this.headerPanel=new E(el.firstChild);this.headerPanel.enableDisplayMode("block");this.scroller=new E(cs[1]);this.scrollSizer=new E(this.scroller.dom.firstChild);this.lockedWrap=new E(cs[2]);this.lockedHd=new E(this.lockedWrap.dom.firstChild);this.lockedBody=new E(this.lockedWrap.dom.childNodes[1]);this.mainWrap=new E(cs[3]);this.mainHd=new E(this.mainWrap.dom.firstChild);this.mainBody=new E(this.mainWrap.dom.childNodes[1]);this.footerPanel=new E(cs[4]);this.footerPanel.enableDisplayMode("block");this.focusEl=new E(cs[5]);this.focusEl.swallowEvent("click",true);this.resizeProxy=new E(cs[6]);this.headerSelector=String.format('#{0} td.x-grid-hd, #{1} td.x-grid-hd',this.lockedHd.id,this.mainHd.id);this.splitterSelector=String.format('#{0} div.x-grid-split, #{1} div.x-grid-split',this.idToCssName(this.lockedHd.id),this.idToCssName(this.mainHd.id));},idToCssName:function(s){return s.replace(/[^a-z0-9]+/ig,'-');},getHeaderCell:function(A){return Roo.DomQuery.select(this.headerSelector)[A];},getHeaderCellMeasure:function(A){return this.getHeaderCell(A).firstChild;},getHeaderCellText:function(A){return this.getHeaderCell(A).firstChild.firstChild;},getLockedTable:function(){return this.lockedBody.dom.firstChild;},getBodyTable:function(){return this.mainBody.dom.firstChild;},getLockedRow:function(A){return this.getLockedTable().rows[A];},getRow:function(A){return this.getBodyTable().rows[A];},getRowComposite:function(A){if(!this.rowEl){this.rowEl=new Roo.CompositeElementLite();}var B=[],C,D;if(C=this.getLockedRow(A)){B.push(C);}if(D=this.getRow(A)){B.push(D);} +this.insertRows(ds,B,B,true);this.onRemove(ds,A,B+1,true);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowupdated",this,B,A);},onAdd:function(ds,A,B){this.insertRows(ds,B,B+(A.length-1));},onRemove:function(ds,A,B,C){if(C!==true){this.fireEvent("beforerowremoved",this,B,A);}var bt=this.getBodyTable(),lt=this.getLockedTable();if(bt.rows[B]){bt.firstChild.removeChild(bt.rows[B]);}if(lt.rows[B]){lt.firstChild.removeChild(lt.rows[B]);}if(C!==true){this.stripeRows(B);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowremoved",this,B,A);}},onLoad:function(){this.scrollToTop();},scrollToTop:function(){if(this.scroller){this.scroller.dom.scrollTop=0;this.syncScroll();}},getHeaderPanel:function(A){if(A){this.headerPanel.show();}return this.headerPanel;},getFooterPanel:function(A){if(A){this.footerPanel.show();}return this.footerPanel;},initElements:function(){var E=Roo.Element;var el=this.grid.getGridEl().dom.firstChild;var cs=el.childNodes;this.el=new E(el);this.focusEl=new E(el.firstChild);this.focusEl.swallowEvent("click",true);this.headerPanel=new E(cs[1]);this.headerPanel.enableDisplayMode("block");this.scroller=new E(cs[2]);this.scrollSizer=new E(this.scroller.dom.firstChild);this.lockedWrap=new E(cs[3]);this.lockedHd=new E(this.lockedWrap.dom.firstChild);this.lockedBody=new E(this.lockedWrap.dom.childNodes[1]);this.mainWrap=new E(cs[4]);this.mainHd=new E(this.mainWrap.dom.firstChild);this.mainBody=new E(this.mainWrap.dom.childNodes[1]);this.footerPanel=new E(cs[5]);this.footerPanel.enableDisplayMode("block");this.resizeProxy=new E(cs[6]);this.headerSelector=String.format('#{0} td.x-grid-hd, #{1} td.x-grid-hd',this.lockedHd.id,this.mainHd.id);this.splitterSelector=String.format('#{0} div.x-grid-split, #{1} div.x-grid-split',this.idToCssName(this.lockedHd.id),this.idToCssName(this.mainHd.id));},idToCssName:function(s){return s.replace(/[^a-z0-9]+/ig,'-');},getHeaderCell:function(A){return Roo.DomQuery.select(this.headerSelector)[A];},getHeaderCellMeasure:function(A){return this.getHeaderCell(A).firstChild;},getHeaderCellText:function(A){return this.getHeaderCell(A).firstChild.firstChild;},getLockedTable:function(){return this.lockedBody.dom.firstChild;},getBodyTable:function(){return this.mainBody.dom.firstChild;},getLockedRow:function(A){return this.getLockedTable().rows[A];},getRow:function(A){return this.getBodyTable().rows[A];},getRowComposite:function(A){if(!this.rowEl){this.rowEl=new Roo.CompositeElementLite();}var B=[],C,D;if(C=this.getLockedRow(A)){B.push(C);}if(D=this.getRow(A)){B.push(D);} this.rowEl.elements=B;return this.rowEl;},getCell:function(A,B){var C=this.cm.getLockedCount();var D;if(B=this.ds.getCount()){return;} -B=(B!==undefined?B:0);var cm=this.grid.colModel;while(cm.isHidden(B)){B++;}var el=this.getCell(A,B);if(!el){return;}var c=this.scroller.dom;var D=parseInt(el.offsetTop,10);var E=parseInt(el.offsetLeft,10);var F=D+el.offsetHeight;var G=E+el.offsetWidth;var ch=c.clientHeight-this.mainHd.dom.offsetHeight;var H=parseInt(c.scrollTop,10);var I=parseInt(c.scrollLeft,10);var J=H+ch;var K=I+c.clientWidth;if(DJ){c.scrollTop=F-ch;}if(C!==false){if(EK){c.scrollLeft=G-c.clientWidth;}}return el;},updateColumns:function(){this.grid.stopEditing();var cm=this.grid.colModel,A=this.getColumnIds();var B=0;for(var i=0,C=cm.getColumnCount();i=this.ds.getCount()){return null;} +B=(B!==undefined?B:0);var cm=this.grid.colModel;while(cm.isHidden(B)){B++;}var el=this.getCell(A,B);if(!el){return null;}var c=this.scroller.dom;var D=parseInt(el.offsetTop,10);var E=parseInt(el.offsetLeft,10);var F=D+el.offsetHeight;var G=E+el.offsetWidth;var ch=c.clientHeight-this.mainHd.dom.offsetHeight;var H=parseInt(c.scrollTop,10);var I=parseInt(c.scrollLeft,10);var J=H+ch;var K=I+c.clientWidth;if(DJ){c.scrollTop=F-ch;}if(C!==false){if(EK){c.scrollLeft=G-c.clientWidth;}}return el;},updateColumns:function(){this.grid.stopEditing();var cm=this.grid.colModel,A=this.getColumnIds();var B=0;for(var i=0,C=cm.getColumnCount();ion initial render. It is more efficient to explicitly size the columns - * through the ColumnModel's {@link Roo.grid.ColumnModel#width} config option. Default is false. - */ - autoSizeColumns : false, + * @cfg {Boolean} autoSizeColumns True to automatically resize the columns to fit their content + * on initial render. It is more efficient to explicitly size the columns + * through the ColumnModel's {@link Roo.grid.ColumnModel#width} config option. Default is false. + */ + autoSizeColumns : false, - /** - * @cfg {Boolean} autoSizeHeaders True to measure headers with column data when auto sizing columns. Default is true. - */ - autoSizeHeaders : true, + /** + * @cfg {Boolean} autoSizeHeaders True to measure headers with column data when auto sizing columns. Default is true. + */ + autoSizeHeaders : true, - /** - * @cfg {Boolean} monitorWindowResize True to autoSize the grid when the window resizes. Default is true. - */ - monitorWindowResize : true, + /** + * @cfg {Boolean} monitorWindowResize True to autoSize the grid when the window resizes. Default is true. + */ + monitorWindowResize : true, - /** - * @cfg {Boolean} maxRowsToMeasure If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of - * rows measured to get a columns size. Default is 0 (all rows). - */ - maxRowsToMeasure : 0, + /** + * @cfg {Boolean} maxRowsToMeasure If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of + * rows measured to get a columns size. Default is 0 (all rows). + */ + maxRowsToMeasure : 0, - /** - * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is true. - */ - trackMouseOver : true, + /** + * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is true. + */ + trackMouseOver : true, /** - * @cfg {Boolean} enableDrag True to enable drag of rows. Default is false. (double check if this is needed?) - */ + * @cfg {Boolean} enableDrag True to enable drag of rows. Default is false. (double check if this is needed?) + */ - /** - * @cfg {Boolean} enableDragDrop True to enable drag and drop of rows. Default is false. - */ - enableDragDrop : false, - - /** - * @cfg {Boolean} enableColumnMove True to enable drag and drop reorder of columns. Default is true. - */ - enableColumnMove : true, - - /** - * @cfg {Boolean} enableColumnHide True to enable hiding of columns with the header context menu. Default is true. - */ - enableColumnHide : true, - - /** - * @cfg {Boolean} enableRowHeightSync True to manually sync row heights across locked and not locked rows. Default is false. - */ - enableRowHeightSync : false, - - /** - * @cfg {Boolean} stripeRows True to stripe the rows. Default is true. - */ - stripeRows : true, - - /** - * @cfg {Boolean} autoHeight True to fit the height of the grid container to the height of the data. Default is false. - */ - autoHeight : false, + /** + * @cfg {Boolean} enableDragDrop True to enable drag and drop of rows. Default is false. + */ + enableDragDrop : false, + + /** + * @cfg {Boolean} enableColumnMove True to enable drag and drop reorder of columns. Default is true. + */ + enableColumnMove : true, + + /** + * @cfg {Boolean} enableColumnHide True to enable hiding of columns with the header context menu. Default is true. + */ + enableColumnHide : true, + + /** + * @cfg {Boolean} enableRowHeightSync True to manually sync row heights across locked and not locked rows. Default is false. + */ + enableRowHeightSync : false, + + /** + * @cfg {Boolean} stripeRows True to stripe the rows. Default is true. + */ + stripeRows : true, + + /** + * @cfg {Boolean} autoHeight True to fit the height of the grid container to the height of the data. Default is false. + */ + autoHeight : false, /** * @cfg {String} autoExpandColumn The id (or dataIndex) of a column in this grid that should expand to fill unused space. This id can not be 0. Default is false. @@ -46599,18 +46600,19 @@ Roo.extend(Roo.grid.Grid, Roo.util.Observable, { autoExpandMax : 1000, /** - * @cfg {Object} view The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render(). - */ - view : null, + * @cfg {Object} view The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render(). + */ + view : null, - /** - * @cfg {Object} loadMask An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false. - */ - loadMask : false, /** - * @cfg {Roo.dd.DropTarget} dragTarget An {@link Roo.dd.DragTarget} config - */ - dropTarget: false, + * @cfg {Object} loadMask An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false. + */ + loadMask : false, + /** + * @cfg {Roo.dd.DropTarget} dragTarget An {@link Roo.dd.DragTarget} config + */ + dropTarget: false, + // private rendered : false, @@ -46625,7 +46627,8 @@ Roo.extend(Roo.grid.Grid, Roo.util.Observable, { * Called once after all setup has been completed and the grid is ready to be rendered. * @return {Roo.grid.Grid} this */ - render : function(){ + render : function() + { var c = this.container; // try to detect autoHeight/width mode if((!c.dom.offsetHeight || c.dom.offsetHeight < 20) || c.getStyle("height") == "auto"){ @@ -47309,6 +47312,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { if(!tpls.master){ tpls.master = new Roo.Template( '
', + '', '
', '
', '
', @@ -47320,7 +47324,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { '
{body}
', "
", '
', - '', + '
 
', "
" ); @@ -47498,25 +47502,27 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var cs = el.childNodes; this.el = new E(el); - this.headerPanel = new E(el.firstChild); + + this.focusEl = new E(el.firstChild); + this.focusEl.swallowEvent("click", true); + + this.headerPanel = new E(cs[1]); this.headerPanel.enableDisplayMode("block"); - this.scroller = new E(cs[1]); + this.scroller = new E(cs[2]); this.scrollSizer = new E(this.scroller.dom.firstChild); - this.lockedWrap = new E(cs[2]); + this.lockedWrap = new E(cs[3]); this.lockedHd = new E(this.lockedWrap.dom.firstChild); this.lockedBody = new E(this.lockedWrap.dom.childNodes[1]); - this.mainWrap = new E(cs[3]); + this.mainWrap = new E(cs[4]); this.mainHd = new E(this.mainWrap.dom.firstChild); this.mainBody = new E(this.mainWrap.dom.childNodes[1]); - this.footerPanel = new E(cs[4]); + this.footerPanel = new E(cs[5]); this.footerPanel.enableDisplayMode("block"); - this.focusEl = new E(cs[5]); - this.focusEl.swallowEvent("click", true); this.resizeProxy = new E(cs[6]); this.headerSelector = String.format( @@ -47702,7 +47708,9 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * Focuses the specified row. * @param {Number} row The row index */ - focusRow : function(row){ + focusRow : function(row) + { + //Roo.log('GridView.focusRow'); var x = this.scroller.dom.scrollLeft; this.focusCell(row, 0, false); this.scroller.dom.scrollLeft = x; @@ -47714,7 +47722,9 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * @param {Number} col The column index * @param {Boolean} hscroll false to disable horizontal scrolling */ - focusCell : function(row, col, hscroll){ + focusCell : function(row, col, hscroll) + { + //Roo.log('GridView.focusCell'); var el = this.ensureVisible(row, col, hscroll); this.focusEl.alignTo(el, "tl-tl"); if(Roo.isGecko){ @@ -47730,12 +47740,15 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * @param {Number} col The column index * @param {Boolean} hscroll false to disable horizontal scrolling */ - ensureVisible : function(row, col, hscroll){ + ensureVisible : function(row, col, hscroll) + { + //Roo.log('GridView.ensureVisible,' + row + ',' + col); + //return null; //disable for testing. if(typeof row != "number"){ row = row.rowIndex; } if(row < 0 && row >= this.ds.getCount()){ - return; + return null; } col = (col !== undefined ? col : 0); var cm = this.grid.colModel; @@ -47745,7 +47758,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var el = this.getCell(row, col); if(!el){ - return; + return null; } var c = this.scroller.dom; @@ -47753,19 +47766,31 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var cleft = parseInt(el.offsetLeft, 10); var cbot = ctop + el.offsetHeight; var cright = cleft + el.offsetWidth; - + var ch = c.clientHeight - this.mainHd.dom.offsetHeight; var stop = parseInt(c.scrollTop, 10); var sleft = parseInt(c.scrollLeft, 10); var sbot = stop + ch; var sright = sleft + c.clientWidth; - + /* + Roo.log('GridView.ensureVisible:' + + ' ctop:' + ctop + + ' c.clientHeight:' + c.clientHeight + + ' this.mainHd.dom.offsetHeight:' + this.mainHd.dom.offsetHeight + + ' stop:' + stop + + ' cbot:' + cbot + + ' sbot:' + sbot + + ' ch:' + ch + ); + */ if(ctop < stop){ - c.scrollTop = ctop; + c.scrollTop = ctop; + //Roo.log("set scrolltop to ctop DISABLE?"); }else if(cbot > sbot){ + //Roo.log("set scrolltop to cbot-ch"); c.scrollTop = cbot-ch; } - + if(hscroll !== false){ if(cleft < sleft){ c.scrollLeft = cleft; @@ -47773,6 +47798,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { c.scrollLeft = cright-c.clientWidth; } } + return el; }, @@ -47934,6 +47960,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, getScrollState : function(){ + var sb = this.scroller.dom; return {left: sb.scrollLeft, top: sb.scrollTop}; }, @@ -47965,6 +47992,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, restoreScroll : function(state){ + //Roo.log('GridView.restoreScroll'); var sb = this.scroller.dom; sb.scrollLeft = state.left; sb.scrollTop = state.top; @@ -47972,6 +48000,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, syncScroll : function(){ + //Roo.log('GridView.syncScroll'); var sb = this.scroller.dom; var sh = this.mainHd.dom; var bs = this.mainBody.dom; diff --git a/roojs-ui-debug.js b/roojs-ui-debug.js index a65e70ca80..bf94b4aa5d 100644 --- a/roojs-ui-debug.js +++ b/roojs-ui-debug.js @@ -31042,6 +31042,7 @@ Roo.ContentPanel = function(el, config, content){ } else { // fix randome scrolling this.el.on('scroll', function() { + Roo.log('fix random scolling'); this.scrollTo('top',0); }); } @@ -32049,8 +32050,8 @@ Roo.grid.Grid = function(container, config){ /** * @event rowclass * Fires when a row is rendered, so you can change add a style to it. - * @param {GridView} gridview The grid view - * @param {Object} rowcfg contains record, rowIndex and rowClass - set rowClass to add a style. + * @param {GridView} gridview The grid view + * @param {Object} rowcfg contains record rowIndex and rowClass - set rowClass to add a style. */ 'rowclass' : true, @@ -32068,74 +32069,74 @@ Roo.extend(Roo.grid.Grid, Roo.util.Observable, { /** * @cfg {String} ddGroup - drag drop group. - */ - + */ + /** * @cfg {Number} minColumnWidth The minimum width a column can be resized to. Default is 25. - */ - minColumnWidth : 25, + */ + minColumnWidth : 25, /** - * @cfg {Boolean} autoSizeColumns True to automatically resize the columns to fit their content - * on initial render. It is more efficient to explicitly size the columns - * through the ColumnModel's {@link Roo.grid.ColumnModel#width} config option. Default is false. - */ - autoSizeColumns : false, + * @cfg {Boolean} autoSizeColumns True to automatically resize the columns to fit their content + * on initial render. It is more efficient to explicitly size the columns + * through the ColumnModel's {@link Roo.grid.ColumnModel#width} config option. Default is false. + */ + autoSizeColumns : false, - /** - * @cfg {Boolean} autoSizeHeaders True to measure headers with column data when auto sizing columns. Default is true. - */ - autoSizeHeaders : true, + /** + * @cfg {Boolean} autoSizeHeaders True to measure headers with column data when auto sizing columns. Default is true. + */ + autoSizeHeaders : true, - /** - * @cfg {Boolean} monitorWindowResize True to autoSize the grid when the window resizes. Default is true. - */ - monitorWindowResize : true, + /** + * @cfg {Boolean} monitorWindowResize True to autoSize the grid when the window resizes. Default is true. + */ + monitorWindowResize : true, - /** - * @cfg {Boolean} maxRowsToMeasure If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of - * rows measured to get a columns size. Default is 0 (all rows). - */ - maxRowsToMeasure : 0, + /** + * @cfg {Boolean} maxRowsToMeasure If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of + * rows measured to get a columns size. Default is 0 (all rows). + */ + maxRowsToMeasure : 0, - /** - * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is true. - */ - trackMouseOver : true, + /** + * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is true. + */ + trackMouseOver : true, /** - * @cfg {Boolean} enableDrag True to enable drag of rows. Default is false. (double check if this is needed?) - */ + * @cfg {Boolean} enableDrag True to enable drag of rows. Default is false. (double check if this is needed?) + */ - /** - * @cfg {Boolean} enableDragDrop True to enable drag and drop of rows. Default is false. - */ - enableDragDrop : false, - - /** - * @cfg {Boolean} enableColumnMove True to enable drag and drop reorder of columns. Default is true. - */ - enableColumnMove : true, - - /** - * @cfg {Boolean} enableColumnHide True to enable hiding of columns with the header context menu. Default is true. - */ - enableColumnHide : true, - - /** - * @cfg {Boolean} enableRowHeightSync True to manually sync row heights across locked and not locked rows. Default is false. - */ - enableRowHeightSync : false, - - /** - * @cfg {Boolean} stripeRows True to stripe the rows. Default is true. - */ - stripeRows : true, - - /** - * @cfg {Boolean} autoHeight True to fit the height of the grid container to the height of the data. Default is false. - */ - autoHeight : false, + /** + * @cfg {Boolean} enableDragDrop True to enable drag and drop of rows. Default is false. + */ + enableDragDrop : false, + + /** + * @cfg {Boolean} enableColumnMove True to enable drag and drop reorder of columns. Default is true. + */ + enableColumnMove : true, + + /** + * @cfg {Boolean} enableColumnHide True to enable hiding of columns with the header context menu. Default is true. + */ + enableColumnHide : true, + + /** + * @cfg {Boolean} enableRowHeightSync True to manually sync row heights across locked and not locked rows. Default is false. + */ + enableRowHeightSync : false, + + /** + * @cfg {Boolean} stripeRows True to stripe the rows. Default is true. + */ + stripeRows : true, + + /** + * @cfg {Boolean} autoHeight True to fit the height of the grid container to the height of the data. Default is false. + */ + autoHeight : false, /** * @cfg {String} autoExpandColumn The id (or dataIndex) of a column in this grid that should expand to fill unused space. This id can not be 0. Default is false. @@ -32154,18 +32155,19 @@ Roo.extend(Roo.grid.Grid, Roo.util.Observable, { autoExpandMax : 1000, /** - * @cfg {Object} view The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render(). - */ - view : null, + * @cfg {Object} view The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render(). + */ + view : null, - /** - * @cfg {Object} loadMask An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false. - */ - loadMask : false, /** - * @cfg {Roo.dd.DropTarget} dragTarget An {@link Roo.dd.DragTarget} config - */ - dropTarget: false, + * @cfg {Object} loadMask An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false. + */ + loadMask : false, + /** + * @cfg {Roo.dd.DropTarget} dragTarget An {@link Roo.dd.DragTarget} config + */ + dropTarget: false, + // private rendered : false, @@ -32180,7 +32182,8 @@ Roo.extend(Roo.grid.Grid, Roo.util.Observable, { * Called once after all setup has been completed and the grid is ready to be rendered. * @return {Roo.grid.Grid} this */ - render : function(){ + render : function() + { var c = this.container; // try to detect autoHeight/width mode if((!c.dom.offsetHeight || c.dom.offsetHeight < 20) || c.getStyle("height") == "auto"){ @@ -32864,6 +32867,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { if(!tpls.master){ tpls.master = new Roo.Template( '
', + '', '
', '
', '
', @@ -32875,7 +32879,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { '
{body}
', "
", '
', - '', + '
 
', "
" ); @@ -33053,25 +33057,27 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var cs = el.childNodes; this.el = new E(el); - this.headerPanel = new E(el.firstChild); + + this.focusEl = new E(el.firstChild); + this.focusEl.swallowEvent("click", true); + + this.headerPanel = new E(cs[1]); this.headerPanel.enableDisplayMode("block"); - this.scroller = new E(cs[1]); + this.scroller = new E(cs[2]); this.scrollSizer = new E(this.scroller.dom.firstChild); - this.lockedWrap = new E(cs[2]); + this.lockedWrap = new E(cs[3]); this.lockedHd = new E(this.lockedWrap.dom.firstChild); this.lockedBody = new E(this.lockedWrap.dom.childNodes[1]); - this.mainWrap = new E(cs[3]); + this.mainWrap = new E(cs[4]); this.mainHd = new E(this.mainWrap.dom.firstChild); this.mainBody = new E(this.mainWrap.dom.childNodes[1]); - this.footerPanel = new E(cs[4]); + this.footerPanel = new E(cs[5]); this.footerPanel.enableDisplayMode("block"); - this.focusEl = new E(cs[5]); - this.focusEl.swallowEvent("click", true); this.resizeProxy = new E(cs[6]); this.headerSelector = String.format( @@ -33257,7 +33263,9 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * Focuses the specified row. * @param {Number} row The row index */ - focusRow : function(row){ + focusRow : function(row) + { + //Roo.log('GridView.focusRow'); var x = this.scroller.dom.scrollLeft; this.focusCell(row, 0, false); this.scroller.dom.scrollLeft = x; @@ -33269,7 +33277,9 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * @param {Number} col The column index * @param {Boolean} hscroll false to disable horizontal scrolling */ - focusCell : function(row, col, hscroll){ + focusCell : function(row, col, hscroll) + { + //Roo.log('GridView.focusCell'); var el = this.ensureVisible(row, col, hscroll); this.focusEl.alignTo(el, "tl-tl"); if(Roo.isGecko){ @@ -33285,12 +33295,15 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { * @param {Number} col The column index * @param {Boolean} hscroll false to disable horizontal scrolling */ - ensureVisible : function(row, col, hscroll){ + ensureVisible : function(row, col, hscroll) + { + //Roo.log('GridView.ensureVisible,' + row + ',' + col); + //return null; //disable for testing. if(typeof row != "number"){ row = row.rowIndex; } if(row < 0 && row >= this.ds.getCount()){ - return; + return null; } col = (col !== undefined ? col : 0); var cm = this.grid.colModel; @@ -33300,7 +33313,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var el = this.getCell(row, col); if(!el){ - return; + return null; } var c = this.scroller.dom; @@ -33308,19 +33321,31 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { var cleft = parseInt(el.offsetLeft, 10); var cbot = ctop + el.offsetHeight; var cright = cleft + el.offsetWidth; - + var ch = c.clientHeight - this.mainHd.dom.offsetHeight; var stop = parseInt(c.scrollTop, 10); var sleft = parseInt(c.scrollLeft, 10); var sbot = stop + ch; var sright = sleft + c.clientWidth; - + /* + Roo.log('GridView.ensureVisible:' + + ' ctop:' + ctop + + ' c.clientHeight:' + c.clientHeight + + ' this.mainHd.dom.offsetHeight:' + this.mainHd.dom.offsetHeight + + ' stop:' + stop + + ' cbot:' + cbot + + ' sbot:' + sbot + + ' ch:' + ch + ); + */ if(ctop < stop){ - c.scrollTop = ctop; + c.scrollTop = ctop; + //Roo.log("set scrolltop to ctop DISABLE?"); }else if(cbot > sbot){ + //Roo.log("set scrolltop to cbot-ch"); c.scrollTop = cbot-ch; } - + if(hscroll !== false){ if(cleft < sleft){ c.scrollLeft = cleft; @@ -33328,6 +33353,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { c.scrollLeft = cright-c.clientWidth; } } + return el; }, @@ -33489,6 +33515,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, getScrollState : function(){ + var sb = this.scroller.dom; return {left: sb.scrollLeft, top: sb.scrollTop}; }, @@ -33520,6 +33547,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, restoreScroll : function(state){ + //Roo.log('GridView.restoreScroll'); var sb = this.scroller.dom; sb.scrollLeft = state.left; sb.scrollTop = state.top; @@ -33527,6 +33555,7 @@ Roo.extend(Roo.grid.GridView, Roo.grid.AbstractGridView, { }, syncScroll : function(){ + //Roo.log('GridView.syncScroll'); var sb = this.scroller.dom; var sh = this.mainHd.dom; var bs = this.mainBody.dom; diff --git a/roojs-ui.js b/roojs-ui.js index 8056b573de..4254296e03 100644 --- a/roojs-ui.js +++ b/roojs-ui.js @@ -599,7 +599,7 @@ Roo.ContentPanel=function(el,A,B){if(el.autoCreate){A=el;el=Roo.id();} this.el=Roo.get(el);if(!this.el&&A&&A.autoCreate){if(typeof A.autoCreate=="object"){if(!A.autoCreate.id){A.autoCreate.id=A.id||el;} this.el=Roo.DomHelper.append(document.body,A.autoCreate,true);}else {this.el=Roo.DomHelper.append(document.body,{tag:"div",cls:"x-layout-inactive-content",id:A.id||el},true);}} this.closable=false;this.loaded=false;this.active=false;if(typeof A=="string"){this.title=A;}else {Roo.apply(this,A);}if(this.toolbar&&!this.toolbar.el&&this.toolbar.xtype){this.wrapEl=this.el.wrap();this.toolbar=new Roo.Toolbar(this.el.insertSibling(false,'before'),[],this.toolbar);}if(this.resizeEl){this.resizeEl=Roo.get(this.resizeEl,true);}else {this.resizeEl=this.el;} -this.addEvents({"activate":true,"deactivate":true,"resize":true});if(this.autoScroll){this.resizeEl.setStyle("overflow","auto");}else {this.el.on('scroll',function(){this.scrollTo('top',0);});} +this.addEvents({"activate":true,"deactivate":true,"resize":true});if(this.autoScroll){this.resizeEl.setStyle("overflow","auto");}else {this.el.on('scroll',function(){Roo.log('fix random scolling');this.scrollTo('top',0);});} B=B||this.content;if(B){this.setContent(B);}if(A&&A.url){this.setUrl(this.url,this.params,this.loadOnce);} Roo.ContentPanel.superclass.constructor.call(this);};Roo.extend(Roo.ContentPanel,Roo.util.Observable,{tabTip:'',setRegion:function(A){this.region=A;if(A){this.el.replaceClass("x-layout-inactive-content","x-layout-active-content");}else {this.el.replaceClass("x-layout-active-content","x-layout-inactive-content");}},getToolbar:function(){return this.toolbar;},setActiveState:function(A){this.active=A;if(!A){this.fireEvent("deactivate",this);}else {this.fireEvent("activate",this);}},setContent:function(A,B){this.el.update(A,B);},ignoreResize:function(w,h){if(this.lastSize&&this.lastSize.width==w&&this.lastSize.height==h){return true;}else {this.lastSize={width:w,height:h};return false;}},getUpdateManager:function(){return this.el.getUpdateManager();},load:function(){var um=this.el.getUpdateManager();um.update.apply(um,arguments);return this;},setUrl:function(A,B,C){if(this.refreshDelegate){this.removeListener("activate",this.refreshDelegate);} this.refreshDelegate=this._handleRefresh.createDelegate(this,[A,B,C]);this.on("activate",this.refreshDelegate);return this.el.getUpdateManager();},_handleRefresh:function(A,B,C){if(!C||!this.loaded){var D=this.el.getUpdateManager();D.update(A,B,this._setLoaded.createDelegate(this));}},_setLoaded:function(){this.loaded=true;},getId:function(){return this.el.id;},getEl:function(){return this.wrapEl||this.el;},adjustForComponents:function(A,B){if(this.resizeEl!=this.el){A-=this.el.getFrameWidth('lr');B-=this.el.getFrameWidth('tb');}if(this.toolbar){var te=this.toolbar.getEl();B-=te.getHeight();te.setWidth(A);}if(this.adjustments){A+=this.adjustments[0];B+=this.adjustments[1];}return {"width":A,"height":B};},setSize:function(A,B){if(this.fitToFrame&&!this.ignoreResize(A,B)){if(this.fitContainer&&this.resizeEl!=this.el){this.el.setSize(A,B);}var C=this.adjustForComponents(A,B);this.resizeEl.setSize(this.autoWidth?"auto":C.width,this.autoHeight?"auto":C.height);this.fireEvent('resize',this,C.width,C.height);}},getTitle:function(){return this.title;},setTitle:function(A){this.title=A;if(this.region){this.region.updatePanelTitle(this,A);}},isClosable:function(){return this.closable;},beforeSlide:function(){this.el.clip();this.resizeEl.clip();},afterSlide:function(){this.el.unclip();this.resizeEl.unclip();},refresh:function(){if(this.refreshDelegate){this.loaded=false;this.refreshDelegate();}},destroy:function(){this.el.removeAllListeners();var A=document.createElement("span");A.appendChild(this.el.dom);A.innerHTML="";this.el.remove();this.el=null;},addxtype:function(A){if(A.xtype.match(/^Form$/)){var el=this.el.createChild();this.form=new Roo.form.Form(A);if(this.form.allItems.length)this.form.render(el.dom);return this.form;}if(['View','JsonView'].indexOf(A.xtype)>-1){A.el=this.el.appendChild(document.createElement("div"));var B=new Roo[A.xtype](A);B.render(false,'');return B;}return false;}});Roo.GridPanel=function(A,B){this.wrapper=Roo.DomHelper.append(document.body,{tag:"div",cls:"x-layout-grid-wrapper x-layout-inactive-content"},true);this.wrapper.dom.appendChild(A.getGridEl().dom);Roo.GridPanel.superclass.constructor.call(this,this.wrapper,B);if(this.toolbar){this.toolbar.el.insertBefore(this.wrapper.dom.firstChild);}if(this.footer&&!this.footer.el&&this.footer.xtype){this.footer.container=this.grid.getView().getFooterPanel(true);this.footer.dataSource=this.grid.dataSource;this.footer=Roo.factory(this.footer,Roo);} @@ -631,17 +631,17 @@ cm.setLocked(B,D,true);cm.moveColumn(B,C);this.grid.fireEvent("columnmove",B,C); Roo.grid.GridView=function(A){Roo.grid.GridView.superclass.constructor.call(this);this.el=null;Roo.apply(this,A);};Roo.extend(Roo.grid.GridView,Roo.grid.AbstractGridView,{rowClass:"x-grid-row",cellClass:"x-grid-col",tdClass:"x-grid-td",hdClass:"x-grid-hd",splitClass:"x-grid-split",sortClasses:["sort-asc","sort-desc"],enableMoveAnim:false,hlColor:"C3DAF9",dh:Roo.DomHelper,fly:Roo.Element.fly,css:Roo.util.CSS,borderWidth:1,splitOffset:3,scrollIncrement:22,cellRE:/(?:.*?)x-grid-(?:hd|cell|csplit)-(?:[\d]+)-([\d]+)(?:.*?)/,findRE:/\s?(?:x-grid-hd|x-grid-col|x-grid-csplit)\s/,bind: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("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){this.generateRules(cm);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;},init:function(A){Roo.grid.GridView.superclass.init.call(this,A);this.bind(A.dataSource,A.colModel);A.on("headerclick",this.handleHeaderClick,this);if(A.trackMouseOver){A.on("mouseover",this.onRowOver,this);A.on("mouseout",this.onRowOut,this);} -A.cancelTextSelection=function(){};this.gridId=A.id;var B=this.templates||{};if(!B.master){B.master=new Roo.Template('
','
','
','
','
{lockedHeader}
','
{lockedBody}
',"
",'
','
{header}
','
{body}
',"
",'
','','
 
',"
");B.master.disableformats=true;}if(!B.header){B.header=new Roo.Template('','{cells}',"
{splits}");B.header.disableformats=true;} +A.cancelTextSelection=function(){};this.gridId=A.id;var B=this.templates||{};if(!B.master){B.master=new Roo.Template('
','','
','
','
','
{lockedHeader}
','
{lockedBody}
',"
",'
','
{header}
','
{body}
',"
",'
','
 
',"
");B.master.disableformats=true;}if(!B.header){B.header=new Roo.Template('','{cells}',"
{splits}");B.header.disableformats=true;} B.header.compile();if(!B.hcell){B.hcell=new Roo.Template('
','
{value}
',"
");B.hcell.disableFormats=true;} B.hcell.compile();if(!B.hsplit){B.hsplit=new Roo.Template('
 
');B.hsplit.disableFormats=true;} B.hsplit.compile();if(!B.body){B.body=new Roo.Template('',"{rows}","
");B.body.disableFormats=true;} B.body.compile();if(!B.row){B.row=new Roo.Template('{cells}');B.row.disableFormats=true;} B.row.compile();if(!B.cell){B.cell=new Roo.Template('','
{value}
',"");B.cell.disableFormats=true;} B.cell.compile();this.templates=B;},onColWidthChange:function(){this.updateColumns.apply(this,arguments);},onHeaderChange:function(){this.updateHeaders.apply(this,arguments);},onHiddenChange:function(){this.handleHiddenChange.apply(this,arguments);},onColumnMove:function(){this.handleColumnMove.apply(this,arguments);},onColumnLock:function(){this.handleLockChange.apply(this,arguments);},onDataChange:function(){this.refresh();this.updateHeaderSortState();},onClear:function(){this.refresh();},onUpdate:function(ds,A){this.refreshRow(A);},refreshRow:function(A){var ds=this.ds,B;if(typeof A=='number'){B=A;A=ds.getAt(B);}else {B=ds.indexOf(A);} -this.insertRows(ds,B,B,true);this.onRemove(ds,A,B+1,true);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowupdated",this,B,A);},onAdd:function(ds,A,B){this.insertRows(ds,B,B+(A.length-1));},onRemove:function(ds,A,B,C){if(C!==true){this.fireEvent("beforerowremoved",this,B,A);}var bt=this.getBodyTable(),lt=this.getLockedTable();if(bt.rows[B]){bt.firstChild.removeChild(bt.rows[B]);}if(lt.rows[B]){lt.firstChild.removeChild(lt.rows[B]);}if(C!==true){this.stripeRows(B);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowremoved",this,B,A);}},onLoad:function(){this.scrollToTop();},scrollToTop:function(){if(this.scroller){this.scroller.dom.scrollTop=0;this.syncScroll();}},getHeaderPanel:function(A){if(A){this.headerPanel.show();}return this.headerPanel;},getFooterPanel:function(A){if(A){this.footerPanel.show();}return this.footerPanel;},initElements:function(){var E=Roo.Element;var el=this.grid.getGridEl().dom.firstChild;var cs=el.childNodes;this.el=new E(el);this.headerPanel=new E(el.firstChild);this.headerPanel.enableDisplayMode("block");this.scroller=new E(cs[1]);this.scrollSizer=new E(this.scroller.dom.firstChild);this.lockedWrap=new E(cs[2]);this.lockedHd=new E(this.lockedWrap.dom.firstChild);this.lockedBody=new E(this.lockedWrap.dom.childNodes[1]);this.mainWrap=new E(cs[3]);this.mainHd=new E(this.mainWrap.dom.firstChild);this.mainBody=new E(this.mainWrap.dom.childNodes[1]);this.footerPanel=new E(cs[4]);this.footerPanel.enableDisplayMode("block");this.focusEl=new E(cs[5]);this.focusEl.swallowEvent("click",true);this.resizeProxy=new E(cs[6]);this.headerSelector=String.format('#{0} td.x-grid-hd, #{1} td.x-grid-hd',this.lockedHd.id,this.mainHd.id);this.splitterSelector=String.format('#{0} div.x-grid-split, #{1} div.x-grid-split',this.idToCssName(this.lockedHd.id),this.idToCssName(this.mainHd.id));},idToCssName:function(s){return s.replace(/[^a-z0-9]+/ig,'-');},getHeaderCell:function(A){return Roo.DomQuery.select(this.headerSelector)[A];},getHeaderCellMeasure:function(A){return this.getHeaderCell(A).firstChild;},getHeaderCellText:function(A){return this.getHeaderCell(A).firstChild.firstChild;},getLockedTable:function(){return this.lockedBody.dom.firstChild;},getBodyTable:function(){return this.mainBody.dom.firstChild;},getLockedRow:function(A){return this.getLockedTable().rows[A];},getRow:function(A){return this.getBodyTable().rows[A];},getRowComposite:function(A){if(!this.rowEl){this.rowEl=new Roo.CompositeElementLite();}var B=[],C,D;if(C=this.getLockedRow(A)){B.push(C);}if(D=this.getRow(A)){B.push(D);} +this.insertRows(ds,B,B,true);this.onRemove(ds,A,B+1,true);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowupdated",this,B,A);},onAdd:function(ds,A,B){this.insertRows(ds,B,B+(A.length-1));},onRemove:function(ds,A,B,C){if(C!==true){this.fireEvent("beforerowremoved",this,B,A);}var bt=this.getBodyTable(),lt=this.getLockedTable();if(bt.rows[B]){bt.firstChild.removeChild(bt.rows[B]);}if(lt.rows[B]){lt.firstChild.removeChild(lt.rows[B]);}if(C!==true){this.stripeRows(B);this.syncRowHeights(B,B);this.layout();this.fireEvent("rowremoved",this,B,A);}},onLoad:function(){this.scrollToTop();},scrollToTop:function(){if(this.scroller){this.scroller.dom.scrollTop=0;this.syncScroll();}},getHeaderPanel:function(A){if(A){this.headerPanel.show();}return this.headerPanel;},getFooterPanel:function(A){if(A){this.footerPanel.show();}return this.footerPanel;},initElements:function(){var E=Roo.Element;var el=this.grid.getGridEl().dom.firstChild;var cs=el.childNodes;this.el=new E(el);this.focusEl=new E(el.firstChild);this.focusEl.swallowEvent("click",true);this.headerPanel=new E(cs[1]);this.headerPanel.enableDisplayMode("block");this.scroller=new E(cs[2]);this.scrollSizer=new E(this.scroller.dom.firstChild);this.lockedWrap=new E(cs[3]);this.lockedHd=new E(this.lockedWrap.dom.firstChild);this.lockedBody=new E(this.lockedWrap.dom.childNodes[1]);this.mainWrap=new E(cs[4]);this.mainHd=new E(this.mainWrap.dom.firstChild);this.mainBody=new E(this.mainWrap.dom.childNodes[1]);this.footerPanel=new E(cs[5]);this.footerPanel.enableDisplayMode("block");this.resizeProxy=new E(cs[6]);this.headerSelector=String.format('#{0} td.x-grid-hd, #{1} td.x-grid-hd',this.lockedHd.id,this.mainHd.id);this.splitterSelector=String.format('#{0} div.x-grid-split, #{1} div.x-grid-split',this.idToCssName(this.lockedHd.id),this.idToCssName(this.mainHd.id));},idToCssName:function(s){return s.replace(/[^a-z0-9]+/ig,'-');},getHeaderCell:function(A){return Roo.DomQuery.select(this.headerSelector)[A];},getHeaderCellMeasure:function(A){return this.getHeaderCell(A).firstChild;},getHeaderCellText:function(A){return this.getHeaderCell(A).firstChild.firstChild;},getLockedTable:function(){return this.lockedBody.dom.firstChild;},getBodyTable:function(){return this.mainBody.dom.firstChild;},getLockedRow:function(A){return this.getLockedTable().rows[A];},getRow:function(A){return this.getBodyTable().rows[A];},getRowComposite:function(A){if(!this.rowEl){this.rowEl=new Roo.CompositeElementLite();}var B=[],C,D;if(C=this.getLockedRow(A)){B.push(C);}if(D=this.getRow(A)){B.push(D);} this.rowEl.elements=B;return this.rowEl;},getCell:function(A,B){var C=this.cm.getLockedCount();var D;if(B=this.ds.getCount()){return;} -B=(B!==undefined?B:0);var cm=this.grid.colModel;while(cm.isHidden(B)){B++;}var el=this.getCell(A,B);if(!el){return;}var c=this.scroller.dom;var D=parseInt(el.offsetTop,10);var E=parseInt(el.offsetLeft,10);var F=D+el.offsetHeight;var G=E+el.offsetWidth;var ch=c.clientHeight-this.mainHd.dom.offsetHeight;var H=parseInt(c.scrollTop,10);var I=parseInt(c.scrollLeft,10);var J=H+ch;var K=I+c.clientWidth;if(DJ){c.scrollTop=F-ch;}if(C!==false){if(EK){c.scrollLeft=G-c.clientWidth;}}return el;},updateColumns:function(){this.grid.stopEditing();var cm=this.grid.colModel,A=this.getColumnIds();var B=0;for(var i=0,C=cm.getColumnCount();i=this.ds.getCount()){return null;} +B=(B!==undefined?B:0);var cm=this.grid.colModel;while(cm.isHidden(B)){B++;}var el=this.getCell(A,B);if(!el){return null;}var c=this.scroller.dom;var D=parseInt(el.offsetTop,10);var E=parseInt(el.offsetLeft,10);var F=D+el.offsetHeight;var G=E+el.offsetWidth;var ch=c.clientHeight-this.mainHd.dom.offsetHeight;var H=parseInt(c.scrollTop,10);var I=parseInt(c.scrollLeft,10);var J=H+ch;var K=I+c.clientWidth;if(DJ){c.scrollTop=F-ch;}if(C!==false){if(EK){c.scrollLeft=G-c.clientWidth;}}return el;},updateColumns:function(){this.grid.stopEditing();var cm=this.grid.colModel,A=this.getColumnIds();var B=0;for(var i=0,C=cm.getColumnCount();i