src/core/src/dom/CompositeElement.js

   1 /*
   2
   3 This file is part of Ext JS 4
   4
   5 Copyright (c) 2011 Sencha Inc
   6
   7 Contact:  http://www.sencha.com/contact
   8
   9 GNU General Public License Usage
  10 This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file.  Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
  11
  12 If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.
  13
  14 */
  15 /**
  16  * @class Ext.CompositeElement
  17  * @extends Ext.CompositeElementLite
  18  * <p>This class encapsulates a <i>collection</i> of DOM elements, providing methods to filter
  19  * members, or to perform collective actions upon the whole set.</p>
  20  * <p>Although they are not listed, this class supports all of the methods of {@link Ext.Element} and
  21  * {@link Ext.fx.Anim}. The methods from these classes will be performed on all the elements in this collection.</p>
  22  * <p>All methods return <i>this</i> and can be chained.</p>
  23  * Usage:
  24 <pre><code>
  25 var els = Ext.select("#some-el div.some-class", true);
  26 // or select directly from an existing element
  27 var el = Ext.get('some-el');
  28 el.select('div.some-class', true);
  29
  30 els.setWidth(100); // all elements become 100 width
  31 els.hide(true); // all elements fade out and hide
  32 // or
  33 els.setWidth(100).hide(true);
  34 </code></pre>
  35  */
  36 Ext.CompositeElement = Ext.extend(Ext.CompositeElementLite, {
  37
  38     constructor : function(els, root){
  39         this.elements = [];
  40         this.add(els, root);
  41     },
  42
  43     // private
  44     getElement : function(el){
  45         // In this case just return it, since we already have a reference to it
  46         return el;
  47     },
  48
  49     // private
  50     transformElement : function(el){
  51         return Ext.get(el);
  52     }
  53 });
  54
  55 /**
  56  * Selects elements based on the passed CSS selector to enable {@link Ext.Element Element} methods
  57  * to be applied to many related elements in one statement through the returned {@link Ext.CompositeElement CompositeElement} or
  58  * {@link Ext.CompositeElementLite CompositeElementLite} object.
  59  * @param {String/HTMLElement[]} selector The CSS selector or an array of elements
  60  * @param {Boolean} [unique] true to create a unique Ext.Element for each element (defaults to a shared flyweight object)
  61  * @param {HTMLElement/String} [root] The root element of the query or id of the root
  62  * @return {Ext.CompositeElementLite/Ext.CompositeElement}
  63  * @member Ext.Element
  64  * @method select
  65  */
  66 Ext.Element.select = function(selector, unique, root){
  67     var els;
  68     if(typeof selector == "string"){
  69         els = Ext.Element.selectorFunction(selector, root);
  70     }else if(selector.length !== undefined){
  71         els = selector;
  72     }else{
  73         //<debug>
  74         Ext.Error.raise({
  75             sourceClass: "Ext.Element",
  76             sourceMethod: "select",
  77             selector: selector,
  78             unique: unique,
  79             root: root,
  80             msg: "Invalid selector specified: " + selector
  81         });
  82         //</debug>
  83     }
  84     return (unique === true) ? new Ext.CompositeElement(els) : new Ext.CompositeElementLite(els);
  85 };
  86
  87 /**
  88  * Shorthand of {@link Ext.Element#select}.
  89  * @member Ext
  90  * @method select
  91  * @alias Ext.Element#select
  92  */
  93 Ext.select = Ext.Element.select;