/*
 * Copyright (c) 2006 Wazap AG, Germany -- all rights reserved.
 * Author: Danny Goersdorf
 */
 
 /*
  ** Example config **
   * csTabs[0] = new CsTab(2,"most wanted games ",null);
   * csTabs[0].addCover(new CsCover(123,"The SIMS","SIMS_Cover.jpg",90,64));
   *	
  */

	var csTabs = new Array();
	var d = document;
	var tmpSlideX = 0;
	var activeTab = null;
	var SLIDE_LEFT = 0;
	var SLIDE_RIGHT= 1;
	var slideTimer = null;
	var slideDistance = 520;
	var maxCoverH = 152;
	var coverWidth = 104;
	var delay = 1;
	
	/*
	 * TabObject class
	 */         
	function CsTab(id,title,covers){
		this.id = id;
		this.title = title;
		this.covers = covers;	//array of covers
		this.isActive = false;
	    this.addCover = function(cover){
    		if(this.covers==null)
				this.covers = new Array();
		    cover.parentTabId = this.id;
		    this.covers[this.covers.length] = cover;
		}
		    
		this.getNavLink = function(){
			return ('	<a href="javascript:void(0)" id="csTab' + this.id + '" onclick="slideToTab(' + this.id + ');blur()">' + this.title + '<\/a>'); 			   
		}
		   	
		this.setPosition=function(direction){
			ofsL = (direction== SLIDE_RIGHT)? slideDistance : 0 - slideDistance ;
		   				
		   	for(i=0;i<this.covers.length;i++){
		   		$(this.covers[i].htmlId()).style.left= ofsL + "px";
		   		ofsL+=coverWidth;
		   	}
		   		 	
		   	this.activate();
		}
		   	
		this.activate=function(){
			for(i=0;i<this.covers.length;i++)
		   		$(this.covers[i].htmlId()).style.display="block";
		   		 	 
		   	$("csTab" + this.id).style.color= "red";  
		}
		   	
	}
	
	/*
	 * TabCoverObject class
	 */ 	  
	function CsCover(id,title,cover,link,h,w){
		this.id = id;
		this.cover=cover;
		this.link=link;
		this.title=title;
		this.coverHeight = h;
	    this.coverWidth = w;
	    this.parentTabId = 0;
	    this.htmlId = function(){
	    	return "csi_" + this.parentTabId + "_" + this.id; 
	    }
		
		this.getDisplay=function(x,y){
		    
		    maxW = 64;
		    maxH = 91;
    		curH = this.coverHeight*64/this.coverWidth;
    		curW = this.coverWidth*91/this.coverHeight;
    		this.coverHeight = (curH > maxH) ? maxH : curH;
    		this.coverWidth = (curH > maxH) ? curW : maxW;
		    
			marginTop = (112 - (this.coverHeight))/2;
			out="";
		  	out+='<div id="'+ this.htmlId() + '" class="csCoverItem" style="display:none;left:' + x + 'px;">';
			out+='	<p class="tc csCover">';
			// width="64"
			out+='  	<a href="' + this.link + '"><img style="margin-top:' + marginTop + 'px" src="' + this.cover + '" alt="' + this.title  + '" title="' + this.title  + '"/><\/a>	';
			out+='	<\/p>	';
			out+='	<p class="csCoverText">';
			out+='	 <a href="' + this.link + '" title="' + this.title  + '">' + this.title +'<\/a>';
			out+='	<\/p>';
			out+='<\/div>';
			return out;
		 }
	}
	
	/*
	 * Generate output for slider
	 */   
	function displayCoverslider(){   	
		offsetLeft = 0;
		 
		out = "";
	    //write tabs 
	    out+= '<div class="csTabs">';   	 
		for(i=0;i< csTabs.length;i++){
			out+= csTabs[i].getNavLink();
			if(i < csTabs.length-1)
	        	out+= '&nbsp;|&nbsp;';
		}
		out+= '<\/div>';
		   		   	
		//write covers
	   	out+= '<div class="csContent">';
		out+= '	<a class="arrowL" href="javascript:void(0)" onclick="slideLeft();blur()"><img src="/images/arrows/left_arrow.gif" alt="" title="" /><\/a>';
		out+= '	<a class="arrowR" href="javascript:void(0)" onclick="slideRight();blur()"><img src="/images/arrows/right_arrow.gif" alt="" title="" /><\/a>';
		out+= '	<div id="csCovers" class="">';
	    
	    for(t=0;t<csTabs.length;t++){
	    	covers = csTabs[t].covers;
	        if(!covers) break;
	        for(c=0;c<covers.length;c++){
	        	out+= covers[c].getDisplay(offsetLeft,0);
	        	offsetLeft+=coverWidth;
	        }
	        	 	 	
	    }
	        	 
	    out+= '	<\/div>';
	    out+= '<\/div>';
	       
	    document.write(out);

		activeTab = csTabs[0];	
	    activeTab.activate();  
		setContentHeight()	       
	        
	}
	
	/*
	 * Get the next tab relative to the active tab
	 */    
	function getNextTab(){
		for(i=0;i<csTabs.length;i++){
			if(csTabs[i]== activeTab && i < csTabs.length-1)
		   		return csTabs[i+1];
		}	
		return csTabs[0];  
	}

	/*
	 * Get the previous tab relative to the active tab
	 */    
	function getPreviousTab(){
		for(i=0;i<csTabs.length;i++){
			if(csTabs[i]== activeTab && i > 0)
		   		return csTabs[i-1];
		}	
		return csTabs[csTabs.length-1]; 
	}
	
	/*
	 * Get the distance between the active and the new tab
	 */    	  
	function getTabDistance(newId){
		posActive = 0;
		posNew=0;
		for(i=0;i<csTabs.length;i++){
			if(csTabs[i].id == activeTab.id)
		   		posActive = i;
		   	if(csTabs[i].id == newId)
		   	   posNew = i;
		}	
		   	 	
		return (posNew - posActive); 
	}


	/*
	 * Get tab by id
	 */	   
	function getTabById(newId){
		for(i=0;i<csTabs.length;i++){
			if(csTabs[i].id == newId)
		   	   return csTabs[i];
		}	
		  	 	
		return csTabs[0];
	}
	
	/*
	 * Move covers one step right
	 */	  
	function slideRight(){
		if(slideTimer!=null)
			return;
		getNextTab().setPosition(SLIDE_RIGHT);
		activeTab = getNextTab();
		slideTimer = window.setInterval("moveCovers(1)",delay);
	}
		
	/*
	 * Move covers one step left
	 */	 		   
	function slideLeft(){
  		if(slideTimer!=null)
  			return;
		getPreviousTab().setPosition(SLIDE_LEFT);
		activeTab =  getPreviousTab();
		slideTimer = window.setInterval("moveCovers(0)",delay);
	}		
		
	/*
	 * Move covers to the selected tab
	 */	 	  
	function slideToTab(newTabId){
  		if(slideTimer!=null)
  			return;
		distance = getTabDistance(newTabId);
  		newTab = getTabById(newTabId);
	    if(distance < 0){//slideLeft
	    	newTab.setPosition(SLIDE_LEFT);
	        activeTab = newTab;
		   	slideTimer = window.setInterval("moveCovers(0)",delay);
	     }
      	
      	if(distance > 0){//slideRight
	    	newTab.setPosition(SLIDE_RIGHT);
	        activeTab = newTab;
		   	slideTimer = window.setInterval("moveCovers(1)",delay);
	    }
	}   
		 
	/*
	 * assign new coordinates to all covers
	 */	   
	function moveCovers(direction){
		for(t=0;t<csTabs.length;t++){
  			covers = csTabs[t].covers;
		   	for(i=0;i<covers.length;i++){
		   		cover = $(covers[i].htmlId());
	      	 	curLeft = parseInt(cover.style.left) + ((direction == SLIDE_LEFT)? 52:-52) ; 	
	      	 	cover.style.left = curLeft +"px";
	      	}
	    }
	      
	    //Check if the covers of the tab are in the right postion
	    if(parseInt($(activeTab.covers[0].htmlId()).style.left) == 0){
			window.clearInterval(slideTimer);
    	 	//cleanUP
			for(i=0;i<csTabs.length;i++){
				if(!(csTabs[i].id == activeTab.id)){//deactivate inactive tabs
			    	$("csTab" + csTabs[i].id).style.color= "";
					for(x=0;x<csTabs[i].covers.length;x++)
		   				$(csTabs[i].covers[x].htmlId()).style.display="none";
		   		}
		   	}
			slideTimer = null;
    	 }
	}
	      
	/*
	 * For IE we need to set a fixed hide of the cover container
	 */	  
	function setContentHeight(){
		var items = document.getElementById('csCovers').getElementsByTagName("div");
		for(i=0;i<items.length;i++)
		if(items[i].offsetHeight > maxCoverH){
			maxCoverH = items[i].offsetHeight;
		}
		document.getElementById('csCovers').style.height = maxCoverH +"px"; 
	 }