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

   1 <html><head><title>Roo/NestedLayoutPanel.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">
   2
   3 <span class="jsdoc-comment">/**
   4  * @class Roo.NestedLayoutPanel
   5  * @extends Roo.ContentPanel
   6  * @parent Roo.BorderLayout Roo.LayoutDialog builder
   7  * @cfg {Roo.BorderLayout} layout   [required] The layout for this panel
   8  *
   9  *
  10  * @constructor
  11  * Create a new NestedLayoutPanel.
  12  *
  13  *
  14  * @param {Roo.BorderLayout} layout [required] The layout for this panel
  15  * @param {String/Object} config A string to set only the title or a config object
  16  */
  17 </span><span class="jsdoc-var">Roo.NestedLayoutPanel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">layout</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">)
  18 {
  19     </span><span class="jsdoc-comment">// construct with only one argument..
  20     /* FIXME - implement nicer consturctors
  21     if (layout.layout) {
  22         config = layout;
  23         layout = config.layout;
  24         delete config.layout;
  25     }
  26     if (layout.xtype &amp;&amp; !layout.getEl) {
  27         // then layout needs constructing..
  28         layout = Roo.factory(layout, Roo);
  29     }
  30     */
  31
  32
  33     </span><span class="jsdoc-var">Roo.NestedLayoutPanel.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">layout.getEl</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  34
  35     </span><span class="jsdoc-var">layout.monitorWindowResize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// turn off autosizing
  36     </span><span class="jsdoc-var">this.layout </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">layout</span><span class="jsdoc-syntax">;
  37     </span><span class="jsdoc-var">this.layout.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-layout-nested-layout&quot;</span><span class="jsdoc-syntax">);
  38
  39
  40
  41
  42 };
  43
  44 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.NestedLayoutPanel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.ContentPanel</span><span class="jsdoc-syntax">, {
  45
  46     </span><span class="jsdoc-var">layout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  47
  48     </span><span class="jsdoc-var">setSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">){
  49         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.ignoreResize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">)){
  50             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustForComponents</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
  51             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.layout.getEl</span><span class="jsdoc-syntax">();
  52             </span><span class="jsdoc-var">el.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">size.height</span><span class="jsdoc-syntax">);
  53             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">touch </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.dom.offsetWidth</span><span class="jsdoc-syntax">;
  54             </span><span class="jsdoc-var">this.layout.layout</span><span class="jsdoc-syntax">();
  55             </span><span class="jsdoc-comment">// ie requires a double layout on the first pass
  56             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.initialized</span><span class="jsdoc-syntax">){
  57                 </span><span class="jsdoc-var">this.initialized </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
  58                 </span><span class="jsdoc-var">this.layout.layout</span><span class="jsdoc-syntax">();
  59             }
  60         }
  61     },
  62
  63     </span><span class="jsdoc-comment">// activate all subpanels if not currently active..
  64
  65     </span><span class="jsdoc-var">setActiveState </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">active</span><span class="jsdoc-syntax">){
  66         </span><span class="jsdoc-var">this.active </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">active</span><span class="jsdoc-syntax">;
  67         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">active</span><span class="jsdoc-syntax">){
  68             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;deactivate&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  69             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
  70         }
  71
  72         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;activate&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  73         </span><span class="jsdoc-comment">// not sure if this should happen before or after..
  74         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">) {
  75             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// should not happen..
  76         </span><span class="jsdoc-syntax">}
  77         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">reg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
  78         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">this.layout.regions</span><span class="jsdoc-syntax">) {
  79             </span><span class="jsdoc-var">reg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.layout.getRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">);
  80             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">reg.getActivePanel</span><span class="jsdoc-syntax">()) {
  81                 </span><span class="jsdoc-comment">//reg.showPanel(reg.getActivePanel()); // force it to activate..
  82                 </span><span class="jsdoc-var">reg.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">reg.getActivePanel</span><span class="jsdoc-syntax">());
  83                 </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
  84             }
  85             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">reg.panels.length</span><span class="jsdoc-syntax">) {
  86                 </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
  87             }
  88             </span><span class="jsdoc-var">reg.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">reg.getPanel</span><span class="jsdoc-syntax">(0));
  89         }
  90
  91
  92
  93
  94     },
  95
  96     </span><span class="jsdoc-comment">/**
  97      * Returns the nested BorderLayout for this panel
  98      * @return {Roo.BorderLayout}
  99      */
 100     </span><span class="jsdoc-var">getLayout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 101         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">;
 102     },
 103
 104      </span><span class="jsdoc-comment">/**
 105      * Adds a xtype elements to the layout of the nested panel
 106      * &lt;pre&gt;&lt;code&gt;
 107
 108 panel.addxtype({
 109        xtype : 'ContentPanel',
 110        region: 'west',
 111        items: [ .... ]
 112    }
 113 );
 114
 115 panel.addxtype({
 116         xtype : 'NestedLayoutPanel',
 117         region: 'west',
 118         layout: {
 119            center: { },
 120            west: { }
 121         },
 122         items : [ ... list of content panels or nested layout panels.. ]
 123    }
 124 );
 125 &lt;/code&gt;&lt;/pre&gt;
 126      * @param {Object} cfg Xtype definition of item to add.
 127      */
 128     </span><span class="jsdoc-var">addxtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">) {
 129         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.layout.addxtype</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">);
 130
 131     }
 132 });
 133 </span></code></body></html>