docs/default.css
[roojs1] / docs / symbols / src / Roo_bootstrap_layout_Manager.js.html
1 <html><head><title>../roojs1/Roo/bootstrap/layout/Manager.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  * @class Roo.bootstrap.layout.Manager
14  * @extends Roo.bootstrap.Component
15  * Base class for layout managers.
16  */
17 </span><span class="jsdoc-var">Roo.bootstrap.layout.Manager </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">)
18 {
19     </span><span class="jsdoc-var">Roo.bootstrap.layout.Manager.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
20     </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config.el</span><span class="jsdoc-syntax">);
21     </span><span class="jsdoc-comment">// ie scrollbar fix
22     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document.body </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">config.allowScroll</span><span class="jsdoc-syntax">){
23         </span><span class="jsdoc-var">document.body.scroll </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;no&quot;</span><span class="jsdoc-syntax">;
24     }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">document.body </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.el.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'static'</span><span class="jsdoc-syntax">){
25         </span><span class="jsdoc-var">this.el.position</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'relative'</span><span class="jsdoc-syntax">);
26     }
27     
28     </span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.id</span><span class="jsdoc-syntax">;
29     </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;roo-layout-container&quot;</span><span class="jsdoc-syntax">);
30     </span><span class="jsdoc-comment">/** false to disable window resize monitoring @type Boolean */
31     </span><span class="jsdoc-var">this.monitorWindowResize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
32     </span><span class="jsdoc-var">this.regions </span><span class="jsdoc-syntax">= {};
33     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
34         </span><span class="jsdoc-comment">/**
35          * @event layout
36          * Fires when a layout is performed. 
37          * @param {Roo.LayoutManager} this
38          */
39         </span><span class="jsdoc-string">&quot;layout&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
40         </span><span class="jsdoc-comment">/**
41          * @event regionresized
42          * Fires when the user resizes a region. 
43          * @param {Roo.LayoutRegion} region The resized region
44          * @param {Number} newSize The new size (width for east/west, height for north/south)
45          */
46         </span><span class="jsdoc-string">&quot;regionresized&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
47         </span><span class="jsdoc-comment">/**
48          * @event regioncollapsed
49          * Fires when a region is collapsed. 
50          * @param {Roo.LayoutRegion} region The collapsed region
51          */
52         </span><span class="jsdoc-string">&quot;regioncollapsed&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
53         </span><span class="jsdoc-comment">/**
54          * @event regionexpanded
55          * Fires when a region is expanded.  
56          * @param {Roo.LayoutRegion} region The expanded region
57          */
58         </span><span class="jsdoc-string">&quot;regionexpanded&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
59     </span><span class="jsdoc-syntax">});
60     </span><span class="jsdoc-var">this.updating </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
61     </span><span class="jsdoc-var">Roo.EventManager.onWindowResize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.onWindowResize</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
62 };
63
64 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.layout.Manager</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">, {
65     
66     
67     </span><span class="jsdoc-var">regions </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
68     
69     </span><span class="jsdoc-var">monitorWindowResize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
70     
71     
72     </span><span class="jsdoc-var">updating </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
73     
74     </span><span class="jsdoc-comment">/**
75      * Returns true if this layout is currently being updated
76      * @return {Boolean}
77      */
78     </span><span class="jsdoc-var">isUpdating </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
79         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.updating</span><span class="jsdoc-syntax">; 
80     },
81     
82     </span><span class="jsdoc-comment">/**
83      * Suspend the LayoutManager from doing auto-layouts while
84      * making multiple add or remove calls
85      */
86     </span><span class="jsdoc-var">beginUpdate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
87         </span><span class="jsdoc-var">this.updating </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;    
88     },
89     
90     </span><span class="jsdoc-comment">/**
91      * Restore auto-layouts and optionally disable the manager from performing a layout
92      * @param {Boolean} noLayout true to disable a layout update 
93      */
94     </span><span class="jsdoc-var">endUpdate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">noLayout</span><span class="jsdoc-syntax">){
95         </span><span class="jsdoc-var">this.updating </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
96         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">noLayout</span><span class="jsdoc-syntax">){
97             </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
98         }    
99     },
100     
101     </span><span class="jsdoc-var">layout</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
102         </span><span class="jsdoc-comment">// abstract...
103     </span><span class="jsdoc-syntax">},
104     
105     </span><span class="jsdoc-var">onRegionResized </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">region</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">){
106         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;regionresized&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">region</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">);
107         </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
108     },
109     
110     </span><span class="jsdoc-var">onRegionCollapsed </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">region</span><span class="jsdoc-syntax">){
111         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;regioncollapsed&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">region</span><span class="jsdoc-syntax">);
112     },
113     
114     </span><span class="jsdoc-var">onRegionExpanded </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">region</span><span class="jsdoc-syntax">){
115         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;regionexpanded&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">region</span><span class="jsdoc-syntax">);
116     },
117         
118     </span><span class="jsdoc-comment">/**
119      * Returns the size of the current view. This method normalizes document.body and element embedded layouts and
120      * performs box-model adjustments.
121      * @return {Object} The size as an object {width: (the width), height: (the height)}
122      */
123     </span><span class="jsdoc-var">getViewSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
124     {
125         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">;
126         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">){
127             </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getSize</span><span class="jsdoc-syntax">();
128         }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
129             </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">()};
130         }
131         </span><span class="jsdoc-var">size.width </span><span class="jsdoc-syntax">-= </span><span class="jsdoc-var">this.el.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">)-</span><span class="jsdoc-var">this.el.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">);
132         </span><span class="jsdoc-var">size.height </span><span class="jsdoc-syntax">-= </span><span class="jsdoc-var">this.el.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">)-</span><span class="jsdoc-var">this.el.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">);
133         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">;
134     },
135     
136     </span><span class="jsdoc-comment">/**
137      * Returns the Element this layout is bound to.
138      * @return {Roo.Element}
139      */
140     </span><span class="jsdoc-var">getEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
141         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
142     },
143     
144     </span><span class="jsdoc-comment">/**
145      * Returns the specified region.
146      * @param {String} target The region key ('center', 'north', 'south', 'east' or 'west')
147      * @return {Roo.LayoutRegion}
148      */
149     </span><span class="jsdoc-var">getRegion </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">){
150         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.regions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">target.toLowerCase</span><span class="jsdoc-syntax">()];
151     },
152     
153     </span><span class="jsdoc-var">onWindowResize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
154         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.monitorWindowResize</span><span class="jsdoc-syntax">){
155             </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
156         }
157     }
158 });</span></code></body></html>