var tabset = new Class( {
	initialize: function(tabNavigation, tabGroup, selectedTab, tabClassSelector) {
		this.tabNavigation = tabNavigation;
		this.tabGroup = tabGroup;
		this.selectedTab = selectedTab;
		this.tabContainers = $$(tabClassSelector);
		
		(this.tabContainers).each(function(el, i) {
			if(el != selectedTab) {
				el.setStyle("display", "none");
			}	
		});
		
		(this.tabNavigation).each(function(el, i) {
			if(el.hash == "#"+selectedTab.id) {
				el.addClass("on");
			}
			el.bindObj = this;
			el.onclick = this.selectTab;
		}, this);
	},
	selectTab: function () {
		this.bindObj.hideAllTabs();
		//var targetTabIDWithHash = $(this).getProperty("href");
		var targetTabIDWithHash = this.getAttribute("href",2);
		var targetTab = $E("div"+targetTabIDWithHash);
		
		$$(targetTabIDWithHash).setStyle("display", "block");
		this.addClass("on");
		return false;
	},
	hideAllTabs: function() {
		(this.tabContainers).each(function(el, i) {
			el.setStyle("display", "none");	
		});
		
		(this.tabNavigation).each(function(el, i) {
			el.removeClass("on");
		});
	}
});

var tabSetManifesto = new Class({
	initialize: function(tabs, tabHeading){
		if (!tabs[0] || !tabHeading ){ return false ;}
		
		var tabUl = new Element('ul');
		var fistTab = '<li class="first"><a href="javascript:void(0)">All<span class="tl"></span><span class="tr"></span></a></li>';
		tabUl.setHTML(fistTab);
		
		tabUl.inject(tabs[0]);
		
		var newTabs = $$("div#tabSetManifesto div.tabs ul");
		
		for(i=0; i < tabHeading.length - 1; i++){
			
			if (tabHeading[i].innerHTML.toLowerCase() == 'recycle'){
				var tabList = new Element('li',{'class': 'current'});
				
			}else{
				var tabList = new Element('li');
			}
						
			var linkHtml = '<a href="javascript:void(0)" ' + 'name=' + tabHeading[i].innerHTML + '>' + tabHeading[i].innerHTML;
			var tabHtml = '<span class="tl"></span><span class="tr"></span></a>';
			
			tabList.setHTML(linkHtml + tabHtml);
			tabList.inject(newTabs[0]);			
			tabHeading[i].addClass('postit')
		}
		
		var tabLinks = $$("div#tabSetManifesto div.tabs ul li a");
		
		for(i=0; i< tabLinks.length; i++){
			if (i ==  0){
				tabLinks[i].addEvent('click', this.showAlltabs);
			}else{
				tabLinks[i].addEvent('click', this.filterTab);
			}
		}
		//default to 'recycle' tab
		var tabGroup = $$("div#tabSetManifesto div.tabCont ul");

		for(i=0; i < tabGroup.length; i++){
			if(tabGroup[i].className.toLowerCase() == 'recycle'){
				tabGroup[i].style.display = 'block';
			}else{				
				tabGroup[i].style.display = 'none';				
			}
		}
		
	},
	
	filterTab: function(){
		var tabLists = $$("div#tabSetManifesto div.tabs ul li");
		var tabGroup = $$("div#tabSetManifesto div.tabCont ul");
		
		for(i=0; i < tabLists.length; i++){
			tabLists[i].removeClass('current');
		}
		
		this.getParent().addClass('current');
		for(i=0; i < tabGroup.length; i++){
			if(tabGroup[i].className.toLowerCase() == this.name.toLowerCase()){
				tabGroup[i].style.display = 'block';
			}else{				
				tabGroup[i].style.display = 'none';				
			}
		}
		
		return false;
	},
	showAlltabs: function(){
		var tabLists = $$("div#tabSetManifesto div.tabs ul li");
		var tabGroup = $$("div#tabSetManifesto div.tabCont ul");
		
		for(i=0; i < tabLists.length; i++){
			tabLists[i].removeClass('current');
		}
		
		this.getParent().addClass('current');
		
		for(i=0; i < tabGroup.length; i++){
				tabGroup[i].style.display = 'block';
		}		
		return false;
	}
});

var clearInput = new Class({
	initialize: function(inputName){
		if (!inputName[0]){ return false; }
		
		inputName[0].addEvent('focus', this.clear);
	},
	clear : function(){		
		 if (this.defaultValue == this.value){
			this.value = "";
			this.removeClass('defaultName');
		 }
	}	
})
	
window.addEvent('domready', function(){
	var myTabs = new tabset($$("div#crossSell ul.tabNavigation li a"), "mygroup", $("score1"), $$("div#crossSell div.score"));
	var myPsiTabs = new tabset($$("div#productSupportInfo ul.tabNavigation li a"), "myPsigroup", $("psiTab1"), $$("div#productSupportInfo div.score"));
	var myStoreDetailsTabs = new tabset($$("div#storeDetailsTabControl ul.tabNavigation li a"), "myStoreDetailsgroup", $("storedetailstab1"), $$("div#storeDetailsTabControl div.score"));
	var myManifestoTabs = new tabSetManifesto($$("div#tabSetManifesto div.tabs"), $$("div#tabSetManifesto div.tabCont h4"));
	var manifestoClearIput = new clearInput($$("div.createManifesto input.defaultName"))
});