projects / roojs1 / blob
? search:


37dc1c9533f19ab6f47c63e981404bd1bf7b9f4c
[roojs1] / docs / src / Roo_CompositeElementLite.js.html
1 <html><head><title>/home/edward/gitlive/roojs1/Roo/CompositeElementLite.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
2  * Based on:
3  * Ext JS Library 1.1.1
4  * Copyright(c) 2006-2007, Ext JS, LLC.
5  *
6  * Originally Released Under LGPL - original licence link has changed is not relivant.
7  *
8  * Fork - LGPL
9  * &lt;script type=&quot;text/javascript&quot;&gt;
10  */
11
12 /**
13  * @class Roo.CompositeElementLite
14  * @extends Roo.CompositeElement
15  * Flyweight composite class. Reuses the same Roo.Element for element operations.
16  &lt;pre&gt;&lt;code&gt;
17  var els = Roo.select(&quot;#some-el div.some-class&quot;);
18  // or select directly from an existing element
19  var el = Roo.get('some-el');
20  el.select('div.some-class');
21
22  els.setWidth(100); // all elements become 100 width
23  els.hide(true); // all elements fade out and hide
24  // or
25  els.setWidth(100).hide(true);
26  &lt;/code&gt;&lt;/pre&gt;&lt;br&gt;&lt;br&gt;
27  * &lt;b&gt;NOTE: Although they are not listed, this class supports all of the set/update methods of Roo.Element. All Roo.Element
28  * actions will be performed on all the elements in this collection.&lt;/b&gt;
29  */
30 </span><span class="jsdoc-var">Roo.CompositeElementLite </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">){
31     </span><span class="jsdoc-var">Roo.CompositeElementLite.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">);
32     </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Element.Flyweight</span><span class="jsdoc-syntax">();
33 };
34 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.CompositeElementLite</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.CompositeElement</span><span class="jsdoc-syntax">, {
35     </span><span class="jsdoc-var">addElements </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">){
36         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">){
37             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">){
38                 </span><span class="jsdoc-var">this.elements </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.elements.concat</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">);
39             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
40                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">yels </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.elements</span><span class="jsdoc-syntax">;
41                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">index </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">yels.length</span><span class="jsdoc-syntax">-1;
42                 </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">els.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">++) {
43                     </span><span class="jsdoc-var">yels</span><span class="jsdoc-syntax">[++</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
44                 }
45             }
46         }
47         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
48     },
49     </span><span class="jsdoc-var">invoke </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">args</span><span class="jsdoc-syntax">){
50         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">els </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.elements</span><span class="jsdoc-syntax">;
51         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
52         </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">els.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">++) {
53             </span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
54                 </span><span class="jsdoc-var">Roo.Element.prototype</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">args</span><span class="jsdoc-syntax">);
55         }
56         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
57     },
58     </span><span class="jsdoc-comment">/**
59      * Returns a flyweight Element of the dom element object at the specified index
60      * @param {Number} index
61      * @return {Roo.Element}
62      */
63     </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">){
64         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.elements</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">]){
65             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
66         }
67         </span><span class="jsdoc-var">this.el.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.elements</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">];
68         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
69     },
70
71     </span><span class="jsdoc-comment">// fixes scope with flyweight
72     </span><span class="jsdoc-var">addListener </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">handler</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">opt</span><span class="jsdoc-syntax">){
73         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">els </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.elements</span><span class="jsdoc-syntax">;
74         </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">els.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">++) {
75             </span><span class="jsdoc-var">Roo.EventManager.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">handler</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">opt</span><span class="jsdoc-syntax">);
76         }
77         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
78     },
79
80     </span><span class="jsdoc-comment">/**
81     * Calls the passed function passing (el, this, index) for each element in this composite. &lt;b&gt;The element
82     * passed is the flyweight (shared) Roo.Element instance, so if you require a
83     * a reference to the dom node, use el.dom.&lt;/b&gt;
84     * @param {Function} fn The function to call
85     * @param {Object} scope (optional) The &lt;i&gt;this&lt;/i&gt; object (defaults to the element)
86     * @return {CompositeElement} this
87     */
88     </span><span class="jsdoc-var">each </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">){
89         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">els </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.elements</span><span class="jsdoc-syntax">;
90         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
91         </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">els.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">++){
92             </span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
93                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fn.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
94                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
95             }
96         }
97         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
98     },
99
100     </span><span class="jsdoc-var">indexOf </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
101         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.elements.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">));
102     },
103
104     </span><span class="jsdoc-var">replaceElement </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">replacement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">domReplace</span><span class="jsdoc-syntax">){
105         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">index </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'number' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
106         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">index </span><span class="jsdoc-syntax">!== -1){
107             </span><span class="jsdoc-var">replacement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">replacement</span><span class="jsdoc-syntax">);
108             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">domReplace</span><span class="jsdoc-syntax">){
109                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.elements</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">];
110                 </span><span class="jsdoc-var">d.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">replacement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">);
111                 </span><span class="jsdoc-var">d.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">);
112             }
113             </span><span class="jsdoc-var">this.elements.splice</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">, 1, </span><span class="jsdoc-var">replacement</span><span class="jsdoc-syntax">);
114         }
115         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
116     }
117 });
118 </span><span class="jsdoc-var">Roo.CompositeElementLite.prototype.on </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.CompositeElementLite.prototype.addListener</span><span class="jsdoc-syntax">;
119
120 </span></code></body></html>
RooJS - Version 1