/* class for individual slides */
function InterplayerItem( vid , url , imgUrl , display_name , headline, description, display_url){
	this.url = url;
	this.imgUrl = imgUrl;
	this.headline = headline;
	this.display_name = display_name;
	this.description = description;
	this.display_url = display_url;	
	this.parentBrowser = null;
	this.vid = vid;
}						
							
/* class for the slide player */
function InterplayerBrowser( elementId, leftArrowId, rightArrowId, displayItemsCount , scrollItemsCount, imgSrc ){
	this.elementId = elementId;
	this.leftArrowId = leftArrowId;
	this.rightArrowId = rightArrowId;
	this.displayItemsCount = displayItemsCount;		// total number of items to be displayed at one time
	this.scrollItemsCount = scrollItemsCount;		// how many items to scroll by when clicking next or previous
	this.itemArray = new Array();
	this.itemIndex = 0;
	this.itemPage = 1; // page for progress bar
	this.imgSrc = imgSrc;
	this.leftImgOff = this.imgSrc + "vip_ScrollBack_btn_60x24.gif";
	this.leftImgOn = this.imgSrc + "vip_ScrollBack_btn_60x24.gif";
	this.rightImgOff = this.imgSrc + "vip_scrollNext_btn_60x24.gif";
	this.rightImgOn = this.imgSrc + "vip_scrollNext_btn_60x24.gif";
	this.pB = "progressBar";
	
	// self-register
	//this = window.InterplayerBrowserInstance;
}


InterplayerBrowser.prototype.showButtons = function(){
	if (document.createElement){
	
		//begin left arrow
		MOTHleftArrow = document.getElementById(this.leftArrowId);
		//create image
		isOff = (this.itemIndex == 0);
		MOTHleftArrowImg = document.createElement("IMG");
		state = (isOff) ? this.leftImgOff : this.leftImgOn;
		MOTHleftArrowImg.setAttribute("src", state );
		MOTHleftArrowImg.setAttribute("name", "moth_reverse"); 
				
		//create anchor
		if (!isOff){
			MOTHleftArrowAnchor = document.createElement( "A" );
			MOTHleftArrowAnchor.setAttribute("href", "javascript:browser.update(0)");
			MOTHleftArrowAnchor.appendChild(MOTHleftArrowImg);
			MOTHleftArrow.appendChild(MOTHleftArrowAnchor);
		} else {
			MOTHleftArrow.appendChild(MOTHleftArrowImg);
		}
		//end left arrow

		//begin right arrow
		MOTHrightArrow = document.getElementById(this.rightArrowId);
		//create image
		isOff = ((this.itemIndex + this.displayItemsCount) >= this.itemArray.length);
		MOTHrightArrowImg = document.createElement("IMG");
		state = (isOff) ? this.rightImgOff : this.rightImgOn;
		MOTHrightArrowImg.setAttribute("src", state );
		MOTHrightArrowImg.setAttribute("name", "moth_forward"); 
		//create anchor
		if (!isOff){	
			MOTHrightArrowAnchor = document.createElement("A");
			MOTHrightArrowAnchor.setAttribute("href" , "javascript:browser.update(1)");
			MOTHrightArrowAnchor.appendChild(MOTHrightArrowImg);
			MOTHrightArrow.appendChild(MOTHrightArrowAnchor);
		} else {
			MOTHrightArrow.appendChild(MOTHrightArrowImg);
		}	
		//end right arrow
		
		// begin progress bar
		pB = document.getElementById(this.pB);
		progressBarImg = document.createElement("IMG");
		pbImg = this.imgSrc + "vip_scrollBox_ON" + this.itemPage + "_76x24.gif";
		progressBarImg.setAttribute("src", pbImg );
		pB.appendChild(progressBarImg);
		// end progress bar
	}
}


InterplayerItem.prototype.write = function(){
	if( document.createElement ){
		parentElement = document.getElementById( this.parentBrowser.elementId );
		if( parentElement.tagName == "TABLE" && this.parentBrowser.getBodyRow ){
			
			
			
			// create body
			tdObj = document.createElement( "TD" );
			tdObj.className = "p1";
			
			headlineObj = document.createElement( "DIV" );
			headlineObj.className = "sliderhead";
			headlineLinkObj = document.createElement( "A" );
			headlineLinkObj.setAttribute( "href" , this.url );
			headlineLinkObj.appendChild( document.createTextNode( this.headline ) );
			headlineObj.appendChild( headlineLinkObj );			

			thumbObj = document.createElement( "DIV" );
			thumbObj.className = "slt";	
			thumbLinkObj = document.createElement( "A" );
			thumbLinkObj.setAttribute( "href" , this.url );

			thumbImgObj = document.createElement( "IMG" );
			thumbImgObj.setAttribute( "src" , this.imgUrl );
			thumbImgObj.setAttribute( "alt" , this.headline );
			
			thumbLinkObj.appendChild( thumbImgObj );
			thumbObj.appendChild( thumbLinkObj );


			playVideoObj = document.createElement( "DIV" );
			playVideoObj.className = "sliderlink";			
			playVideoLinkObj = document.createElement( "A" );
			playVideoLinkObj.setAttribute( "href" , this.url );
			
			playVideoImgObj = document.createElement( "IMG" );
			playVideoImgObj.setAttribute( "src" , "http://images.livescience.com/template_images/interplayer/vip_PlayVideoBTN_84x16.gif" );
			playVideoImgObj.setAttribute( "alt" , this.headline );
			
			playVideoLinkObj.appendChild( playVideoImgObj );
			playVideoObj.appendChild( playVideoLinkObj );			
			
			tdObj.appendChild( headlineObj );
			tdObj.appendChild( thumbObj );
			tdObj.appendChild( playVideoObj );
			
			this.parentBrowser.getBodyRow().appendChild( tdObj );			
			
		}
	}
}							

InterplayerBrowser.prototype.addItem = function( item ){
	if( item instanceof InterplayerItem ){
		item.parentBrowser = this;
		this.itemArray.push( item );
				
	}
}			
							
InterplayerBrowser.prototype.update = function( doMoveRight ){
	tableObj = document.getElementById( this.elementId );
	
	//increment index count
	var origIndex = this.itemIndex;
	this.itemIndex = (doMoveRight) ? this.itemIndex + this.scrollItemsCount : this.itemIndex - this.scrollItemsCount;
	
	//set upper and lower bounds
	this.upperBound = this.itemArray.length - this.displayItemsCount;
	this.itemIndex = ((this.itemIndex + this.displayItemsCount) > this.itemArray.length) ? this.itemArray.length-this.displayItemsCount : this.itemIndex;
	this.itemIndex = (this.itemIndex < 0) ? 0 : this.itemIndex;
	this.itemPage = (this.itemIndex/this.scrollItemsCount) + 1;

	if(this.itemPage != Math.floor(this.itemPage)) {
		this.itemPage = Math.floor(this.itemPage) +1;
	}

	
	//update button images
	this.deleteAllChildrenOf(document.getElementById(this.leftArrowId));
	this.deleteAllChildrenOf(document.getElementById(this.rightArrowId));
	this.deleteAllChildrenOf(document.getElementById('progressBar'));
	this.showButtons();
	
	if (origIndex != this.itemIndex){
		//clear 
		//this.deleteAllChildrenOf( this.getHeaderRow() );
		this.deleteAllChildrenOf( this.getBodyRow() );
		
		// re-populate
		for( iUpdate=this.itemIndex ; iUpdate < (this.itemIndex + this.displayItemsCount) ; iUpdate++ ){
			this.itemArray[iUpdate].write();
			
			if( iUpdate < (this.itemIndex + this.displayItemsCount)-1) {

				vrObj = document.createElement( "TD" );
				vrObj.className="vr";
				vrObj.innerHTML='<img src="http://images.livescience.com/template_images/interplayer/vip_PlayQuest_Vert_1x104.gif" />';
				this.getBodyRow().appendChild( vrObj );
			
			}

		}
	}
}

InterplayerBrowser.prototype.getHeaderRow = function(){
	return document.getElementById( this.elementId ).getElementsByTagName( "THEAD" )[0].getElementsByTagName( "TR" )[0];
}

InterplayerBrowser.prototype.getBodyRow = function(){
	return document.getElementById( this.elementId ).getElementsByTagName( "TBODY" )[0].getElementsByTagName( "TR" )[0];
}

InterplayerBrowser.prototype.deleteAllChildrenOf = function( elementObj ){
	while (elementObj.hasChildNodes()) elementObj.removeChild(elementObj.firstChild);
}