/**
 * Creates navigable tab sets from HTML structures.
 * Looks for the following structure:
 *
 * div.tab-set#id               // id is optional
 *   div.section#unique-id
 *     *.heading.persistent     // .persistent is optional
 *     a.section-key[accesskey] // optional
 *
 * The tab set will extend to the height of its tallest
 * section. To restrict the height, explicity set the height
 * of every section:
 *
 * #id .section { height: 180px;}
 *
 * Sections that are too tall will display scroll bars.
 * @namespace nfl.nflnetwork.gameEnhancement
 * @class TabSets
 * @author ryan.cannon@nfl.com
 */
nfl.namespace("nfl.ui.tabs");
nfl.ui.tabs.tabSet	= Class.create();
nfl.ui.tabs.tabSet.prototype = {
	initialize: function(tabsetClassName, autoHeight, defaultTabIndex){
		if(typeof tabsetClassName == 'undefined'){tabsetClassName = 'tab-set'; }
		this.autoHeight	= (typeof autoHeight != 'undefined')? autoHeight:true;
		var image = new Image();
		image.src = nfl.global.imagepath + "/img/nflnetwork/game-enhancement/nfln8-tabs.png";
		//Event.observe(window, 'load', init);
		this.keepstate	= false;
		this.defaultTabIndex	= (typeof defaultTabIndex != 'undefined')? defaultTabIndex:0;
		this.activate(tabsetClassName)
		document.observe('window:hashchange',this.onHashChange.bind(this));
	},
	onHashChange: function(event){
		console.info('onHashChange'+window.location.hash);
		var hParams	= window.location.hashparams.get();
		var link	= (hParams != null && hParams.get(this.tabSetId) != null)? $(this.tabSetId).select('ol li a[href="#'+ hParams.get(this.tabSetId) +'"]')[0]:$(this.tabSetId).select('ol li.tab-'+ this.defaultTabIndex +' a')[0];
		this.changeTab(link);
	},
	/**
	 * Shows the tab that corresponds to the clicked link
	 * and hides the others.
     * @param {Object} e Event object.
     * @returns {boolean} false
	 */
	updateHash: function(e){
		nfl.log("updateHash: "+ Event.element(e).tagName);
		var link	= null;
		if(Event.element(e).up('ol')){
			if(Event.element(e).up('ol').identify() == this.tabListId){
				/* grab this elements parent li first */
				if(Event.element(e).tagName != 'LI'){
					link = Event.element(e).up('li').down('a');
				}else{
					link	= Event.element(e).down('a');
				}
			}
		}
		if(link === null){
			switch(Event.element(e).tagName){
				case "A":
					link	= Event.element(e);
					break;
				case "LI":
					link	= Event.element(e).down('a');
					break;
				case "DIV":
					link	= Event.element(e).up().down('a');
					break;
				case "SPAN":
					link	= Event.element(e).up('a');
					break;
				case "IMG":
					link	= Event.element(e).up('a');
					break;
				case "OL":
					//link	= Event.element(e).down('li a');
					break;
				default:
					break;
					
			}
		}
		if(link != null){
			this.updateHashTabParam(link.href.match(/#(.*)$/)[1]);
			Event.stop(e);
		}
		if(Event.element(e).tagName	== 'A' || Event.element(e).tagName	== 'SPAN'){Event.stop(e);}
	}, 
	updateHashTabParam: function(tabKey){
		//var hashParams	= window.location.hashparams.get();
		//hashParams.set(this.tabSetId,tabKey);
		var hashParams	= window.location.hashparams.get();
		if(hashParams == null || (hashParams != null && hashParams.get(this.tabSetId) != tabKey)){
			hParams	= new Hash();
			hParams.set(this.tabSetId,tabKey);
			window.location.hashparams.set(hParams);
		}
	},
	changeTab: function(link){
		if ((link != document) && (! Element.hasClassName(link.parentNode, 'active'))) {

			var sectionList, sectionLis, sectionToShow, sections, section, sectionLi, updateLocation;
			
			try{
				sectionList		= $(link).up('ol');
			}catch(e){
				nfl.log("changeTab: error: "+ error.message);
			}
			sectionLis		= sectionList.immediateDescendants();
			sectionToShow	= link.href.match(/#(.*)$/)[1];
			sections		= sectionList.next().immediateDescendants();
			updateLocation	= true;

			for (var i = 0, len = sections.length; i < len; i++) {
				section		= sections[i];
				sectionLi	= sectionLis[i];
				
				if (section.id == sectionToShow) {
					section.show();
					if(sectionList.firstDescendant() === sectionLi){ sectionLi.addClassName('first-active'); }
					sectionLi.addClassName('active');
					sectionList.className = "tab-list section-list active-tab-" + i;
					if(this.keepstate){
						//var prevScrollOffsetY	= window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
						//window.location	= (window.location.href.replace(/#(.*)$/,'') +"#tab:"+sectionToShow);
						//window.location.replace(window.location.href.replace(/#(.*)$/,'') +"#tab:"+sectionToShow)
						//window.scroll(window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft,prevScrollOffsetY)
					}
				}
				else {
					section.hide();
					if (sectionLi.hasClassName('first-active')) { sectionLi.removeClassName('first-active'); }
					if (sectionLi.hasClassName('active')) { sectionLi.removeClassName('active'); }
				}
				section = sectionLi = null;
			}
		}
		/* return false; */
	},
	/**
	 * Initiates all tab sets on page, creating tab structure;
	 * 
	 * div.tab-set#id
	 *  ol.section-list.active-tab-0
	 *    li.active#id-tab-1.tab-1
	 *      a[href="#unique-id"]
	 *        span.ir
	 *  div.section-holder
	 *    div.section#unique-id
	 *
     * @param {Object} e Event object.
     * @returns {boolean} true
	 */
	activate: function(tabsetClassName) {
		$$('.'+ tabsetClassName +'').each(function(tabSet) {
			var ol, sections, li, heading, a, height, offsetHeight, holder, tabSetId, akEl, ak;
			
			ol			= document.createElement('ol');
			holder		= document.createElement('div');
			height		= 0;
			sections	= tabSet.immediateDescendants();
			tabSetId	= tabSet.id || false;
			this.sections	= tabSet.immediateDescendants();
			this.tabSetId	= tabSet.identify();
			
			Element.addClassName(tabSet, 'in-use-tab-set');
			Element.addClassName(ol, 'section-list');
			Element.addClassName(ol, 'active-tab-'+this.defaultTabIndex);
			Element.addClassName(ol, 'tab-list');
			Element.addClassName(holder, 'section-holder');

			for (var i = 0, len = sections.length; i < len; i++) {
				section = sections[i];
	
				if (section.hasClassName('section') && section.id) {
					heading		= $A(section.select('.heading')).first();
					li			= document.createElement('li');
					akEl		= $A(section.select('.section-key')).first();
					a			= document.createElement('a');
					a.href		= "#" + section.id;
					a.title		= section.id;
					a.innerHTML = heading.innerHTML;

					if (akEl && akEl.accessKey) {
						ak		= akEl.accessKey;
						akEl.parentNode.removeChild(akEl);
						akEl = null;
						a.accessKey = ak;
						a.title = "Access Key: '"+ak+"'";
					}

					Element.addClassName(li, 'tab-' + i);
					
					var indicator	= document.createElement('div');
					Element.addClassName(indicator, 'ir');
					li.appendChild(indicator);
					li.appendChild(a);
					
					ol.appendChild(li);
					
					offsetHeight = section.offsetHeight;
	
					if (height < section.offsetHeight) { height = offsetHeight }
					//if (i > 0) { section.hide() }
					if (i != this.defaultTabIndex) { section.hide() }
					else {
						li.addClassName('active');
						if(i == 0){
							li.addClassName('first-active');
						}
					}
					if(i == 0){
							li.addClassName('first');
					}
					// Allow for unique styles by creating unique CSS hooks
					if (this.tabSetId) {
						/*
						var span = document.createElement('span');
						Element.addClassName(span, 'ir');
						li.appendChild(span);
						*/

						li.id = this.tabSetId + '-tab-' + i;
					}
					
					holder.appendChild(section);
	
					heading = li = a = null;
				}
			}
			
			if(this.autoHeight){
				holder.setStyle({height: height+'px'})
			}
			
			tabSet.insertBefore(holder, tabSet.firstChild);
			tabSet.insertBefore(ol, tabSet.firstChild);
			this.tabListId	= ol.identify();
			Event.observe(ol, 'click', this.updateHash.bindAsEventListener(this));
			//Event.observe(ol, 'click', this.showTab.bindAsEventListener(this));
			
			if(location.hash && typeof location.hash == "string"){
				var hParams		= window.location.hashparams.get();
				if(typeof hParams.get(this.tabSetId) != 'undefined'){
					var anchorEles		= $$('#'+ this.tabSetId +' ol li a[href="#'+ (hParams.get(this.tabSetId)) +'"]');
					if(anchorEles.length){
						this.changeTab(anchorEles[0]);
					}
				}
			}
			return true;
		}.bind(this));
		
		/* fire off event that can be intercepted */
		try{document.fire(this.tabSetId+":loaded");}catch(e){}
		return true;
	}	
}
// Weird IE6 fix
if (Prototype.Browser.IE) {
	Event.observe(window, 'load',  function(){
		var ft = $('ft');
		if (!ft) return;
		ft.style.position = 'static';
		ft.style.position = '';
		ft = null;
	});
}