Ext.define("Ext.util.Renderable",{requires:["Ext.dom.Element"],frameCls:Ext.baseCSSPrefix+"frame",frameIdRegex:/[\-]frame\d+[TMB][LCR]$/,frameElNames:["TL","TC","TR","ML","MC","MR","BL","BC","BR"],frameTpl:["{%this.renderDockedItems(out,values,0);%}",'<tpl if="top">','<tpl if="left"><div id="{fgid}TL" class="{frameCls}-tl {baseCls}-tl {baseCls}-{ui}-tl<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tl</tpl>{frameElCls}" role="presentation"></tpl>','<tpl if="right"><div id="{fgid}TR" class="{frameCls}-tr {baseCls}-tr {baseCls}-{ui}-tr<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tr</tpl>{frameElCls}" role="presentation"></tpl>','<div id="{fgid}TC" class="{frameCls}-tc {baseCls}-tc {baseCls}-{ui}-tc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tc</tpl>{frameElCls}" role="presentation"></div>','<tpl if="right"></div></tpl>','<tpl if="left"></div></tpl>',"</tpl>",'<tpl if="left"><div id="{fgid}ML" class="{frameCls}-ml {baseCls}-ml {baseCls}-{ui}-ml<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-ml</tpl>{frameElCls}" role="presentation"></tpl>','<tpl if="right"><div id="{fgid}MR" class="{frameCls}-mr {baseCls}-mr {baseCls}-{ui}-mr<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-mr</tpl>{frameElCls}" role="presentation"></tpl>','<div id="{fgid}MC" class="{frameCls}-mc {baseCls}-mc {baseCls}-{ui}-mc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-mc</tpl>{frameElCls}" role="presentation">',"{%this.applyRenderTpl(out, values)%}","</div>",'<tpl if="right"></div></tpl>','<tpl if="left"></div></tpl>','<tpl if="bottom">','<tpl if="left"><div id="{fgid}BL" class="{frameCls}-bl {baseCls}-bl {baseCls}-{ui}-bl<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-bl</tpl>{frameElCls}" role="presentation"></tpl>','<tpl if="right"><div id="{fgid}BR" class="{frameCls}-br {baseCls}-br {baseCls}-{ui}-br<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-br</tpl>{frameElCls}" role="presentation"></tpl>','<div id="{fgid}BC" class="{frameCls}-bc {baseCls}-bc {baseCls}-{ui}-bc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-bc</tpl>{frameElCls}" role="presentation"></div>','<tpl if="right"></div></tpl>','<tpl if="left"></div></tpl>',"</tpl>","{%this.renderDockedItems(out,values,1);%}"],frameTableTpl:["{%this.renderDockedItems(out,values,0);%}",'<table class="',Ext.plainTableCls,'" cellpadding="0"><tbody>','<tpl if="top">',"<tr>",'<tpl if="left"><td id="{fgid}TL" class="{frameCls}-tl {baseCls}-tl {baseCls}-{ui}-tl<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tl</tpl>{frameElCls}" role="presentation"></td></tpl>','<td id="{fgid}TC" class="{frameCls}-tc {baseCls}-tc {baseCls}-{ui}-tc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tc</tpl>{frameElCls}" role="presentation"></td>','<tpl if="right"><td id="{fgid}TR" class="{frameCls}-tr {baseCls}-tr {baseCls}-{ui}-tr<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-tr</tpl>{frameElCls}" role="presentation"></td></tpl>',"</tr>","</tpl>","<tr>",'<tpl if="left"><td id="{fgid}ML" class="{frameCls}-ml {baseCls}-ml {baseCls}-{ui}-ml<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-ml</tpl>{frameElCls}" role="presentation"></td></tpl>','<td id="{fgid}MC" class="{frameCls}-mc {baseCls}-mc {baseCls}-{ui}-mc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-mc</tpl>{frameElCls}" role="presentation">',"{%this.applyRenderTpl(out, values)%}","</td>",'<tpl if="right"><td id="{fgid}MR" class="{frameCls}-mr {baseCls}-mr {baseCls}-{ui}-mr<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-mr</tpl>{frameElCls}" role="presentation"></td></tpl>',"</tr>",'<tpl if="bottom">',"<tr>",'<tpl if="left"><td id="{fgid}BL" class="{frameCls}-bl {baseCls}-bl {baseCls}-{ui}-bl<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-bl</tpl>{frameElCls}" role="presentation"></td></tpl>','<td id="{fgid}BC" class="{frameCls}-bc {baseCls}-bc {baseCls}-{ui}-bc<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-bc</tpl>{frameElCls}" role="presentation"></td>','<tpl if="right"><td id="{fgid}BR" class="{frameCls}-br {baseCls}-br {baseCls}-{ui}-br<tpl for="uiCls"> {parent.baseCls}-{parent.ui}-{.}-br</tpl>{frameElCls}" role="presentation"></td></tpl>',"</tr>","</tpl>","</tbody></table>","{%this.renderDockedItems(out,values,1);%}"],afterRender:function(){var d=this,e={},h=d.protoEl,g=d.el,c,f,a,b;d.finishRenderChildren();if(d.contentEl){f=Ext.baseCSSPrefix;a=f+"hide-";b=Ext.get(d.contentEl);b.removeCls([f+"hidden",a+"display",a+"offsets",a+"nosize"]);d.getContentTarget().appendChild(b.dom)}h.writeTo(e);c=e.removed;if(c){g.removeCls(c)}c=e.cls;if(c.length){g.addCls(c)}c=e.style;if(e.style){g.setStyle(c)}d.protoEl=null;if(!d.ownerCt){d.updateLayout()}},afterFirstLayout:function(b,h){var d=this,g=d.x,e=d.y,c,a,f,i;if(!d.ownerLayout){c=Ext.isDefined(g);a=Ext.isDefined(e)}if(d.floating&&(!c||!a)){if(d.floatParent){f=d.floatParent.getTargetEl().getViewRegion();i=d.el.getAlignToXY(d.floatParent.getTargetEl(),"c-c");f.x=i[0]-f.x;f.y=i[1]-f.y}else{i=d.el.getAlignToXY(d.container,"c-c");f=d.container.translateXY(i[0],i[1])}g=c?g:f.x;e=a?e:f.y;c=a=true}if(c||a){d.setPosition(g,e)}d.onBoxReady(b,h)},applyRenderSelectors:function(){var d=this,b=d.renderSelectors,c=d.el,e=c.dom,a;d.applyChildEls(c);if(b){for(a in b){if(b.hasOwnProperty(a)&&b[a]){d[a]=Ext.get(Ext.DomQuery.selectNode(b[a],e))}}}},beforeRender:function(){var c=this,e=c.getTargetEl(),d=c.getOverflowEl(),b=c.getComponentLayout(),a=c.getOverflowStyle();c.frame=c.frame||c.alwaysFramed;if(!b.initialized){b.initLayout()}if(d){d.setStyle(a);c.overflowStyleSet=true}c.setUI(c.ui);if(c.disabled){c.disable(true)}},doApplyRenderTpl:function(c,a){var d=a.$comp,b;if(!d.rendered){b=d.initRenderTpl();b.applyOut(a.renderData,c)}},doAutoRender:function(){var a=this;if(!a.rendered){if(a.floating){a.render(document.body)}else{a.render(Ext.isBoolean(a.autoRender)?Ext.getBody():a.autoRender)}}},doRenderContent:function(a,c){var b=c.$comp;if(b.html){Ext.DomHelper.generateMarkup(b.html,a);delete b.html}if(b.tpl){if(!b.tpl.isTemplate){b.tpl=new Ext.XTemplate(b.tpl)}if(b.data){b.tpl.applyOut(b.data,a);delete b.data}}},doRenderFramingDockedItems:function(a,c,d){var b=c.$comp;if(!b.rendered&&b.doRenderDockedItems){c.renderData.$skipDockedItems=true;b.doRenderDockedItems.call(this,a,c,d)}},finishRender:function(a){var d=this,b,e,c;if(!d.el||d.$pid){if(d.container){c=d.container.getById(d.id,true)}else{c=Ext.getDom(d.id)}if(!d.el){d.wrapPrimaryEl(c)}else{delete d.$pid;if(!d.el.dom){d.wrapPrimaryEl(d.el)}c.parentNode.insertBefore(d.el.dom,c);Ext.removeNode(c)}}else{if(!d.rendering){b=d.initRenderTpl();if(b){e=d.initRenderData();b.insertFirst(d.getTargetEl(),e)}}}if(!d.container){d.container=Ext.get(d.el.dom.parentNode)}if(d.ctCls){d.container.addCls(d.ctCls)}d.onRender(d.container,a);if(!d.overflowStyleSet){d.getOverflowEl().setStyle(d.getOverflowStyle())}d.el.setVisibilityMode(Ext.Element[d.hideMode.toUpperCase()]);if(d.overCls){d.el.hover(d.addOverCls,d.removeOverCls,d)}if(d.hasListeners.render){d.fireEvent("render",d)}d.afterRender();if(d.hasListeners.afterrender){d.fireEvent("afterrender",d)}d.initEvents();if(d.hidden){d.el.hide()}},finishRenderChildren:function(){var a=this.getComponentLayout();a.finishRender()},getElConfig:function(){var h=this,k=h.autoEl,f=h.getFrameInfo(),b={tag:"div",tpl:f?h.initFramingTpl(f.table):h.initRenderTpl()},a=h.protoEl,c,e,g,l,d,j;h.initStyles(a);a.writeTo(b);a.flush();if(Ext.isString(k)){b.tag=k}else{Ext.apply(b,k)}b.id=h.id;if(b.tpl){if(f){e=h.frameElNames;g=e.length;b.tplData=j=h.getFrameRenderData();j.renderData=h.initRenderData();d=j.fgid;for(c=0;c<g;c++){l=e[c];h.addChildEls({name:"frame"+l,id:d+l})}h.addChildEls({name:"frameBody",id:d+"MC"})}else{b.tplData=h.initRenderData()}}return b},initFramingTpl:function(b){var a=this.getFrameTpl(b);if(a&&!a.applyRenderTpl){this.setupFramingTpl(a)}return a},setupFramingTpl:function(a){a.applyRenderTpl=this.doApplyRenderTpl;a.renderDockedItems=this.doRenderFramingDockedItems},getInsertPosition:function(a){if(a!==undefined){if(Ext.isNumber(a)){a=this.container.dom.childNodes[a]}else{a=Ext.getDom(a)}}return a},getRenderTree:function(){var a=this;if(!a.hasListeners.beforerender||a.fireEvent("beforerender",a)!==false){a.beforeRender();a.rendering=true;if(a.el){return{tag:"div",id:(a.$pid=Ext.id())}}return a.getElConfig()}return null},initContainer:function(a){var b=this;if(!a&&b.el){a=b.el.dom.parentNode;b.allowDomMove=false}b.container=a.dom?a:Ext.get(a);return b.container},initRenderData:function(){var a=this;return Ext.apply({$comp:a,id:a.id,ui:a.ui,uiCls:a.uiCls,baseCls:a.baseCls,componentCls:a.componentCls,frame:a.frame,childElCls:""},a.renderData)},initRenderTpl:function(){var a=this.getTpl("renderTpl");if(a&&!a.renderContent){this.setupRenderTpl(a)}return a},onRender:function(d,e){var f=this,h=f.x,g=f.y,c=null,a,i,b=f.el;f.applyRenderSelectors();f.rendering=null;f.rendered=true;if(h!=null){c={x:h}}if(g!=null){(c=c||{}).y=g}if(!f.getFrameInfo()&&Ext.isBorderBox){a=f.width;i=f.height;if(typeof a==="number"){c=c||{};c.width=a}if(typeof i==="number"){c=c||{};c.height=i}}f.lastBox=b.lastBox=c},render:function(c,b){var e=this,d=e.el&&(e.el=Ext.get(e.el)),g,a,f;Ext.suspendLayouts();c=e.initContainer(c);f=e.getInsertPosition(b);if(!d){a=e.getRenderTree();if(e.ownerLayout&&e.ownerLayout.transformItemRenderTree){a=e.ownerLayout.transformItemRenderTree(a)}if(a){if(f){d=Ext.DomHelper.insertBefore(f,a)}else{d=Ext.DomHelper.append(c,a)}e.wrapPrimaryEl(d)}}else{if(!e.hasListeners.beforerender||e.fireEvent("beforerender",e)!==false){e.beforeRender();e.initStyles(d);if(e.allowDomMove!==false){if(f){c.dom.insertBefore(d.dom,f)}else{c.dom.appendChild(d.dom)}}}else{g=true}}if(d&&!g){e.finishRender(b)}Ext.resumeLayouts(!e.hidden&&!c.isDetachedBody)},ensureAttachedToBody:function(c){var b=this,a;while(b.ownerCt){b=b.ownerCt}if(b.container.isDetachedBody){b.container=a=Ext.getBody();a.appendChild(b.el.dom);if(c){b.updateLayout()}if(typeof b.x=="number"||typeof b.y=="number"){b.setPosition(b.x,b.y)}}},setupRenderTpl:function(a){a.renderBody=a.renderContent=this.doRenderContent},wrapPrimaryEl:function(a){this.el=Ext.get(a,true)},initFrame:function(){if(Ext.supports.CSS3BorderRadius||!this.frame){return}var g=this,e=g.getFrameInfo(),a,c,d=g.frameElNames,f=d.length,b,h,j;if(e){a=g.getFrameTpl(e.table);h=g.getFrameRenderData();c=h.fgid;a.insertFirst(g.el,h);g.frameBody=g.el.down("."+g.frameCls+"-mc");g.removeChildEls(function(i){return i.id&&g.frameIdRegex.test(i.id)});for(b=0;b<f;b++){j=d[b];g["frame"+j]=g.el.getById(c+j)}}},getFrameRenderData:function(){var c=this,b=c.frameSize,a=(c.frameGenId||0)+1;c.frameGenId=a;return{$comp:c,fgid:c.id+"-frame"+a,ui:c.ui,uiCls:c.uiCls,frameCls:c.frameCls,baseCls:c.baseCls,top:!!b.top,left:!!b.left,right:!!b.right,bottom:!!b.bottom,frameElCls:""}},updateFrame:function(){if(Ext.supports.CSS3BorderRadius||!this.frame){return}var e=this,g=e.frameSize&&e.frameSize.table,f=e.frameTL,d=e.frameBL,c=e.frameML,a=e.frameMC,b;e.initFrame();if(a){if(e.frame){b=e.frameMC.dom.className;a.insertAfter(e.frameMC);e.frameMC.remove();e.frameBody=e.frameMC=a;a.dom.className=b;if(g){e.el.query("> table")[1].remove()}else{if(f){f.remove()}if(d){d.remove()}if(c){c.remove()}}}}else{if(e.frame){e.applyRenderSelectors()}}},getFrameInfo:function(){if(Ext.supports.CSS3BorderRadius||!this.frame){return false}var v=this,n=v.frameInfoCache,e=v.getFramingInfoCls()+"-frameInfo",w=n[e],o=Math.max,m,j,r,l,x,f,i,b,c,k,g,q,s,h,a,d,u,p,t;if(w==null){m=Ext.fly(v.getStyleProxy(e),"frame-style-el");r=m.getStyle("font-family");if(r){r=r.split("-");d=parseInt(r[1],10);u=parseInt(r[2],10);p=parseInt(r[3],10);t=parseInt(r[4],10);b=parseInt(r[5],10);c=parseInt(r[6],10);k=parseInt(r[7],10);g=parseInt(r[8],10);q=parseInt(r[9],10);s=parseInt(r[10],10);h=parseInt(r[11],10);a=parseInt(r[12],10);l=o(b,o(d,u));x=o(c,o(u,p));f=o(k,o(t,p));i=o(g,o(d,t));w={table:r[0].charAt(0)==="t",vertical:r[0].charAt(1)==="v",top:l,right:x,bottom:f,left:i,width:i+x,height:l+f,maxWidth:o(l,x,f,i),border:{top:b,right:c,bottom:k,left:g,width:g+c,height:b+k},padding:{top:q,right:s,bottom:h,left:a,width:a+s,height:q+h},radius:{tl:d,tr:u,br:p,bl:t}}}else{w=false}if(v.frame===true&&!w){Ext.log.error("You have set frame: true explicity on this component ("+v.getXType()+") and it does not have any framing defined in the CSS template. In this case IE cannot figure out what sizes to use and thus framing on this component will be disabled.")}n[e]=w}v.frame=!!w;v.frameSize=w;return w},getFramingInfoCls:function(){return this.baseCls+"-"+this.ui},getStyleProxy:function(b){var a=this.styleProxyEl||(Ext.AbstractComponent.prototype.styleProxyEl=Ext.getBody().createChild({style:{position:"absolute",top:"-10000px"}},null,true));a.className=b;return a},getFrameTpl:function(a){return this.getTpl(a?"frameTableTpl":"frameTpl")},frameInfoCache:{}});