docs/source/AbstractCard.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   5   <title>The source code</title>
   6   <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   7   <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   8   <style type="text/css">
   9     .highlight { display: block; background-color: #ddd; }
  10   </style>
  11   <script type="text/javascript">
  12     function highlight() {
  13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
  14     }
  15   </script>
  16 </head>
  17 <body onload="prettyPrint(); highlight();">
  18   <pre class="prettyprint lang-js"><span id='Ext-layout-container-AbstractCard'>/**
  19 </span> * Abstract base class for {@link Ext.layout.container.Card Card layout}.
  20  * @private
  21  */
  22 Ext.define('Ext.layout.container.AbstractCard', {
  23
  24     /* Begin Definitions */
  25
  26     extend: 'Ext.layout.container.Fit',
  27
  28     /* End Definitions */
  29
  30     type: 'card',
  31
  32     sizeAllCards: false,
  33
  34     hideInactive: true,
  35
  36 <span id='Ext-layout-container-AbstractCard-cfg-deferredRender'>    /**
  37 </span>     * @cfg {Boolean} deferredRender
  38      * True to render each contained item at the time it becomes active, false to render all contained items
  39      * as soon as the layout is rendered.  If there is a significant amount of content or
  40      * a lot of heavy controls being rendered into panels that are not displayed by default, setting this to
  41      * true might improve performance.
  42      */
  43     deferredRender : false,
  44
  45     beforeLayout: function() {
  46         var me = this;
  47         me.getActiveItem();
  48         if (me.activeItem &amp;&amp; me.deferredRender) {
  49             me.renderItems([me.activeItem], me.getRenderTarget());
  50             return true;
  51         }
  52         else {
  53             return this.callParent(arguments);
  54         }
  55     },
  56
  57     renderChildren: function () {
  58         if (!this.deferredRender) {
  59             this.getActiveItem();
  60             this.callParent();
  61         }
  62     },
  63
  64     onLayout: function() {
  65         var me = this,
  66             activeItem = me.activeItem,
  67             items = me.getVisibleItems(),
  68             ln = items.length,
  69             targetBox = me.getTargetBox(),
  70             i, item;
  71
  72         for (i = 0; i &lt; ln; i++) {
  73             item = items[i];
  74             me.setItemBox(item, targetBox);
  75         }
  76
  77         if (!me.firstActivated &amp;&amp; activeItem) {
  78             if (activeItem.fireEvent('beforeactivate', activeItem) !== false) {
  79                 activeItem.fireEvent('activate', activeItem);
  80             }
  81             me.firstActivated = true;
  82         }
  83     },
  84
  85     isValidParent : function(item, target, position) {
  86         // Note: Card layout does not care about order within the target because only one is ever visible.
  87         // We only care whether the item is a direct child of the target.
  88         var itemEl = item.el ? item.el.dom : Ext.getDom(item);
  89         return (itemEl &amp;&amp; itemEl.parentNode === (target.dom || target)) || false;
  90     },
  91
  92 <span id='Ext-layout-container-AbstractCard-method-getActiveItem'>    /**
  93 </span>     * Return the active (visible) component in the layout.
  94      * @returns {Ext.Component}
  95      */
  96     getActiveItem: function() {
  97         var me = this;
  98         if (!me.activeItem &amp;&amp; me.owner) {
  99             me.activeItem = me.parseActiveItem(me.owner.activeItem);
 100         }
 101
 102         if (me.activeItem &amp;&amp; me.owner.items.indexOf(me.activeItem) != -1) {
 103             return me.activeItem;
 104         }
 105
 106         return null;
 107     },
 108
 109     // @private
 110     parseActiveItem: function(item) {
 111         if (item &amp;&amp; item.isComponent) {
 112             return item;
 113         }
 114         else if (typeof item == 'number' || item === undefined) {
 115             return this.getLayoutItems()[item || 0];
 116         }
 117         else {
 118             return this.owner.getComponent(item);
 119         }
 120     },
 121
 122     // @private
 123     configureItem: function(item, position) {
 124         this.callParent([item, position]);
 125         if (this.hideInactive &amp;&amp; this.activeItem !== item) {
 126             item.hide();
 127         }
 128         else {
 129             item.show();
 130         }
 131     },
 132
 133     onRemove: function(component) {
 134         if (component === this.activeItem) {
 135             this.activeItem = null;
 136             if (this.owner.items.getCount() === 0) {
 137                 this.firstActivated = false;
 138             }
 139         }
 140     },
 141
 142     // @private
 143     getAnimation: function(newCard, owner) {
 144         var newAnim = (newCard || {}).cardSwitchAnimation;
 145         if (newAnim === false) {
 146             return false;
 147         }
 148         return newAnim || owner.cardSwitchAnimation;
 149     },
 150
 151 <span id='Ext-layout-container-AbstractCard-method-getNext'>    /**
 152 </span>     * Return the active (visible) component in the layout to the next card
 153      * @returns {Ext.Component} The next component or false.
 154      */
 155     getNext: function() {
 156         //NOTE: Removed the JSDoc for this function's arguments because it is not actually supported in 4.0. This
 157         //should come back in 4.1
 158         var wrap = arguments[0];
 159         var items = this.getLayoutItems(),
 160             index = Ext.Array.indexOf(items, this.activeItem);
 161         return items[index + 1] || (wrap ? items[0] : false);
 162     },
 163
 164 <span id='Ext-layout-container-AbstractCard-method-next'>    /**
 165 </span>     * Sets the active (visible) component in the layout to the next card
 166      * @return {Ext.Component} the activated component or false when nothing activated.
 167      */
 168     next: function() {
 169         //NOTE: Removed the JSDoc for this function's arguments because it is not actually supported in 4.0. This
 170         //should come back in 4.1
 171         var anim = arguments[0], wrap = arguments[1];
 172         return this.setActiveItem(this.getNext(wrap), anim);
 173     },
 174
 175 <span id='Ext-layout-container-AbstractCard-method-getPrev'>    /**
 176 </span>     * Return the active (visible) component in the layout to the previous card
 177      * @returns {Ext.Component} The previous component or false.
 178      */
 179     getPrev: function() {
 180         //NOTE: Removed the JSDoc for this function's arguments because it is not actually supported in 4.0. This
 181         //should come back in 4.1
 182         var wrap = arguments[0];
 183         var items = this.getLayoutItems(),
 184             index = Ext.Array.indexOf(items, this.activeItem);
 185         return items[index - 1] || (wrap ? items[items.length - 1] : false);
 186     },
 187
 188 <span id='Ext-layout-container-AbstractCard-method-prev'>    /**
 189 </span>     * Sets the active (visible) component in the layout to the previous card
 190      * @return {Ext.Component} the activated component or false when nothing activated.
 191      */
 192     prev: function() {
 193         //NOTE: Removed the JSDoc for this function's arguments because it is not actually supported in 4.0. This
 194         //should come back in 4.1
 195         var anim = arguments[0], wrap = arguments[1];
 196         return this.setActiveItem(this.getPrev(wrap), anim);
 197     }
 198 });
 199 </pre>
 200 </body>
 201 </html>