git.roojs.org Git - roojs1/blob - docs/src/Roo_bootstrap_layout_Split.js.html

   1 <html><head><title>/home/edward/gitlive/roojs1/Roo/bootstrap/layout/Split.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  * Based on:
   3  * Ext JS Library 1.1.1
   4  * Copyright(c) 2006-2007, Ext JS, LLC.
   5  *
   6  * Originally Released Under LGPL - original licence link has changed is not relivant.
   7  *
   8  * Fork - LGPL
   9  * &lt;script type=&quot;text/javascript&quot;&gt;
  10  */
  11
  12
  13
  14 /**
  15  * @class Roo.SplitLayoutRegion
  16  * @extends Roo.LayoutRegion
  17  * Adds a splitbar and other (private) useful functionality to a {@link Roo.LayoutRegion}.
  18  */
  19 </span><span class="jsdoc-var">Roo.bootstrap.layout.Split </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  20     </span><span class="jsdoc-var">this.cursor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.cursor</span><span class="jsdoc-syntax">;
  21     </span><span class="jsdoc-var">Roo.bootstrap.layout.Split.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  22 };
  23
  24 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.layout.Split</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.layout.Region</span><span class="jsdoc-syntax">,
  25 {
  26     </span><span class="jsdoc-var">splitTip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Drag to resize.&quot;</span><span class="jsdoc-syntax">,
  27     </span><span class="jsdoc-var">collapsibleSplitTip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Drag to resize. Double click to hide.&quot;</span><span class="jsdoc-syntax">,
  28     </span><span class="jsdoc-var">useSplitTips </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  29
  30     </span><span class="jsdoc-var">applyConfig </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  31         </span><span class="jsdoc-var">Roo.bootstrap.layout.Split.superclass.applyConfig.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  32     },
  33
  34     </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ctr</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">) {
  35
  36         </span><span class="jsdoc-var">Roo.bootstrap.layout.Split.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ctr</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">);
  37         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.config.split</span><span class="jsdoc-syntax">){
  38             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
  39         }
  40         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.split</span><span class="jsdoc-syntax">){
  41
  42             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">splitEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ctr.dom</span><span class="jsdoc-syntax">,  {
  43                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
  44                             </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.el.id </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot;-split&quot;</span><span class="jsdoc-syntax">,
  45                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-layout-split roo-layout-split-&quot;</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">,
  46                             </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&amp;#160;&quot;
  47             </span><span class="jsdoc-syntax">});
  48             </span><span class="jsdoc-comment">/** The SplitBar for this region
  49             * @type Roo.SplitBar */
  50             // does not exist yet...
  51             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.orientation</span><span class="jsdoc-syntax">]);
  52
  53             </span><span class="jsdoc-var">this.split </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.SplitBar</span><span class="jsdoc-syntax">({
  54                 </span><span class="jsdoc-var">dragElement </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">splitEl</span><span class="jsdoc-syntax">,
  55                 </span><span class="jsdoc-var">resizingElement</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">,
  56                 </span><span class="jsdoc-var">orientation </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.orientation
  57             </span><span class="jsdoc-syntax">});
  58
  59             </span><span class="jsdoc-var">this.split.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;moved&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onSplitMove</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  60             </span><span class="jsdoc-var">this.split.useShim </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.useShim </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
  61             </span><span class="jsdoc-var">this.split.getMaximumSize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.position </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'north' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.position </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'south' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'getVMaxSize' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'getHMaxSize'</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  62             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.useSplitTips</span><span class="jsdoc-syntax">){
  63                 </span><span class="jsdoc-var">this.split.el.dom.title </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.collapsible </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.collapsibleSplitTip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.splitTip</span><span class="jsdoc-syntax">;
  64             }
  65             </span><span class="jsdoc-comment">//if(config.collapsible){
  66             //    this.split.el.on(&quot;dblclick&quot;, this.collapse,  this);
  67             //}
  68         </span><span class="jsdoc-syntax">}
  69         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">this.config.minSize </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;undefined&quot;</span><span class="jsdoc-syntax">){
  70             </span><span class="jsdoc-var">this.split.minSize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.minSize</span><span class="jsdoc-syntax">;
  71         }
  72         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">this.config.maxSize </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;undefined&quot;</span><span class="jsdoc-syntax">){
  73             </span><span class="jsdoc-var">this.split.maxSize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.maxSize</span><span class="jsdoc-syntax">;
  74         }
  75         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.hideWhenEmpty </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.config.hidden </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.config.collapsed</span><span class="jsdoc-syntax">){
  76             </span><span class="jsdoc-var">this.hideSplitter</span><span class="jsdoc-syntax">();
  77         }
  78
  79     },
  80
  81     </span><span class="jsdoc-var">getHMaxSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  82          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cmax </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.maxSize </span><span class="jsdoc-syntax">|| 10000;
  83          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.mgr.getRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;center&quot;</span><span class="jsdoc-syntax">);
  84          </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cmax</span><span class="jsdoc-syntax">, (</span><span class="jsdoc-var">this.el.getWidth</span><span class="jsdoc-syntax">()+</span><span class="jsdoc-var">center.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getWidth</span><span class="jsdoc-syntax">())-</span><span class="jsdoc-var">center.getMinWidth</span><span class="jsdoc-syntax">());
  85     },
  86
  87     </span><span class="jsdoc-var">getVMaxSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  88          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cmax </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.maxSize </span><span class="jsdoc-syntax">|| 10000;
  89          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.mgr.getRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;center&quot;</span><span class="jsdoc-syntax">);
  90          </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cmax</span><span class="jsdoc-syntax">, (</span><span class="jsdoc-var">this.el.getHeight</span><span class="jsdoc-syntax">()+</span><span class="jsdoc-var">center.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getHeight</span><span class="jsdoc-syntax">())-</span><span class="jsdoc-var">center.getMinHeight</span><span class="jsdoc-syntax">());
  91     },
  92
  93     </span><span class="jsdoc-var">onSplitMove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">split</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">){
  94         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;resized&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">);
  95     },
  96
  97     </span><span class="jsdoc-comment">/**
  98      * Returns the {@link Roo.SplitBar} for this region.
  99      * @return {Roo.SplitBar}
 100      */
 101     </span><span class="jsdoc-var">getSplitBar </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 102         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.split</span><span class="jsdoc-syntax">;
 103     },
 104
 105     </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 106         </span><span class="jsdoc-var">this.hideSplitter</span><span class="jsdoc-syntax">();
 107         </span><span class="jsdoc-var">Roo.bootstrap.layout.Split.superclass.hide.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 108     },
 109
 110     </span><span class="jsdoc-var">hideSplitter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 111         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.split</span><span class="jsdoc-syntax">){
 112             </span><span class="jsdoc-var">this.split.el.setLocation</span><span class="jsdoc-syntax">(-2000,-2000);
 113             </span><span class="jsdoc-var">this.split.el.hide</span><span class="jsdoc-syntax">();
 114         }
 115     },
 116
 117     </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 118         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.split</span><span class="jsdoc-syntax">){
 119             </span><span class="jsdoc-var">this.split.el.show</span><span class="jsdoc-syntax">();
 120         }
 121         </span><span class="jsdoc-var">Roo.bootstrap.layout.Split.superclass.show.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 122     },
 123
 124     </span><span class="jsdoc-var">beforeSlide</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 125         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isGecko</span><span class="jsdoc-syntax">){</span><span class="jsdoc-comment">// firefox overflow auto bug workaround
 126             </span><span class="jsdoc-var">this.bodyEl.clip</span><span class="jsdoc-syntax">();
 127             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">) {
 128                 </span><span class="jsdoc-var">this.tabs.bodyEl.clip</span><span class="jsdoc-syntax">();
 129             }
 130             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">){
 131                 </span><span class="jsdoc-var">this.activePanel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.clip</span><span class="jsdoc-syntax">();
 132
 133                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel.beforeSlide</span><span class="jsdoc-syntax">){
 134                     </span><span class="jsdoc-var">this.activePanel.beforeSlide</span><span class="jsdoc-syntax">();
 135                 }
 136             }
 137         }
 138     },
 139
 140     </span><span class="jsdoc-var">afterSlide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 141         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isGecko</span><span class="jsdoc-syntax">){</span><span class="jsdoc-comment">// firefox overflow auto bug workaround
 142             </span><span class="jsdoc-var">this.bodyEl.unclip</span><span class="jsdoc-syntax">();
 143             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">) {
 144                 </span><span class="jsdoc-var">this.tabs.bodyEl.unclip</span><span class="jsdoc-syntax">();
 145             }
 146             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">){
 147                 </span><span class="jsdoc-var">this.activePanel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.unclip</span><span class="jsdoc-syntax">();
 148                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel.afterSlide</span><span class="jsdoc-syntax">){
 149                     </span><span class="jsdoc-var">this.activePanel.afterSlide</span><span class="jsdoc-syntax">();
 150                 }
 151             }
 152         }
 153     },
 154
 155     </span><span class="jsdoc-var">initAutoHide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 156         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoHide </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 157             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.autoHideHd</span><span class="jsdoc-syntax">){
 158                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">st </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.DelayedTask</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.slideIn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 159                 </span><span class="jsdoc-var">this.autoHideHd </span><span class="jsdoc-syntax">= {
 160                     </span><span class="jsdoc-string">&quot;mouseout&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
 161                         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">e.within</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)){
 162                             </span><span class="jsdoc-var">st.delay</span><span class="jsdoc-syntax">(500);
 163                         }
 164                     },
 165                     </span><span class="jsdoc-string">&quot;mouseover&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
 166                         </span><span class="jsdoc-var">st.cancel</span><span class="jsdoc-syntax">();
 167                     },
 168                     </span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this
 169                 </span><span class="jsdoc-syntax">};
 170             }
 171             </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoHideHd</span><span class="jsdoc-syntax">);
 172         }
 173     },
 174
 175     </span><span class="jsdoc-var">clearAutoHide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 176         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoHide </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 177             </span><span class="jsdoc-var">this.el.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseout&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.autoHideHd.mouseout</span><span class="jsdoc-syntax">);
 178             </span><span class="jsdoc-var">this.el.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseover&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.autoHideHd.mouseover</span><span class="jsdoc-syntax">);
 179         }
 180     },
 181
 182     </span><span class="jsdoc-var">clearMonitor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 183         </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.slideInIf</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 184     },
 185
 186     </span><span class="jsdoc-comment">// these names are backwards but not changed for compat
 187     </span><span class="jsdoc-var">slideOut </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 188         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isSlid </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.el.hasActiveFx</span><span class="jsdoc-syntax">()){
 189             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 190         }
 191         </span><span class="jsdoc-var">this.isSlid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 192         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.collapseBtn</span><span class="jsdoc-syntax">){
 193             </span><span class="jsdoc-var">this.collapseBtn.hide</span><span class="jsdoc-syntax">();
 194         }
 195         </span><span class="jsdoc-var">this.closeBtnState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.closeBtn.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'display'</span><span class="jsdoc-syntax">);
 196         </span><span class="jsdoc-var">this.closeBtn.hide</span><span class="jsdoc-syntax">();
 197         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.stickBtn</span><span class="jsdoc-syntax">){
 198             </span><span class="jsdoc-var">this.stickBtn.show</span><span class="jsdoc-syntax">();
 199         }
 200         </span><span class="jsdoc-var">this.el.show</span><span class="jsdoc-syntax">();
 201         </span><span class="jsdoc-var">this.el.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.collapsedEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.getCollapseAnchor</span><span class="jsdoc-syntax">());
 202         </span><span class="jsdoc-var">this.beforeSlide</span><span class="jsdoc-syntax">();
 203         </span><span class="jsdoc-var">this.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">, 10001);
 204         </span><span class="jsdoc-var">this.el.slideIn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getSlideAnchor</span><span class="jsdoc-syntax">(), {
 205             </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 206                 </span><span class="jsdoc-var">this.afterSlide</span><span class="jsdoc-syntax">();
 207                 </span><span class="jsdoc-var">this.initAutoHide</span><span class="jsdoc-syntax">();
 208                 </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.slideInIf</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 209                 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;slideshow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 210             },
 211             </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
 212             </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 213         </span><span class="jsdoc-syntax">});
 214     },
 215
 216     </span><span class="jsdoc-var">afterSlideIn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 217         </span><span class="jsdoc-var">this.clearAutoHide</span><span class="jsdoc-syntax">();
 218         </span><span class="jsdoc-var">this.isSlid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 219         </span><span class="jsdoc-var">this.clearMonitor</span><span class="jsdoc-syntax">();
 220         </span><span class="jsdoc-var">this.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">);
 221         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.collapseBtn</span><span class="jsdoc-syntax">){
 222             </span><span class="jsdoc-var">this.collapseBtn.show</span><span class="jsdoc-syntax">();
 223         }
 224         </span><span class="jsdoc-var">this.closeBtn.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'display'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.closeBtnState</span><span class="jsdoc-syntax">);
 225         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.stickBtn</span><span class="jsdoc-syntax">){
 226             </span><span class="jsdoc-var">this.stickBtn.hide</span><span class="jsdoc-syntax">();
 227         }
 228         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;slidehide&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 229     },
 230
 231     </span><span class="jsdoc-var">slideIn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">){
 232         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isSlid </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.el.hasActiveFx</span><span class="jsdoc-syntax">()){
 233             </span><span class="jsdoc-var">Roo.callback</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">);
 234             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 235         }
 236         </span><span class="jsdoc-var">this.isSlid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 237         </span><span class="jsdoc-var">this.beforeSlide</span><span class="jsdoc-syntax">();
 238         </span><span class="jsdoc-var">this.el.slideOut</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getSlideAnchor</span><span class="jsdoc-syntax">(), {
 239             </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 240                 </span><span class="jsdoc-var">this.el.setLeftTop</span><span class="jsdoc-syntax">(-10000, -10000);
 241                 </span><span class="jsdoc-var">this.afterSlide</span><span class="jsdoc-syntax">();
 242                 </span><span class="jsdoc-var">this.afterSlideIn</span><span class="jsdoc-syntax">();
 243                 </span><span class="jsdoc-var">Roo.callback</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">);
 244             },
 245             </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
 246             </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 247         </span><span class="jsdoc-syntax">});
 248     },
 249
 250     </span><span class="jsdoc-var">slideInIf </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
 251         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">e.within</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">)){
 252             </span><span class="jsdoc-var">this.slideIn</span><span class="jsdoc-syntax">();
 253         }
 254     },
 255
 256     </span><span class="jsdoc-var">animateCollapse </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 257         </span><span class="jsdoc-var">this.beforeSlide</span><span class="jsdoc-syntax">();
 258         </span><span class="jsdoc-var">this.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">, 20000);
 259         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">anchor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getSlideAnchor</span><span class="jsdoc-syntax">();
 260         </span><span class="jsdoc-var">this.el.slideOut</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">anchor</span><span class="jsdoc-syntax">, {
 261             </span><span class="jsdoc-var">callback </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 262                 </span><span class="jsdoc-var">this.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">);
 263                 </span><span class="jsdoc-var">this.collapsedEl.slideIn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">anchor</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">.3</span><span class="jsdoc-syntax">});
 264                 </span><span class="jsdoc-var">this.afterSlide</span><span class="jsdoc-syntax">();
 265                 </span><span class="jsdoc-var">this.el.setLocation</span><span class="jsdoc-syntax">(-10000,-10000);
 266                 </span><span class="jsdoc-var">this.el.hide</span><span class="jsdoc-syntax">();
 267                 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;collapsed&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 268             },
 269             </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
 270             </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 271         </span><span class="jsdoc-syntax">});
 272     },
 273
 274     </span><span class="jsdoc-var">animateExpand </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 275         </span><span class="jsdoc-var">this.beforeSlide</span><span class="jsdoc-syntax">();
 276         </span><span class="jsdoc-var">this.el.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.collapsedEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.getCollapseAnchor</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.getExpandAdj</span><span class="jsdoc-syntax">());
 277         </span><span class="jsdoc-var">this.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">, 20000);
 278         </span><span class="jsdoc-var">this.collapsedEl.hide</span><span class="jsdoc-syntax">({
 279             </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">.1
 280         </span><span class="jsdoc-syntax">});
 281         </span><span class="jsdoc-var">this.el.slideIn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getSlideAnchor</span><span class="jsdoc-syntax">(), {
 282             </span><span class="jsdoc-var">callback </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 283                 </span><span class="jsdoc-var">this.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">);
 284                 </span><span class="jsdoc-var">this.afterSlide</span><span class="jsdoc-syntax">();
 285                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.split</span><span class="jsdoc-syntax">){
 286                     </span><span class="jsdoc-var">this.split.el.show</span><span class="jsdoc-syntax">();
 287                 }
 288                 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;invalidated&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 289                 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;expanded&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 290             },
 291             </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
 292             </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 293         </span><span class="jsdoc-syntax">});
 294     },
 295
 296     </span><span class="jsdoc-var">anchors </span><span class="jsdoc-syntax">: {
 297         </span><span class="jsdoc-string">&quot;west&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">,
 298         </span><span class="jsdoc-string">&quot;east&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">,
 299         </span><span class="jsdoc-string">&quot;north&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">,
 300         </span><span class="jsdoc-string">&quot;south&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;bottom&quot;
 301     </span><span class="jsdoc-syntax">},
 302
 303     </span><span class="jsdoc-var">sanchors </span><span class="jsdoc-syntax">: {
 304         </span><span class="jsdoc-string">&quot;west&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;l&quot;</span><span class="jsdoc-syntax">,
 305         </span><span class="jsdoc-string">&quot;east&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;r&quot;</span><span class="jsdoc-syntax">,
 306         </span><span class="jsdoc-string">&quot;north&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;t&quot;</span><span class="jsdoc-syntax">,
 307         </span><span class="jsdoc-string">&quot;south&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;b&quot;
 308     </span><span class="jsdoc-syntax">},
 309
 310     </span><span class="jsdoc-var">canchors </span><span class="jsdoc-syntax">: {
 311         </span><span class="jsdoc-string">&quot;west&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;tl-tr&quot;</span><span class="jsdoc-syntax">,
 312         </span><span class="jsdoc-string">&quot;east&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;tr-tl&quot;</span><span class="jsdoc-syntax">,
 313         </span><span class="jsdoc-string">&quot;north&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;tl-bl&quot;</span><span class="jsdoc-syntax">,
 314         </span><span class="jsdoc-string">&quot;south&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;bl-tl&quot;
 315     </span><span class="jsdoc-syntax">},
 316
 317     </span><span class="jsdoc-var">getAnchor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 318         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.anchors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">];
 319     },
 320
 321     </span><span class="jsdoc-var">getCollapseAnchor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 322         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.canchors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">];
 323     },
 324
 325     </span><span class="jsdoc-var">getSlideAnchor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 326         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.sanchors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">];
 327     },
 328
 329     </span><span class="jsdoc-var">getAlignAdj </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 330         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cmargins</span><span class="jsdoc-syntax">;
 331         </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">){
 332             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;west&quot;</span><span class="jsdoc-syntax">:
 333                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[0, 0];
 334             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 335             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;east&quot;</span><span class="jsdoc-syntax">:
 336                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[0, 0];
 337             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 338             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;north&quot;</span><span class="jsdoc-syntax">:
 339                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[0, 0];
 340             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 341             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;south&quot;</span><span class="jsdoc-syntax">:
 342                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[0, 0];
 343             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 344         }
 345     },
 346
 347     </span><span class="jsdoc-var">getExpandAdj </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 348         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.collapsedEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cmargins</span><span class="jsdoc-syntax">;
 349         </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">){
 350             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;west&quot;</span><span class="jsdoc-syntax">:
 351                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[-(</span><span class="jsdoc-var">cm.right</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">c.getWidth</span><span class="jsdoc-syntax">()+</span><span class="jsdoc-var">cm.left</span><span class="jsdoc-syntax">), 0];
 352             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 353             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;east&quot;</span><span class="jsdoc-syntax">:
 354                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">cm.right</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">c.getWidth</span><span class="jsdoc-syntax">()+</span><span class="jsdoc-var">cm.left</span><span class="jsdoc-syntax">, 0];
 355             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 356             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;north&quot;</span><span class="jsdoc-syntax">:
 357                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[0, -(</span><span class="jsdoc-var">cm.top</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">cm.bottom</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">c.getHeight</span><span class="jsdoc-syntax">())];
 358             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 359             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;south&quot;</span><span class="jsdoc-syntax">:
 360                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[0, </span><span class="jsdoc-var">cm.top</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">cm.bottom</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">c.getHeight</span><span class="jsdoc-syntax">()];
 361             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 362         }
 363     }
 364 });</span></code></body></html>