gistfile1.js

	/**
	 * SimpleTabs
	 * Eric Ferraiuolo — http://eric.ferraiuolo.name
	 */
	
	var SimpleTabs,
		SIMPLETABS = 'simpletabs',
		
		BOUNDING_BOX = 'boundingBox',
		CONTENT_BOX = 'contentBox',
		
		TAB_NODES = 'tabNodes',
		SECTION_NODES = 'sectionNodes',
		ACTIVE_INDEX = 'activeIndex',
		
		isNumber = Y.Lang.isNumber,
		getCN = Y.ClassNameManager.getClassName,
		
		TAB = 'tab',
		SECTION = 'section',
		ACTIVE = 'active',
		DOT = '.',
		
		C_TAB = getCN(SIMPLETABS, TAB),
		C_TAB_ACTIVE = getCN(SIMPLETABS, TAB, ACTIVE),
		C_SECTION = getCN(SIMPLETABS, SECTION);
		
	// *** Constructor *** //
	
	SimpleTabs = function () {
		
		SimpleTabs.superclass.constructor.apply(this, arguments);
	};
	
	// *** Static *** //
	
	Y.mix(SimpleTabs, {
		
		NAME : SIMPLETABS,
				
		ATTRS : {
			
			tabNodes : {
				value : null,
				validator : function (v) {
					return (v instanceof Y.NodeList);
				},
				writeOnce : true
			},
			
			sectionNodes : {
				value : null,
				validator : function (v) {
					return (v instanceof Y.NodeList);
				},
				writeOnce : true
			},
			
			activeIndex : {
				value : 0,
				validator : function (v) {
					return (isNumber(v) && v >= 0);
				}
			}
			
		},
		
		HTML_PARSER : {
			
			tabNodes : [DOT+C_TAB],
			
			sectionNodes : [DOT+C_SECTION],
			
			activeIndex : function (contentBox) {
				var activeIndex = contentBox.queryAll(DOT+C_TAB).indexOf(contentBox.query(DOT+C_TAB_ACTIVE));
				return ( activeIndex > 0 ? activeIndex : 0 );
			}
			
		}
		
	});
	
	// *** Prototype *** //
	
	Y.extend(SimpleTabs, Y.Widget, {
		
		// *** Instance Members *** //
		
		// *** Widget Methods *** //
		
		initializer : function (config) {
			
			
		},
		
		destructor : function () {
			
			
		},
		
		renderUI : function () {
			
			
		},
		
		bindUI : function () {
			
			this.get(TAB_NODES).on('click', this._handleTabClick, this);
			this.after('activeIndexChange', this._afterActiveIndexChange, this);
		},
		
		syncUI : function () {
			
			this._uiSetActive(this.get(ACTIVE_INDEX));
		},
		
		// *** Public Methods *** //
		
		show : function (item) {
			
			var index;
			
			if ( isNumber(item) ) {
				index = item;
			} else {
				index = this.get(SECTION_NODES).indexOf(Y.get(item));
			}
			
			if ( index && index > -1 ) {
				this.set(ACTIVE_INDEX, index);
			}
		},
		
		// *** Private Methods *** //
		
		_handleTabClick : function (e) {
			
			var target;
			
			if ( e.target.test(DOT+C_TAB) ) {
				target = e.target;
			} else {
				target = e.target.ancestor(DOT+C_TAB);
			}
			
			this.set(ACTIVE_INDEX, this.get(TAB_NODES).indexOf(target));
			e.preventDefault();
		},
		
		_afterActiveIndexChange : function(e) {
			
			this._uiSetActive(e.newVal);
		},
		
		_uiSetActive : function (index) {
			
			var tabs = this.get(TAB_NODES),
				sections = this.get(SECTION_NODES);
			
			tabs.removeClass(C_TAB_ACTIVE);
			tabs.item(index).addClass(C_TAB_ACTIVE);
			
			sections.setStyle('display', 'none');
			sections.item(index).setStyle('display', 'block');
		}
		
	});
	
	Y.SimpleTabs = SimpleTabs;