3
Copyright 2011 Yahoo! Inc. All rights reserved.
4
Licensed under the BSD License.
5
http://yuilibrary.com/license/
7
YUI.add('tabview-base', function(Y) {
9
var getClassName = Y.ClassNameManager.getClassName,
14
SELECTED = 'selected',
19
tabview: getClassName(TABVIEW),
20
tabviewPanel: getClassName(TABVIEW, PANEL),
21
tabviewList: getClassName(TABVIEW, 'list'),
22
tab: getClassName(TAB),
23
tabLabel: getClassName(TAB, 'label'),
24
tabPanel: getClassName(TAB, PANEL),
25
selectedTab: getClassName(TAB, SELECTED),
26
selectedPanel: getClassName(TAB, PANEL, SELECTED)
30
tabview: DOT + _classNames.tabview,
33
tabLabel: '> ul > li > a ',
34
tabviewPanel: '> div',
35
tabPanel: '> div > div',
36
selectedTab: '> ul > ' + DOT + _classNames.selectedTab,
37
selectedPanel: '> div ' + DOT + _classNames.selectedPanel
40
TabviewBase = function(config) {
41
this.init.apply(this, arguments);
44
TabviewBase.NAME = 'tabviewBase';
45
TabviewBase._queries = _queries;
46
TabviewBase._classNames = _classNames;
48
Y.mix(TabviewBase.prototype, {
49
init: function(config) {
50
config = config || EMPTY_OBJ;
51
this._node = config.host || Y.one(config.node);
56
initClassNames: function(index) {
57
Y.Object.each(_queries, function(query, name) {
58
// this === tabview._node
59
if (_classNames[name]) {
60
var result = this.all(query);
62
if (index !== undefined) {
63
result = result.item(index);
67
result.addClass(_classNames[name]);
72
this._node.addClass(_classNames.tabview);
75
_select: function(index) {
76
var 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);
83
oldItem.removeClass(_classNames.selectedTab);
87
oldContent.removeClass(_classNames.selectedPanel);
91
newItem.addClass(_classNames.selectedTab);
95
newContent.addClass(_classNames.selectedPanel);
99
initState: function() {
100
var node = this._node,
101
activeNode = node.one(_queries.selectedTab),
102
activeIndex = activeNode ?
103
node.all(_queries.tab).indexOf(activeNode) : 0;
105
this._select(activeIndex);
108
// collapse extra space between list-items
109
_scrubTextNodes: function() {
110
this._node.one(_queries.tabviewList).get('childNodes').each(function(node) {
111
if (node.get('nodeType') === 3) { // text node
117
// base renderer only enlivens existing markup
118
refresh: function() {
119
this._scrubTextNodes();
120
this.initClassNames();
125
tabEventName: 'click',
127
initEvents: function() {
128
// TODO: detach prefix for delegate?
129
// this._node.delegate('tabview|' + this.tabEventName),
130
this._node.delegate(this.tabEventName,
137
onTabEvent: function(e) {
139
this._select(this._node.all(_queries.tab).indexOf(e.currentTarget));
142
destroy: function() {
143
this._node.detach(this.tabEventName);
147
Y.TabviewBase = TabviewBase;
150
}, '3.4.1' ,{requires:['node-event-delegate', 'classnamemanager', 'skin-sam-tabview']});