projects / roojs1 / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Fix #5654 - roojspacker - get it working as a doc tool...
[roojs1] / docs.old / symbols / src / Roo_bootstrap_LayoutMasonryAuto.js.html
diff --git a/docs.old/symbols/src/Roo_bootstrap_LayoutMasonryAuto.js.html b/docs.old/symbols/src/Roo_bootstrap_LayoutMasonryAuto.js.html
new file mode 100644 (file)
index 0000000..e9915e3
--- /dev/null
+++ b/docs.old/symbols/src/Roo_bootstrap_LayoutMasonryAuto.js.html
@@ -0,0 +1,501 @@
+<html><head><title>../roojs1/Roo/bootstrap/LayoutMasonryAuto.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">/**
+ *
+ * This is based on 
+ * http://masonry.desandro.com
+ *
+ * The idea is to render all the bricks based on vertical width...
+ *
+ * The original code extends 'outlayer' - we might need to use that....
+ * 
+ */
+
+
+/**
+ * @class Roo.bootstrap.LayoutMasonryAuto
+ * @extends Roo.bootstrap.Component
+ * Bootstrap Layout Masonry class
+ * 
+ * @constructor
+ * Create a new Element
+ * @param {Object} config The config object
+ */
+
+</span><span class="jsdoc-var">Roo.bootstrap.LayoutMasonryAuto </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">){
+    </span><span class="jsdoc-var">Roo.bootstrap.LayoutMasonryAuto.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">);
+};
+
+</span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.LayoutMasonryAuto</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
+    
+      </span><span class="jsdoc-comment">/**
+     * @cfg {Boolean} isFitWidth  - resize the width..
+     */   
+    </span><span class="jsdoc-var">isFitWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-comment">// options..
+    /**
+     * @cfg {Boolean} isOriginLeft = left align?
+     */   
+    </span><span class="jsdoc-var">isOriginLeft </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-comment">/**
+     * @cfg {Boolean} isOriginTop = top align?
+     */   
+    </span><span class="jsdoc-var">isOriginTop </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-comment">/**
+     * @cfg {Boolean} isLayoutInstant = no animation?
+     */   
+    </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?
+    /**
+     * @cfg {Boolean} isResizingContainer = not sure if this is used..
+     */   
+    </span><span class="jsdoc-var">isResizingContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-comment">/**
+     * @cfg {Number} columnWidth  width of the columns 
+     */   
+    
+    </span><span class="jsdoc-var">columnWidth </span><span class="jsdoc-syntax">: 0,
+    
+    </span><span class="jsdoc-comment">/**
+     * @cfg {Number} maxCols maximum number of columns
+     */   
+    
+    </span><span class="jsdoc-var">maxCols</span><span class="jsdoc-syntax">: 0,
+    </span><span class="jsdoc-comment">/**
+     * @cfg {Number} padHeight padding below box..
+     */   
+    
+    </span><span class="jsdoc-var">padHeight </span><span class="jsdoc-syntax">: 10, 
+    
+    </span><span class="jsdoc-comment">/**
+     * @cfg {Boolean} isAutoInitial defalut true
+     */   
+    
+    </span><span class="jsdoc-var">isAutoInitial </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, 
+    
+    </span><span class="jsdoc-comment">// private?
+    </span><span class="jsdoc-var">gutter </span><span class="jsdoc-syntax">: 0,
+    
+    </span><span class="jsdoc-var">containerWidth</span><span class="jsdoc-syntax">: 0,
+    </span><span class="jsdoc-var">initialColumnWidth </span><span class="jsdoc-syntax">: 0,
+    </span><span class="jsdoc-var">currentSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
+    
+    </span><span class="jsdoc-var">colYs </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// array.
+    </span><span class="jsdoc-var">maxY </span><span class="jsdoc-syntax">: 0,
+    </span><span class="jsdoc-var">padWidth</span><span class="jsdoc-syntax">: 10,
+    
+    
+    </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
+    </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
+    </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">: 0, </span><span class="jsdoc-comment">// array?
+    // element : null, // wrapped now this.el
+    </span><span class="jsdoc-var">_isLayoutInited </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, 
+    
+    
+    </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
+            </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.tag</span><span class="jsdoc-syntax">,
+            </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">,
+            </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: {
+                </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'mas-boxes masonary'
+            </span><span class="jsdoc-syntax">}
+        };
+        
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
+    },
+    
+    </span><span class="jsdoc-var">getChildContainer</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( )
+    {
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.boxesEl</span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.boxesEl</span><span class="jsdoc-syntax">;
+        }
+        
+        </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">();
+        
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.boxesEl</span><span class="jsdoc-syntax">;
+    },
+    
+    
+    </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </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">;
+        
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isAutoInitial</span><span class="jsdoc-syntax">){
+            </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">);
+            </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">() {
+                </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'children rendered'</span><span class="jsdoc-syntax">);
+                </span><span class="jsdoc-var">_this.initial</span><span class="jsdoc-syntax">();
+            } ,</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+        }
+        
+    },
+    
+    </span><span class="jsdoc-var">initial </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-var">this.reloadItems</span><span class="jsdoc-syntax">();
+
+        </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">);
+
+        </span><span class="jsdoc-comment">/// was window resize... - let's see if this works..
+        </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">); 
+
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isAutoInitial</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
+            </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+        }
+        
+        </span><span class="jsdoc-var">this.layout.defer</span><span class="jsdoc-syntax">(500,</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+    },
+    
+    </span><span class="jsdoc-var">reloadItems</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-var">this.bricks </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.masonry-brick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+        
+        </span><span class="jsdoc-var">this.bricks.each</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-comment">//Roo.log(b.getSize());
+            </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">b.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'originalwidth'</span><span class="jsdoc-syntax">)) {
+                </span><span class="jsdoc-var">b.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'originalwidth'</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">b.getSize</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.width</span><span class="jsdoc-syntax">);
+            }
+            
+        });
+        
+        </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bricks.elements.length</span><span class="jsdoc-syntax">);
+    },
+    
+    </span><span class="jsdoc-var">resize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'resize'</span><span class="jsdoc-syntax">);
+        </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">);
+        
+        </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">&amp;&amp; </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">) {
+            </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;no change in with or X&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-var">this.currentSize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">this.layout</span><span class="jsdoc-syntax">();
+    },
+    
+    </span><span class="jsdoc-var">layout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'layout'</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">this._resetLayout</span><span class="jsdoc-syntax">();
+        </span><span class="jsdoc-comment">//this._manageStamps();
+      
+        // don't animate first layout
+        </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">;
+        </span><span class="jsdoc-var">this.layoutItems</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">);
+      
+        </span><span class="jsdoc-comment">// flag for initalized
+        </span><span class="jsdoc-var">this._isLayoutInited </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+    },
+    
+    </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">)
+    {
+        </span><span class="jsdoc-comment">//var items = this._getItemsForLayout( this.items );
+        // original code supports filtering layout items.. we just ignore it..
+        
+        </span><span class="jsdoc-var">this._layoutItems</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.bricks </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant </span><span class="jsdoc-syntax">);
+      
+        </span><span class="jsdoc-var">this._postLayout</span><span class="jsdoc-syntax">();
+    },
+    </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">items </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">isInstant</span><span class="jsdoc-syntax">)
+    {
+       </span><span class="jsdoc-comment">//this.fireEvent( 'layout', this, items );
+    
+
+        </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.elements.length </span><span class="jsdoc-syntax">) {
+          </span><span class="jsdoc-comment">// no items, emit event with empty array
+            </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+        }
+
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">queue </span><span class="jsdoc-syntax">= [];
+        </span><span class="jsdoc-var">items.each</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">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;layout item&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-comment">// get x/y object from method
+            </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this._getItemLayoutPosition</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-comment">// enqueue
+            </span><span class="jsdoc-var">position.item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-var">position.isInstant </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">isInstant</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// || item.isLayoutInstant; &lt;&lt; not set yet...
+            </span><span class="jsdoc-var">queue.push</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">);
+        }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+      
+        </span><span class="jsdoc-var">this._processLayoutQueue</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">queue </span><span class="jsdoc-syntax">);
+    },
+    </span><span class="jsdoc-comment">/** Sets position of item in DOM
+    * @param {Element} item
+    * @param {Number} x - horizontal position
+    * @param {Number} y - vertical position
+    * @param {Boolean} isInstant - disables transitions
+    */
+    </span><span class="jsdoc-var">_processLayoutQueue </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-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">len </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">queue.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">len</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++ ) {
+            </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">obj </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">queue</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
+            </span><span class="jsdoc-var">obj.item.position</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'absolute'</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">obj.item.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">obj.x</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">obj.y</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">obj.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">);
+        }
+    },
+      
+    
+    </span><span class="jsdoc-comment">/**
+    * Any logic you want to do after each layout,
+    * i.e. size the container
+    */
+    </span><span class="jsdoc-var">_postLayout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-var">this.resizeContainer</span><span class="jsdoc-syntax">();
+    },
+    
+    </span><span class="jsdoc-var">resizeContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( !</span><span class="jsdoc-var">this.isResizingContainer </span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this._getContainerSize</span><span class="jsdoc-syntax">();
+        </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">this.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">);
+            </span><span class="jsdoc-var">this.boxesEl.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">);
+        }
+    },
+    
+    
+    
+    </span><span class="jsdoc-var">_resetLayout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-comment">//this.getSize();  // -- does not really do anything.. it probably applies left/right etc. to obuject but not used
+        </span><span class="jsdoc-var">this.colWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getWidth</span><span class="jsdoc-syntax">();
+        </span><span class="jsdoc-comment">//this.gutter = this.el.getWidth(); 
+        
+        </span><span class="jsdoc-var">this.measureColumns</span><span class="jsdoc-syntax">();
+
+        </span><span class="jsdoc-comment">// reset column Y
+        </span><span class="jsdoc-keyword">var </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">this.colYs </span><span class="jsdoc-syntax">= [];
+        </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">--) {
+            </span><span class="jsdoc-var">this.colYs.push</span><span class="jsdoc-syntax">( 0 );
+        }
+    
+        </span><span class="jsdoc-var">this.maxY </span><span class="jsdoc-syntax">= 0;
+    },
+
+    </span><span class="jsdoc-var">measureColumns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-var">this.getContainerWidth</span><span class="jsdoc-syntax">();
+      </span><span class="jsdoc-comment">// if columnWidth is 0, default to outerWidth of first item
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( !</span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">firstItem </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.bricks.first</span><span class="jsdoc-syntax">();
+            </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">firstItem</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">this.columnWidth  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.containerWidth</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">firstItem </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">firstItem.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'originalwidth'</span><span class="jsdoc-syntax">) ) {
+                </span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">= 1* (</span><span class="jsdoc-var">firstItem.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'originalwidth'</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">firstItem.getWidth</span><span class="jsdoc-syntax">());
+            }
+            </span><span class="jsdoc-comment">// columnWidth fall back to item of first element
+            </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;set column width?&quot;</span><span class="jsdoc-syntax">);
+                        </span><span class="jsdoc-var">this.initialColumnWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.columnWidth  </span><span class="jsdoc-syntax">;
+
+            </span><span class="jsdoc-comment">// if first elem has no width, default to size of container
+            
+        </span><span class="jsdoc-syntax">}
+        
+        
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.initialColumnWidth</span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.initialColumnWidth</span><span class="jsdoc-syntax">;
+        }
+        
+        
+            
+        </span><span class="jsdoc-comment">// column width is fixed at the top - however if container width get's smaller we should
+        // reduce it...
+        
+        // this bit calcs how man columns..
+            
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">columnWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">;
+      
+        </span><span class="jsdoc-comment">// calculate columns
+        </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">+ </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">;
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">containerWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.padWidth</span><span class="jsdoc-syntax">) / (</span><span class="jsdoc-var">columnWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.padWidth</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-comment">// fix rounding errors, typically with gutters
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">excess </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">columnWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">containerWidth </span><span class="jsdoc-syntax">% </span><span class="jsdoc-var">columnWidth</span><span class="jsdoc-syntax">;
+        
+        
+        </span><span class="jsdoc-comment">// if overshoot is less than a pixel, round up, otherwise floor it
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mathMethod </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">excess </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">excess </span><span class="jsdoc-syntax">&lt; 1 ? </span><span class="jsdoc-string">'round' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'floor'</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math</span><span class="jsdoc-syntax">[ </span><span class="jsdoc-var">mathMethod </span><span class="jsdoc-syntax">]( </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">);
+        </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 );
+        </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.maxCols </span><span class="jsdoc-syntax">&gt; 0 ? </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.maxCols </span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">;
+        
+         </span><span class="jsdoc-comment">// padding positioning..
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">totalColWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.columnWidth</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">padavail </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.containerWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">totalColWidth</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-comment">// so for 2 columns - we need 3 'pads'
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">padNeeded </span><span class="jsdoc-syntax">= (1+</span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">this.padWidth</span><span class="jsdoc-syntax">;
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">padExtra </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">padavail </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">padNeeded</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">this.cols</span><span class="jsdoc-syntax">);
+        
+        </span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">padExtra
+        </span><span class="jsdoc-comment">//this.padWidth = Math.floor(padavail /  ( this.cols));
+        
+        // adjust colum width so that padding is fixed??
+        
+        // we have 3 columns ... total = width * 3
+        // we have X left over... that should be used by 
+        
+        //if (this.expandC) {
+            
+        //}
+        
+        
+        
+    </span><span class="jsdoc-syntax">},
+    
+    </span><span class="jsdoc-var">getContainerWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+       </span><span class="jsdoc-comment">/* // container is parent if fit width
+        var container = this.isFitWidth ? this.element.parentNode : this.element;
+        // check that this.size and size are there
+        // IE8 triggers resize on body size change, so they might not be
+        
+        var size = getSize( container );  //FIXME
+        this.containerWidth = size &amp;&amp; size.innerWidth; //FIXME
+        */
+         
+        </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
+        
+    </span><span class="jsdoc-syntax">},
+    
+    </span><span class="jsdoc-var">_getItemLayoutPosition </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-comment">// what is item?
+    </span><span class="jsdoc-syntax">{
+        </span><span class="jsdoc-comment">// we resize the item to our columnWidth..
+      
+        </span><span class="jsdoc-var">item.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.columnWidth</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">item.autoBoxAdjust  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sz </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">item.getSize</span><span class="jsdoc-syntax">();
+ 
+        </span><span class="jsdoc-comment">// how many columns does this brick span
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">remainder </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.containerWidth </span><span class="jsdoc-syntax">% </span><span class="jsdoc-var">this.columnWidth</span><span class="jsdoc-syntax">;
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mathMethod </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">remainder </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">remainder </span><span class="jsdoc-syntax">&lt; 1 ? </span><span class="jsdoc-string">'round' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ceil'</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-comment">// round if off by 1 pixel, otherwise use ceil
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">colSpan </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math</span><span class="jsdoc-syntax">[ </span><span class="jsdoc-var">mathMethod </span><span class="jsdoc-syntax">]( </span><span class="jsdoc-var">sz.width  </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">colSpan </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">colSpan</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">);
+        
+        </span><span class="jsdoc-comment">// normally this should be '1' as we dont' currently allow multi width columns..
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">colGroup </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this._getColGroup</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">colSpan </span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-comment">// get the minimum Y value from the columns
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minimumY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min.apply</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">Math</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">colGroup </span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">([ </span><span class="jsdoc-string">'setHeight'</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">minimumY</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sz.height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">setHeight </span><span class="jsdoc-syntax">]);
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">shortColIndex </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">colGroup.indexOf</span><span class="jsdoc-syntax">(  </span><span class="jsdoc-var">minimumY </span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// broken on ie8..?? probably...
+         
+        // position the brick
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">= {
+            </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.currentSize.x </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.padWidth </span><span class="jsdoc-syntax">/2) + ((</span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.padWidth </span><span class="jsdoc-syntax">)* </span><span class="jsdoc-var">shortColIndex</span><span class="jsdoc-syntax">),
+            </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.currentSize.y </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">minimumY </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.padHeight
+        </span><span class="jsdoc-syntax">};
+        
+        </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-comment">// apply setHeight to necessary columns
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">setHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">minimumY </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">sz.height </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.padHeight</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-comment">//Roo.log([ 'setHeight',  minimumY, sz.height, setHeight ]);
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">setSpan </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">+ 1 - </span><span class="jsdoc-var">colGroup.length</span><span class="jsdoc-syntax">;
+        </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">&lt; </span><span class="jsdoc-var">setSpan</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++ ) {
+          </span><span class="jsdoc-var">this.colYs</span><span class="jsdoc-syntax">[ </span><span class="jsdoc-var">shortColIndex </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">setHeight </span><span class="jsdoc-syntax">;
+        }
+      
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">;
+    },
+    
+    </span><span class="jsdoc-comment">/**
+     * @param {Number} colSpan - number of columns the element spans
+     * @returns {Array} colGroup
+     */
+    </span><span class="jsdoc-var">_getColGroup </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">colSpan </span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">colSpan </span><span class="jsdoc-syntax">&lt; 2 ) {
+          </span><span class="jsdoc-comment">// if brick spans only one column, use all the column Ys
+          </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.colYs</span><span class="jsdoc-syntax">;
+        }
+      
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">colGroup </span><span class="jsdoc-syntax">= [];
+        </span><span class="jsdoc-comment">// how many different places could this brick fit horizontally
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">groupCount </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">+ 1 - </span><span class="jsdoc-var">colSpan</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-comment">// for each group potential horizontal position
+        </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">&lt; </span><span class="jsdoc-var">groupCount</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++ ) {
+          </span><span class="jsdoc-comment">// make an array of colY values for that one group
+          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">groupColYs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.colYs.slice</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">colSpan </span><span class="jsdoc-syntax">);
+          </span><span class="jsdoc-comment">// and get the max value of the array
+          </span><span class="jsdoc-var">colGroup</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">Math.max.apply</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">Math</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">groupColYs </span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">colGroup</span><span class="jsdoc-syntax">;
+    },
+    </span><span class="jsdoc-comment">/*
+    _manageStamp : function( stamp )
+    {
+        var stampSize =  stamp.getSize();
+        var offset = stamp.getBox();
+        // get the columns that this stamp affects
+        var firstX = this.isOriginLeft ? offset.x : offset.right;
+        var lastX = firstX + stampSize.width;
+        var firstCol = Math.floor( firstX / this.columnWidth );
+        firstCol = Math.max( 0, firstCol );
+        
+        var lastCol = Math.floor( lastX / this.columnWidth );
+        // lastCol should not go over if multiple of columnWidth #425
+        lastCol -= lastX % this.columnWidth ? 0 : 1;
+        lastCol = Math.min( this.cols - 1, lastCol );
+        
+        // set colYs to bottom of the stamp
+        var stampMaxY = ( this.isOriginTop ? offset.y : offset.bottom ) +
+            stampSize.height;
+            
+        for ( var i = firstCol; i &lt;= lastCol; i++ ) {
+          this.colYs[i] = Math.max( stampMaxY, this.colYs[i] );
+        }
+    },
+    */
+    
+    </span><span class="jsdoc-var">_getContainerSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-var">this.maxY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max.apply</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">Math</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.colYs </span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">= {
+            </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.maxY
+        </span><span class="jsdoc-syntax">};
+      
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.isFitWidth </span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-var">size.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this._getContainerFitWidth</span><span class="jsdoc-syntax">();
+        }
+      
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">;
+    },
+    
+    </span><span class="jsdoc-var">_getContainerFitWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">unusedCols </span><span class="jsdoc-syntax">= 0;
+        </span><span class="jsdoc-comment">// count unused columns
+        </span><span class="jsdoc-keyword">var </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-keyword">while </span><span class="jsdoc-syntax">( --</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">) {
+          </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.colYs</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] !== 0 ) {
+            </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+          }
+          </span><span class="jsdoc-var">unusedCols</span><span class="jsdoc-syntax">++;
+        }
+        </span><span class="jsdoc-comment">// fit container to columns that have been used
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.cols </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">unusedCols </span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">this.columnWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.gutter</span><span class="jsdoc-syntax">;
+    },
+    
+    </span><span class="jsdoc-var">needsResizeLayout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">previousWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.containerWidth</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">this.getContainerWidth</span><span class="jsdoc-syntax">();
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">previousWidth </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">this.containerWidth</span><span class="jsdoc-syntax">;
+    }
+ 
+});
+
+ 
+
+ </span></code></body></html>
\ No newline at end of file
RooJS - Version 1