1 <html><head><title>../roojs1/Roo/bootstrap/LayoutMasonry.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">/**
4 * http://masonry.desandro.com
6 * The idea is to render all the bricks based on vertical width...
8 * The original code extends 'outlayer' - we might need to use that....
14 * @class Roo.bootstrap.LayoutMasonry
15 * @extends Roo.bootstrap.Component
16 * Bootstrap Layout Masonry class
19 * Create a new Element
20 * @param {Object} config The config object
23 </span><span class="jsdoc-var">Roo.bootstrap.LayoutMasonry </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">){
24 </span><span class="jsdoc-var">Roo.bootstrap.LayoutMasonry.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">);
26 </span><span class="jsdoc-var">this.bricks </span><span class="jsdoc-syntax">= [];
30 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.LayoutMasonry</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">, {
32 </span><span class="jsdoc-comment">/**
33 * @cfg {Boolean} isLayoutInstant = no animation?
35 </span><span class="jsdoc-var">isLayoutInstant </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// needed?
38 * @cfg {Number} boxWidth width of the columns
40 </span><span class="jsdoc-var">boxWidth </span><span class="jsdoc-syntax">: 450,
42 </span><span class="jsdoc-comment">/**
43 * @cfg {Number} padWidth padding below box..
45 </span><span class="jsdoc-var">padWidth </span><span class="jsdoc-syntax">: 10,
47 </span><span class="jsdoc-comment">/**
48 * @cfg {Number} gutter gutter width..
50 </span><span class="jsdoc-var">gutter </span><span class="jsdoc-syntax">: 10,
52 </span><span class="jsdoc-comment">/**
53 * @cfg {Boolean} isAutoInitial defalut true
55 </span><span class="jsdoc-var">isAutoInitial </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
57 </span><span class="jsdoc-var">containerWidth</span><span class="jsdoc-syntax">: 0,
59 </span><span class="jsdoc-comment">/**
60 * @cfg {Boolean} isHorizontal defalut false
62 </span><span class="jsdoc-var">isHorizontal </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
64 </span><span class="jsdoc-var">currentSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
66 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
68 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
70 </span><span class="jsdoc-var">bricks</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">//CompositeElement
72 </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">: 1,
74 </span><span class="jsdoc-var">_isLayoutInited </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
76 </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
78 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
79 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.tag</span><span class="jsdoc-syntax">,
80 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'blog-masonary-wrapper ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">,
81 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: {
82 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'mas-boxes masonary'
83 </span><span class="jsdoc-syntax">}
86 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
89 </span><span class="jsdoc-var">getChildContainer</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( )
91 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.boxesEl</span><span class="jsdoc-syntax">) {
92 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.boxesEl</span><span class="jsdoc-syntax">;
95 </span><span class="jsdoc-var">this.boxesEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.mas-boxes'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
97 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.boxesEl</span><span class="jsdoc-syntax">;
101 </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
103 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
105 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isAutoInitial</span><span class="jsdoc-syntax">){
106 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hook children rendered'</span><span class="jsdoc-syntax">);
107 </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'childrenrendered'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
108 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'children rendered'</span><span class="jsdoc-syntax">);
109 </span><span class="jsdoc-var">_this.initial</span><span class="jsdoc-syntax">();
110 } ,</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
114 </span><span class="jsdoc-var">initial </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
116 </span><span class="jsdoc-var">this.currentSize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
118 </span><span class="jsdoc-var">Roo.EventManager.onWindowResize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.resize</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
120 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isAutoInitial</span><span class="jsdoc-syntax">){
121 </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
122 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
125 </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
127 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
128 </span><span class="jsdoc-comment">//this.layout.defer(500,this);
130 </span><span class="jsdoc-syntax">},
132 </span><span class="jsdoc-var">resize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
134 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'resize'</span><span class="jsdoc-syntax">);
136 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
138 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.currentSize.width </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">cs.width </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">this.currentSize.x </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">cs.x </span><span class="jsdoc-syntax">) {
139 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"no change in with or X"</span><span class="jsdoc-syntax">);
140 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
143 </span><span class="jsdoc-var">this.currentSize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">;
145 </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
148 </span><span class="jsdoc-var">layout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
150 </span><span class="jsdoc-var">this._resetLayout</span><span class="jsdoc-syntax">();
152 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.isLayoutInstant </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.isLayoutInstant </span><span class="jsdoc-syntax">: !</span><span class="jsdoc-var">this._isLayoutInited</span><span class="jsdoc-syntax">;
154 </span><span class="jsdoc-var">this.layoutItems</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">);
156 </span><span class="jsdoc-var">this._isLayoutInited </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
160 </span><span class="jsdoc-var">layoutItems </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">)
162 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">([], </span><span class="jsdoc-var">this.bricks</span><span class="jsdoc-syntax">);
164 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isHorizontal</span><span class="jsdoc-syntax">){
165 </span><span class="jsdoc-var">this._horizontalLayoutItems</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">);
166 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
169 </span><span class="jsdoc-var">this._verticalLayoutItems</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">);
173 </span><span class="jsdoc-var">_verticalLayoutItems </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant</span><span class="jsdoc-syntax">)
175 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( !</span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">items.length </span><span class="jsdoc-syntax">) {
176 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
179 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isHorizontal</span><span class="jsdoc-syntax">){
181 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">items.length </span><span class="jsdoc-syntax">< 3){
182 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
185 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">eItems </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">items.slice</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">items.length </span><span class="jsdoc-syntax">- 3, </span><span class="jsdoc-var">items.length</span><span class="jsdoc-syntax">);
186 </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">items.slice</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">items.length </span><span class="jsdoc-syntax">- 3);
190 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">queue </span><span class="jsdoc-syntax">= [];
192 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">= [];
193 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= 0;
195 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">items</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">){
197 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">item.intSize </span><span class="jsdoc-syntax">> 3){
198 </span><span class="jsdoc-var">queue.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
199 </span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">= [];
200 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= 0;
203 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">item.intSize</span><span class="jsdoc-syntax">;
205 </span><span class="jsdoc-var">box.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
207 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">items.length </span><span class="jsdoc-syntax">- 1){
208 </span><span class="jsdoc-var">queue.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
209 </span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">= [];
210 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= 0;
213 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
215 </span><span class="jsdoc-var">this._processVerticalLayoutQueue</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">queue</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">);
218 </span><span class="jsdoc-var">_horizontalLayoutItems </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant</span><span class="jsdoc-syntax">)
220 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( !</span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">items.length </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">items.length </span><span class="jsdoc-syntax">< 3) {
221 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
224 </span><span class="jsdoc-var">items.reverse</span><span class="jsdoc-syntax">();
226 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">eItems </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">items.slice</span><span class="jsdoc-syntax">(0, 3);
228 </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">items.slice</span><span class="jsdoc-syntax">(3, </span><span class="jsdoc-var">items.length</span><span class="jsdoc-syntax">);
230 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
232 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.x</span><span class="jsdoc-syntax">;
234 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.right </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">] - </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">] - </span><span class="jsdoc-var">this.gutter </span><span class="jsdoc-syntax">* 2;
235 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">;
237 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">queue </span><span class="jsdoc-syntax">= [];
239 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">= [];
240 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= 0;
241 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hit_end </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
243 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">items</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">){
245 </span><span class="jsdoc-var">item.el.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">);
246 </span><span class="jsdoc-var">item.el.show</span><span class="jsdoc-syntax">();
248 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hit_end</span><span class="jsdoc-syntax">){
249 </span><span class="jsdoc-var">item.el.hide</span><span class="jsdoc-syntax">();
250 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
253 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">queue.length </span><span class="jsdoc-syntax">>= </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">- 1){
254 </span><span class="jsdoc-var">item.el.hide</span><span class="jsdoc-syntax">();
255 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
258 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">item.intSize </span><span class="jsdoc-syntax">> 3){
259 </span><span class="jsdoc-var">queue.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
260 </span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">= [];
261 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= 0;
262 </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">;
265 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">item.size</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">item.el.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'lr'</span><span class="jsdoc-syntax">);
267 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">);
269 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">minX</span><span class="jsdoc-syntax">){
270 </span><span class="jsdoc-var">item.el.hide</span><span class="jsdoc-syntax">();
271 </span><span class="jsdoc-var">hit_end </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
272 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
275 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">item.intSize</span><span class="jsdoc-syntax">;
277 </span><span class="jsdoc-var">box.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
279 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
281 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box.length</span><span class="jsdoc-syntax">){
282 </span><span class="jsdoc-var">queue.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
285 </span><span class="jsdoc-var">this._processHorizontalLayoutQueue</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">queue</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">eItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">);
288 </span><span class="jsdoc-comment">/** Sets position of item in DOM
289 * @param {Element} item
290 * @param {Number} x - horizontal position
291 * @param {Number} y - vertical position
292 * @param {Boolean} isInstant - disables transitions
294 </span><span class="jsdoc-var">_processVerticalLayoutQueue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">queue</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">)
296 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
297 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.x</span><span class="jsdoc-syntax">;
298 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.y</span><span class="jsdoc-syntax">;
299 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maxY </span><span class="jsdoc-syntax">= [];
301 </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
302 </span><span class="jsdoc-var">maxY</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">pos.y</span><span class="jsdoc-syntax">;
305 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">queue</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">){
307 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">% </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">;
309 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">){
311 </span><span class="jsdoc-var">b.el.position</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'absolute'</span><span class="jsdoc-syntax">);
313 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">b.size</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">b.el.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'lr'</span><span class="jsdoc-syntax">);
315 </span><span class="jsdoc-var">b.el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
317 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b.square</span><span class="jsdoc-syntax">){
318 </span><span class="jsdoc-var">b.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
321 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
323 </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
324 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxY</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] >= </span><span class="jsdoc-var">maxY</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">]){
325 </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
328 </span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">;
331 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">* (</span><span class="jsdoc-var">this.colWidth </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.padWidth</span><span class="jsdoc-syntax">);
333 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">maxY</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">];
335 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= [];
337 </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box.length</span><span class="jsdoc-syntax">){
338 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">1 :
339 </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVerticalOneBoxColPositions</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
340 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
341 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">2 :
342 </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVerticalTwoBoxColPositions</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
343 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
344 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">3 :
345 </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVerticalThreeBoxColPositions</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
346 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
347 </span><span class="jsdoc-keyword">default </span><span class="jsdoc-syntax">:
348 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
351 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">){
353 </span><span class="jsdoc-var">b.el.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.y</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
355 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sz </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">b.el.getSize</span><span class="jsdoc-syntax">();
357 </span><span class="jsdoc-var">maxY</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxY</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.y </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">sz.height </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.padWidth</span><span class="jsdoc-syntax">);
359 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
361 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
363 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mY </span><span class="jsdoc-syntax">= 0;
365 </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
366 </span><span class="jsdoc-var">mY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxY</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
369 </span><span class="jsdoc-var">this.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mY</span><span class="jsdoc-syntax">);
373 </span><span class="jsdoc-var">_processHorizontalLayoutQueue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">queue</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">eItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">)
375 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
377 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.x</span><span class="jsdoc-syntax">;
378 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.y</span><span class="jsdoc-syntax">;
380 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.right </span><span class="jsdoc-syntax">- (</span><span class="jsdoc-var">pos.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.containerWidth</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.padWidth</span><span class="jsdoc-syntax">;
381 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maxY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">pos.bottom</span><span class="jsdoc-syntax">;
383 </span><span class="jsdoc-var">this._processHorizontalEndItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant</span><span class="jsdoc-syntax">);
385 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">] - </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">] - </span><span class="jsdoc-var">this.gutter </span><span class="jsdoc-syntax">* 2;
387 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">queue</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">){
389 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">){
391 </span><span class="jsdoc-var">b.el.position</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'absolute'</span><span class="jsdoc-syntax">);
393 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">b.size</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">b.el.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'lr'</span><span class="jsdoc-syntax">);
395 </span><span class="jsdoc-var">b.el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
397 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b.square</span><span class="jsdoc-syntax">){
398 </span><span class="jsdoc-var">b.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
401 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
403 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">box.length</span><span class="jsdoc-syntax">){
404 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
407 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= [];
409 </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box.length</span><span class="jsdoc-syntax">){
410 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">1 :
411 </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHorizontalOneBoxColPositions</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
412 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
413 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">2 :
414 </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHorizontalTwoBoxColPositions</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
415 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
416 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">3 :
417 </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHorizontalThreeBoxColPositions</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">);
418 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
419 </span><span class="jsdoc-keyword">default </span><span class="jsdoc-syntax">:
420 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
423 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">){
425 </span><span class="jsdoc-var">b.el.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.y</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
427 </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">kk</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.x </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">);
429 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
431 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
435 </span><span class="jsdoc-var">_processHorizontalEndItem </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant</span><span class="jsdoc-syntax">)
437 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">){
439 </span><span class="jsdoc-var">b.size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">;
440 </span><span class="jsdoc-var">b.intSize </span><span class="jsdoc-syntax">= 1;
442 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">== 0) {
443 </span><span class="jsdoc-var">b.size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">;
444 </span><span class="jsdoc-var">b.intSize </span><span class="jsdoc-syntax">= 2;
447 </span><span class="jsdoc-var">b.el.position</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'absolute'</span><span class="jsdoc-syntax">);
449 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">b.size</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">b.el.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'lr'</span><span class="jsdoc-syntax">);
451 </span><span class="jsdoc-var">b.el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
453 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b.square</span><span class="jsdoc-syntax">){
454 </span><span class="jsdoc-var">b.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
457 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
459 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">positions </span><span class="jsdoc-syntax">= [];
461 </span><span class="jsdoc-var">positions.push</span><span class="jsdoc-syntax">({
462 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">],
463 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY
464 </span><span class="jsdoc-syntax">});
466 </span><span class="jsdoc-var">positions.push</span><span class="jsdoc-syntax">({
467 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">],
468 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter
469 </span><span class="jsdoc-syntax">});
471 </span><span class="jsdoc-var">positions.push</span><span class="jsdoc-syntax">({
472 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">] - </span><span class="jsdoc-var">this.gutter </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">],
473 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY
474 </span><span class="jsdoc-syntax">});
476 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">){
478 </span><span class="jsdoc-var">b.el.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">positions</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.y</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
480 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sz </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">b.el.getSize</span><span class="jsdoc-syntax">();
482 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
486 </span><span class="jsdoc-var">_resetLayout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
488 </span><span class="jsdoc-var">this.measureColumns</span><span class="jsdoc-syntax">();
491 </span><span class="jsdoc-var">measureColumns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
493 </span><span class="jsdoc-var">this.getContainerWidth</span><span class="jsdoc-syntax">();
495 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.containerWidth </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">this.boxWidth</span><span class="jsdoc-syntax">){
496 </span><span class="jsdoc-var">this.boxWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.containerWidth
497 </span><span class="jsdoc-syntax">}
499 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">boxWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.boxWidth </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.padWidth</span><span class="jsdoc-syntax">;
501 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">containerWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.containerWidth</span><span class="jsdoc-syntax">;
503 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">containerWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">boxWidth</span><span class="jsdoc-syntax">);
505 </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">cols</span><span class="jsdoc-syntax">, 1 );
507 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">totalBoxWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">boxWidth</span><span class="jsdoc-syntax">;
509 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">avail </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">containerWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">totalBoxWidth</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">);
511 </span><span class="jsdoc-var">this.colWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.boxWidth </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">avail</span><span class="jsdoc-syntax">;
513 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xsWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.colWidth </span><span class="jsdoc-syntax">- (</span><span class="jsdoc-var">this.gutter </span><span class="jsdoc-syntax">* 2)) / 3);
515 </span><span class="jsdoc-var">this.boxColWidth </span><span class="jsdoc-syntax">= {
516 </span><span class="jsdoc-var">xs </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xsWidth</span><span class="jsdoc-syntax">,
517 </span><span class="jsdoc-var">sm </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.colWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">xsWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">,
518 </span><span class="jsdoc-var">md </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.colWidth
519 </span><span class="jsdoc-syntax">};
521 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isHorizontal</span><span class="jsdoc-syntax">){
522 </span><span class="jsdoc-var">this.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.colWidth</span><span class="jsdoc-syntax">);
527 </span><span class="jsdoc-var">getContainerWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
529 </span><span class="jsdoc-var">this.containerWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.width</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">//maybe use getComputedWidth
530 </span><span class="jsdoc-syntax">},
532 </span><span class="jsdoc-var">getVerticalOneBoxColPositions </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">)
534 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= [];
536 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rand </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Math.random</span><span class="jsdoc-syntax">() * (4 - </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.intSize</span><span class="jsdoc-syntax">));
538 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
539 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">rand</span><span class="jsdoc-syntax">,
540 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
541 </span><span class="jsdoc-syntax">});
543 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">;
546 </span><span class="jsdoc-var">getVerticalTwoBoxColPositions </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">)
548 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= [];
550 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.size </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'xs' </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.size </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">){
552 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
553 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">,
554 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
555 </span><span class="jsdoc-syntax">});
557 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
558 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">) * 2,
559 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
560 </span><span class="jsdoc-syntax">});
564 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.size </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'xs' </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.size </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">){
566 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
567 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">,
568 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">+ ((</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">()) * </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Math.random</span><span class="jsdoc-syntax">() * 2))
571 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
572 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">,
573 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
574 </span><span class="jsdoc-syntax">});
578 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.size </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'sm' </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.size </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">){
580 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
581 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">,
582 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
583 </span><span class="jsdoc-syntax">});
585 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
586 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">,
587 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">+ ((</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">()) * </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Math.random</span><span class="jsdoc-syntax">() * 2))
592 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">;
596 </span><span class="jsdoc-var">getVerticalThreeBoxColPositions </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">)
598 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= [];
600 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
601 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">,
602 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
603 </span><span class="jsdoc-syntax">});
605 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
606 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">,
607 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
608 </span><span class="jsdoc-syntax">});
610 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
611 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">,
612 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">y
613 </span><span class="jsdoc-syntax">});
615 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">;
618 </span><span class="jsdoc-var">getHorizontalOneBoxColPositions </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">)
620 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= [];
622 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rand </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Math.random</span><span class="jsdoc-syntax">() * (4 - </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.intSize</span><span class="jsdoc-syntax">));
624 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
625 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getWidth</span><span class="jsdoc-syntax">(),
626 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.boxColWidth</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">rand
627 </span><span class="jsdoc-syntax">});
629 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">;
632 </span><span class="jsdoc-var">getHorizontalTwoBoxColPositions </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">)
634 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= [];
636 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
637 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getWidth</span><span class="jsdoc-syntax">(),
638 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY
639 </span><span class="jsdoc-syntax">});
641 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
642 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.el.getWidth</span><span class="jsdoc-syntax">(),
643 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">this.gutter
644 </span><span class="jsdoc-syntax">});
646 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">;
650 </span><span class="jsdoc-var">getHorizontalThreeBoxColPositions </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">)
652 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= [];
654 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
655 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getWidth</span><span class="jsdoc-syntax">(),
656 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY
657 </span><span class="jsdoc-syntax">});
659 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
660 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.el.getWidth</span><span class="jsdoc-syntax">(),
661 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.gutter
662 </span><span class="jsdoc-syntax">});
664 </span><span class="jsdoc-var">pos.push</span><span class="jsdoc-syntax">({
665 </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[2]</span><span class="jsdoc-var">.el.getWidth</span><span class="jsdoc-syntax">(),
666 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.el.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.gutter </span><span class="jsdoc-syntax">* 2
669 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">;
677 </span></code></body></html>