1 /*

     2 YUI 3.10.3 (build 2fb5187)

     3 Copyright 2013 Yahoo! Inc. All rights reserved.

     4 Licensed under the BSD License.

     5 http://yuilibrary.com/license/

     6 */

     7 

     8 YUI.add('tabview-base', function (Y, NAME) {

     9 

    10 var getClassName = Y.ClassNameManager.getClassName,

    11     TABVIEW = 'tabview',

    12     TAB = 'tab',

    13     PANEL = 'panel',

    14     SELECTED = 'selected',

    15     EMPTY_OBJ = {},

    16     DOT = '.',

    17 

    18     TabviewBase = function() {

    19         this.init.apply(this, arguments);

    20     };

    21 

    22 TabviewBase.NAME = 'tabviewBase';

    23 TabviewBase._classNames = {

    24     tabview: getClassName(TABVIEW),

    25     tabviewPanel: getClassName(TABVIEW, PANEL),

    26     tabviewList: getClassName(TABVIEW, 'list'),

    27     tab: getClassName(TAB),

    28     tabLabel: getClassName(TAB, 'label'),

    29     tabPanel: getClassName(TAB, PANEL),

    30     selectedTab: getClassName(TAB, SELECTED),

    31     selectedPanel: getClassName(TAB, PANEL, SELECTED)

    32 };

    33 TabviewBase._queries = {

    34     tabview: DOT + TabviewBase._classNames.tabview,

    35     tabviewList: '> ul',

    36     tab: '> ul > li',

    37     tabLabel: '> ul > li > a',

    38     tabviewPanel: '> div',

    39     tabPanel: '> div > div',

    40     selectedTab: '> ul > ' + DOT + TabviewBase._classNames.selectedTab,

    41     selectedPanel: '> div ' + DOT + TabviewBase._classNames.selectedPanel

    42 };

    43 

    44 Y.mix(TabviewBase.prototype, {

    45     init: function(config) {

    46         config = config || EMPTY_OBJ;

    47         this._node = config.host || Y.one(config.node);

    48 

    49         this.refresh();

    50     },

    51 

    52     initClassNames: function(index) {

    53         var _classNames = Y.TabviewBase._classNames;

    54 

    55         Y.Object.each(Y.TabviewBase._queries, function(query, name) {

    56             // this === tabview._node

    57             if (_classNames[name]) {

    58                 var result = this.all(query);

    59 

    60                 if (index !== undefined) {

    61                     result = result.item(index);

    62                 }

    63 

    64                 if (result) {

    65                     result.addClass(_classNames[name]);

    66                 }

    67             }

    68         }, this._node);

    69 

    70         this._node.addClass(_classNames.tabview);

    71     },

    72 

    73     _select: function(index) {

    74         var _classNames = Y.TabviewBase._classNames,

    75             _queries = Y.TabviewBase._queries,

    76             node = this._node,

    77             oldItem = node.one(_queries.selectedTab),

    78             oldContent = node.one(_queries.selectedPanel),

    79             newItem = node.all(_queries.tab).item(index),

    80             newContent = node.all(_queries.tabPanel).item(index);

    81 

    82         if (oldItem) {

    83             oldItem.removeClass(_classNames.selectedTab);

    84         }

    85 

    86         if (oldContent) {

    87             oldContent.removeClass(_classNames.selectedPanel);

    88         }

    89 

    90         if (newItem) {

    91             newItem.addClass(_classNames.selectedTab);

    92         }

    93 

    94         if (newContent) {

    95             newContent.addClass(_classNames.selectedPanel);

    96         }

    97     },

    98 

    99     initState: function() {

   100         var _queries = Y.TabviewBase._queries,

   101             node = this._node,

   102             activeNode = node.one(_queries.selectedTab),

   103             activeIndex = activeNode ?

   104                     node.all(_queries.tab).indexOf(activeNode) : 0;

   105 

   106         this._select(activeIndex);

   107     },

   108 

   109     // collapse extra space between list-items

   110     _scrubTextNodes: function() {

   111         this._node.one(Y.TabviewBase._queries.tabviewList).get('childNodes').each(function(node) {

   112             if (node.get('nodeType') === 3) { // text node

   113                 node.remove();

   114             }

   115         });

   116     },

   117 

   118     // base renderer only enlivens existing markup

   119     refresh: function() {

   120         this._scrubTextNodes();

   121         this.initClassNames();

   122         this.initState();

   123         this.initEvents();

   124     },

   125 

   126     tabEventName: 'click',

   127 

   128     initEvents: function() {

   129         // TODO: detach prefix for delegate?

   130         // this._node.delegate('tabview|' + this.tabEventName),

   131         this._node.delegate(this.tabEventName,

   132             this.onTabEvent,

   133             Y.TabviewBase._queries.tab,

   134             this

   135         );

   136     },

   137 

   138     onTabEvent: function(e) {

   139         e.preventDefault();

   140         this._select(this._node.all(Y.TabviewBase._queries.tab).indexOf(e.currentTarget));

   141     },

   142 

   143     destroy: function() {

   144         this._node.detach(this.tabEventName);

   145     }

   146 });

   147 

   148 Y.TabviewBase = TabviewBase;

   149 

   150 

   151 }, '3.10.3', {"requires": ["node-event-delegate", "classnamemanager"]});