// JScript File

/********** Image Map **********/

var objImages = {
"currentPage" : 0,
"currentImage":0,
"firstThumb":0,
"totalThumbs":5,
"imageFolder": "",
"images" :[] ,
		   
		   
	init : function(arrayAsJSONText, imgFolder) {
		this.images=eval(arrayAsJSONText) ;		
		this.imageFolder = imgFolder;
		this.currentPage=0;
		this.currentImage=0;
		this.setLargeImage (this.currentImage);
		
		if (this.images.length > this.totalThumbs)
		
		$("r_scroll").style.visibility="visible";
		
		else
		$("r_scroll").style.visibility="hidden";
		//this.moveThumb(0);
		
	}, 
		   
	
		     
	setLargeImage:function(imageId){
		if (imageId != null)
		this.currentImage= imageId;
		img = this.images[this.currentImage];
		$('div_img').src=this.imageFolder + "styles/" + this.images[this.currentImage].large;	
		if (img.maps != null && img.maps.length >0 && $('map') != null){

			$('div_img').useMap="#map"+imageId;
			var outputString= "<map name=\"map"+imageId+"\">";
		  	for (i = 0; i < img.maps.length; i ++){
		  		if (img.maps[i].coords !=""){
					outputString += "<area shape=\"" + img.maps[i].shape + "\"";
	        		outputString += " coords=\"" + img.maps[i].coords + "\"";
	        		switch (img.maps[i].sellStatus)
	        		{
	        		case "available":	        		
						
						outputString += " onmouseover=\"ddrivetip(tipImg+'Click for Detail');\"";
	        			
	        			outputString += " href=\"javascript:getProductContent('"+img.maps[i].prodId+"')\"";
	        		break;
	        		case "notAvailable":
	        		case "soldOut":
						outputString += " onmouseover=\"ddrivetip('So Hot, It\\&#39;s Sold Out',null,110);\"";
	        			outputString += " href=\"#\"";	        			
	        			outputString += " onclick=\"return false;\"";
	        		break;
	        		case "comingSoon":
							outputString += " onmouseover=\"ddrivetip('Coming Soon','white',70);\"";
						
	        			outputString += " href=\"#\"";	        			
	        			outputString += " onclick=\"return false;\"";
	 				break;
	 				}//close switch
	 				outputString += " onmouseout=\"hideddrivetip();\" />";
	 			//outputString += "  />";
	 			
        		}
        			
			}
			outputString += "</map>";
			$('map').update(outputString);
		}
		else
		{ 
		$('map').update('');
		$('div_img').useMap="";}
	
		//this.imageNav(imageId);
		this.setContent(imageId);
	},
	 
	/*imageNav: function(imageId){
		var str= "";
		this.currentImage= imageId;
		img = this.images[this.currentImage];
		
			var outputString= "<div>&nbsp;</div><div>&nbsp;</div><div>&nbsp;</div><div>&nbsp;</div><div>&nbsp;</div>"; //placeholders

		  	for (i = 0; i < this.images.length; i ++){
		  		if (this.images[i].user !=""){
                    if(i == this.currentImage){
                    	outputString += "<div class=\"selected\"><img src=\""+ this.imageFolder + "thumb_color/" + this.images[i].user+ "\" /></div>";
                    }
                    if(i != this.currentImage){
                    	outputString += "<div><a href=\"#\" onClick=\"javascript:objImages.swapImage(" +i+ ");\"><img src=\""+ this.imageFolder + "thumb_bw/" + this.images[i].user+ "\" /></a></div>";
        			}
			}
			}

		$("imageBoxSolution").update(outputString);
	},*/
	 
	setContent: function(imageId){
		var str= "";
		this.currentImage= imageId;
		img = this.images[this.currentImage];
		
		// set question and answer
		$('q_userimg').src=this.imageFolder + "large/" + this.images[this.currentImage].user;	
		$('q_expertimg').src=this.imageFolder + "experts/" + this.images[this.currentImage].expert + ".jpg";	
		var expert_sig ="<img src=\""+ this.imageFolder + "expert_sig/" + this.images[this.currentImage].expert + "_sig.gif"+ "\" />";
		var q_str = this.images[this.currentImage].question;
		var a_str = this.images[this.currentImage].answer;
		
		// set large images
		/*var outputString= ""; //placeholders

		for (i = 0; i < this.images.length; i ++)
		{
			if (this.images[i].user !="")
			{
				if(i == this.currentImage)
					outputString += "<div class=\"selected\"><img src=\""+ this.imageFolder + "thumb_color/" + this.images[i].user+ "\" /></div>";
				else
					outputString += "<div><a href=\"#\" onClick=\"javascript:objImages.swapImage(" +i+ ");\"><img src=\""+ this.imageFolder + "thumb_bw/" + this.images[i].user+ "\" /></a></div>";
			}
		}

		$("imageBoxSolution").update(outputString);
		*/
		this.moveThumb(0);
		//alert(q_str);
		$('question').innerHTML = q_str;
		//alert(a_str + expert_sig);
		$('answer').innerHTML = a_str + expert_sig;
	},
	
	getCurrentProducts: function(){
		return this.images[this.currentImage].products;
	},
	
	getCurrentImage :function (){
		return this.imageFolder + this.images[this.currentImage].large;
	},
		   
	navigateImage: function (theImage){
		var newCurrentImage = this.currentImage + eval(theImage);
		if (newCurrentImage < 0)
		   	newCurrentImage = this.images.length-1;
		if (newCurrentImage >= this.images.length)
		   	newCurrentImage= 0;
		this.setLargeImage(newCurrentImage, true);
	},
	
	swapImage: function (theImage){
		var newCurrentImage = eval(theImage);
		this.setLargeImage(newCurrentImage, true);
	},
	
	page: function(thePage){
		this.currentPage = this.currentPage + eval(thePage)
		if (this.currentPage < 0)
		   this.currentPage = this.totalPages-1;
		if (this.currentPage >= this.totalPages)
		   this.currentPage= 0;
		var startNdx = this.currentPage * this.pageSize;
		this.displayImages();
	},
		   
	show :function (x){
		$('status').update(x);
	}
	,
	
	moveThumb:function(x) 
	{
	var outputString="";
	this.firstThumb = this.firstThumb  + x;
	if (this.firstThumb >0)
	$("l_scroll").style.visibility="visible";
	else
	$("l_scroll").style.visibility="hidden";
		if (this.firstThumb + this.totalThumbs >= this.images.length)
		
		$("r_scroll").style.visibility="hidden";
	else
	$("r_scroll").style.visibility="visible";
		
	if (this.currentImage < this.firstThumb || (this.firstThumb + this.totalThumbs) <= this.currentImage )
	{	
	this.setLargeImage(this.firstThumb );
	}
	for (i = this.firstThumb ; i < this.images.length; i ++){
		  		if (this.images[i].user !=""){
                    if(i == this.currentImage)
                    	outputString += "<div class=\"selected\"><img src=\""+ this.imageFolder + "thumb_color/" + this.images[i].user+ "\" /></div>";
                    else
                    	outputString += "<div><a href=\"#\" onClick=\"javascript:objImages.swapImage(" +i+ ");\"><img src=\""+ this.imageFolder + "thumb_bw/" + this.images[i].user+ "\" /></a></div>";
                    	}
                    	}
            $("imageBoxSolution").update(outputString);
	}
}