var WindowShadeValues=new Array();
var autoFlag=true;
var forwardFlag = true;
var runFlag = true;
var mSecs = 0;

function displayWindowShade(WindowShadeArray)
{
	var currentIndex = 1;
	var WindowShade = WindowShadeArray.split("||");
	var maxValue = WindowShade.length;
	maxValue = maxValue - 1;
	var randomImageNum = 1;
		
	var indexNumberForImage = 1;

	WindowShadeValues[1]=new Array();
	var thisImage = WindowShade[0];
	thisImage = thisImage.split("~");
	var randomtitle = thisImage[0];
	var randomstate = thisImage[1];
	var randomdescription = thisImage[2];
	var randommain_image = thisImage[3];
	var randomattraction_link = thisImage[4];
	var randomhome_link = thisImage[5];
	var randomhome_altText = thisImage[6];
	

	randomstate = randomstate.toUpperCase();	

	WindowShadeValues[1][0]=randomtitle;
	WindowShadeValues[1][1]=randomstate;
	WindowShadeValues[1][2]=randomdescription;
	WindowShadeValues[1][3]=randommain_image;
	WindowShadeValues[1][4]=randomattraction_link;
	WindowShadeValues[1][5]=randomhome_link;
	WindowShadeValues[1][6]=randomhome_altText;
	randomhome_altText = randomhome_altText.replaceAll("'","'");
	randomhome_altText = randomhome_altText.replaceAll(""",'"');
	
	var divHtml='<div id="imageDiv"><img id="mainimgslider" src="'+randommain_image+'" width="470" height="245" title="'+randomhome_altText+'" /></div>';
	divHtml = divHtml + '<div id="textThumbDiv"><div id="textContentDiv"><div class="titleBlueText"><a href="randomhome_link" onClick="changeBoolianVar();">'+randomtitle+'</a></div><div class="textGray">'+randomstate+'</div><div class="textRegularBlack">'+randomdescription+'</div>';
	divHtml = divHtml + '<div id="bulletPointsDiv"><ul id="imageLinkPoint"><li><a href="'+randomhome_link+'" onClick="changeBoolianVar();">'+windowShadeDiscoverLink+'</a></li>';
       if(randomattraction_link != "")
	{
		divHtml = divHtml + '<li><a href="'+randomattraction_link+'" onClick="changeBoolianVar();">'+windowShadeAttractionLink1+' '+randomtitle+' '+windowShadeAttractionLink2+'</a></li>';
	}
       divHtml = divHtml + '</ul></div></div><div id="pixelBarSmall"><img src="'+arrImagesPath+'pixelBar.gif" border="0" /></div><div class="imageThumb"><a href="javascript:void(0)"><img src="'+randommain_image+'" title="'+randomhome_altText+'" height="42" width="42" onMouseOver="changeDetailMouseOver('+"'"+'1'+"'"+')"></a></div>';
            
	for(var index=1; index<maxValue; index++)
	{
		indexNumberForImage++;

		WindowShadeValues[indexNumberForImage]=new Array();

		var thisImage = WindowShade[index];
		thisImage = thisImage.split("~");
		var title = thisImage[0];
		var state = thisImage[1];
		var description = thisImage[2];
		var main_image = thisImage[3];
		var attraction_link = thisImage[4];
		var home_link = thisImage[5];
		var alt_text = thisImage[6];
		
		WindowShadeValues[indexNumberForImage][0]	=title;
		WindowShadeValues[indexNumberForImage][1]	=state;
		WindowShadeValues[indexNumberForImage][2]	=description;
		WindowShadeValues[indexNumberForImage][3]	=main_image;
		WindowShadeValues[indexNumberForImage][4]=attraction_link;
		WindowShadeValues[indexNumberForImage][5]=home_link;
		WindowShadeValues[indexNumberForImage][6]=alt_text;
				
		divHtml = divHtml + '<div class="imageThumb"><a href="javascript:void(0)" ><img src="'+main_image+'" title="'+alt_text+'" id="icon'+indexNumberForImage+'" height="42" width="42" onMouseOver="changeDetailMouseOver('+"'"+indexNumberForImage+"'"+');" class="dimImage"></a></div>';
	}
	
	divHtml = divHtml + '</div>';
	document.getElementById('centerShadowBar').innerHTML=divHtml;	
	document.images.mainimgslider.alt = randomhome_altText;
	changeAuto();
}

function forward()
{
	if(forwardFlag == true)
	{
		if(currentIndex <= maxImages)
			currentIndex++;	
	
		changeImg();

		if(currentIndex == maxImages)
			currentIndex = 0;	

		changeAuto();
	}
}

function changeDetailMouseOver(changeIndex)
{	
	currentIndex=changeIndex;
	changeImg();
}

function changeDetailOnClick(changeIndex)
{
	changeBoolianVar();
	currentIndex=changeIndex;
	/*changeImg();*/
}

function changeImg()
{
	var imageName = WindowShadeValues[currentIndex][3];
	imageName = imageName.replaceAll("&apos;","'");
	imageName = imageName.replaceAll("&amp;","&");
	document.images.mainimgslider.src = imageName;

	var alt_text = WindowShadeValues[currentIndex][6];
	alt_text = alt_text.replaceAll("&apos;","'");
	alt_text = alt_text.replaceAll("&quot;",'"');
	document.images.mainimgslider.title = alt_text;

	divHtml = '<div id="textContentDiv"><div class="titleBlueText"><a href="'+WindowShadeValues[currentIndex][5]+'" onClick="changeBoolianVar();">'+WindowShadeValues[currentIndex][0]+'</a></div><div class="textGray">'+WindowShadeValues[currentIndex][1].toUpperCase()+'</div><div class="textRegularBlack">'+WindowShadeValues[currentIndex][2]+'</div>';
	divHtml = divHtml + '<div id="bulletPointsDiv"><ul id="imageLinkPoint"><li><a href="'+WindowShadeValues[currentIndex][5]+'" onClick="changeBoolianVar();">'+windowShadeDiscoverLink+'</a></li>';
	
	if(WindowShadeValues[currentIndex][4] != "")
	{
		divHtml = divHtml + '<li><a href="'+WindowShadeValues[currentIndex][4]+'" onClick="changeBoolianVar();">'+windowShadeAttractionLink1+' '+WindowShadeValues[currentIndex][0]+' '+windowShadeAttractionLink2+'</a></li>';
	}
	divHtml = divHtml + '</ul></div></div><div id="pixelBarSmall"><img src="'+arrImagesPath+'pixelBar.gif" border="0" /></div>';
	
	for(var index=1; index<=maxImages; index++)
	{
		alt_text = "";
		alt_text = WindowShadeValues[index][6];
		alt_text = alt_text.replaceAll("&apos;","'");
		alt_text = alt_text.replaceAll("&quot;",'"');
				
		if(index == currentIndex)
			divHtml = divHtml + '<div class="imageThumb"><a href="javascript:changeDetailOnClick('+"'"+index+"'"+');"><img src="'+WindowShadeValues[index][3]+'" title="'+alt_text+'" id="icon'+index+'" height="42" width="42" border="0" class="noDimImage"></a></div>';
		else
			divHtml = divHtml + '<div class="imageThumb"><a href="javascript:void(0);"><img src="'+WindowShadeValues[index][3]+'" title="'+alt_text+'" height="42" width="42" id="icon'+index+'" onMouseOver="changeDetailMouseOver('+"'"+index+"'"+');" class="dimImage"></a></div>';
	}


	document.getElementById('textThumbDiv').innerHTML=divHtml;
	
	if(currentIndex == maxImages)
		currentIndex = 0;
}

function setBorder(getId,changeIndex){
	document.getElementById(getId).className = 'noDimImage';
	changeBoolianVar();
	currentIndex=changeIndex;
	
}

function removeBorder(getId,changeIndex){
	
	if(autoFlag == false){
		autoFlag = true;
		forwardFlag = true;
		currentIndex=changeIndex;
		if(currentIndex == maxImages)
			currentIndex = 0;
		document.getElementById(getId).className = 'noDimImage';
		
		clearTimeout (mSecs);
		forward();
	}else{
		document.getElementById(getId).className = 'noDimImage';
	}
}

function changeAuto()
{	
	
	if(autoFlag == true)
	{
		mSecs = setTimeout("forward()", 3000);
	}
}

function changeBoolianVar()
{
	if(autoFlag == true)
	{
		forwardFlag = false;
	}
	autoFlag = false;		
}