var WMX = WMX || {};
WMX.Tabs = WMX.Tabs || {};

WMX.Tabs.ClientTabStrip = Class.create({
	initialize: function(id) {
		this.wrapper = $(id);
		if (!this.wrapper) return;
		this.tabs = $A(this.wrapper.down('ul.tabs').select('li'));
		this.contents = this._getContents();
		if (this.tabs.length != this.contents.length) return;
		this.tabs.each(this.initTab.bind(this));

		var selectedIndex = $(this.wrapper.identify() + '_index').value;
		if (selectedIndex)
			this._select(selectedIndex);
		else if (!this.selected)
			this._select(0);
		this.flashVideoWatched = false;
		this.flashVideoTab = null;
	},
	initTab: function(li, i) {
		li.observe('click', this._onClick.bind(this, i))
		  .observe('mouseover', this._onMouseOver.bind(this))
		  .observe('mouseout', this._onMouseOut.bind(this));
		if (li.hasClassName('selected')) {
			if (!this.selected) {
				this.contents[i].addClassName('selected');
				this.selected = li;
			} else {
				li.removeClassName('selected');
			}
		}
	},
	_getContents: function() {
		var contents = $A(this.wrapper.childElements());
		// Remove the UL element... not necessarily first element
		return contents.without($(this.wrapper.down('ul.tabs')));
	},
	_select: function(i) {
		if (this.selected === this.tabs[i]) return;
		this.tabs.each(function(tab) { tab.removeClassName('selected'); });
		this.contents.each(function(content) { content.removeClassName('selected'); });
		this.tabs[i].addClassName('selected');
		this.contents[i].addClassName('selected');
		this.selected = this.tabs[i];
		$(this.wrapper.identify() + '_index').value = i;
		
		var tab = null;
		if (this.flashVideoWatched && (!this._tabContainsFlashVideo(this.contents[i])))
		{
			tab = this.flashVideoTab;				
			this.flashVideoWatched = false;
		}
		else if (!this.flashVideoWatched &&	(this._tabContainsFlashVideo(this.contents[i])))
		{
			tab = 'reload';	
			this.flashVideoTab = this.contents[i];
			this.flashVideoWatched = true;	
			createEvent('Flash Video Viewed','FlashVideo','');
			waPost();
		}
		else
		{
			tab = null;
		}
		
		var memo = {
			name : tab,
			tabname : this.selected.innerText
		};
		
		// send event to scrollers to recalculate their appearance
		document.fire("Tab:Switch", memo);
	},
	_onClick: function(i, e) {
		e.stop();
		this._select(i);
	},
	_onMouseOver: function(e) {
		e.stop();
		e.findElement('li').addClassName('over');
	},
	_onMouseOut: function(e) {
		e.stop();
		e.findElement('li').removeClassName('over');
	},
	_tabContainsFlashVideo: function(oDiv)
	{
		var flashVideoFound = false;
		var oIframes = $(oDiv).getElementsBySelector('iframe');
		
		if (oIframes.length > 0)
		{
			var oMediaFrameIframe = null;
			oIframes.each(function(oIframe){
				if (oIframe.id == "mediaframe")
				{
					oMediaFrameIframe = $(oIframe);
					flashVideoFound = true;
				}			
			});
		}
		return flashVideoFound;		
	}
});

WMX.Tabs.ClientTabStrip.initTabControls = function() {
	WMX.Tabs.ClientTabStrip.tabStrips = [];
	$$('.tabs-wrapper').each(function(wrapper, index) {
		WMX.Tabs.ClientTabStrip.tabStrips[index] = new WMX.Tabs.ClientTabStrip(wrapper);
	});
};