// I M I R A G E
//
// Bills Khakis shop functions
// Author: Brion Updegrove (updegroveb@imirage.com)
// Date: 08/21/03
//
// !!IMPORTANT -- READ DIRECTIONS CAREFULLY BEFORE UPDATING!!
//

// ------- add pant images and color label here --------
	//UPDATING
  //1. duplicate a var imgCOLORNAME line, but using new color
	//2. add the imgCOLORNAME to the list in the var imageAllArray line
	//3. add swatch to html page DUPLICATE EXACTLY HOW THE OTHERS ARE DONE except using new color name
	//4. add color to the drop down list on the html page
	//5. name the new image this way: type (i.e. pants) _ material(i.e. twill) _ color(i.e. navy) (i.e. pants_twill_navy.gif)
	//6. update the id and div content - div will look like this on html page: <div class="PRODUCT_TEXT" id="Cement" align="center">Cement</div>
	//IF MAKING A NEW PAGE
	//7. name the page the same way as #5., minus the color (i.e. pants_twill.html)

	var sPath = window.location.pathname;
	var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
	var sType = sPage.substring(0,sPage.indexOf('_'));
	var sMaterial = sPage.substring(sPage.indexOf('_') + 1);
	sMaterial = sMaterial.substring(0,sMaterial.indexOf('.'));
	var arraysDefined = false;

    // -- 1
	var imgKhaki = new Image(); 
  imgKhaki.src="../images/shop/" + sType + "_" + sMaterial + "_khaki.gif"; imgKhaki.name="Khaki";
	var imgBritish_Khaki = new Image(); 
  imgBritish_Khaki.src="../images/shop/" + sType + "_" + sMaterial + "_british_khaki.gif";imgBritish_Khaki.name="British_Khaki";
	var imgOlive_Drab = new Image(); 
  imgOlive_Drab.src="../images/shop/" + sType + "_" + sMaterial + "_olive_drab.gif";imgOlive_Drab.name="Olive_Drab";
	var imgStone = new Image(); 
  imgStone.src="../images/shop/" + sType + "_" + sMaterial + "_stone.gif";imgStone.name="Stone";
	var imgBlack = new Image(); 
  imgBlack.src="../images/shop/" + sType + "_" + sMaterial + "_black.gif";imgBlack.name="Black";
	var imgCoral = new Image(); 
  imgCoral.src="../images/shop/" + sType + "_" + sMaterial + "_coral.gif";imgCoral.name="Coral";
	var imgNavy = new Image(); 
  imgNavy.src="../images/shop/" + sType + "_" + sMaterial + "_navy.gif";imgNavy.name="Navy";
	var imgYellow = new Image(); 
  imgYellow.src="../images/shop/" + sType + "_" + sMaterial + "_yellow.gif";imgYellow.name="Yellow";
	var imgOlive = new Image(); 
  imgOlive.src="../images/shop/" + sType + "_" + sMaterial + "_olive.gif";imgOlive.name="Olive";
	var imgCharcoal = new Image(); 
  imgCharcoal.src="../images/shop/" + sType + "_" + sMaterial + "_charcoal.gif";imgCharcoal.name="Charcoal";
	var imgMushroom = new Image(); 
  imgMushroom.src="../images/shop/" + sType + "_" + sMaterial + "_mushroom.gif";imgMushroom.name="Mushroom";
	var imgCement = new Image(); 
  imgCement.src="../images/shop/" + sType + "_" + sMaterial + "_cement.gif";imgCement.name="Cement";
	var imgSand = new Image(); 
  imgSand.src="../images/shop/" + sType + "_" + sMaterial + "_sand.gif";imgSand.name="Sand";
	var imgWicker = new Image(); 
  imgWicker.src="../images/shop/" + sType + "_" + sMaterial + "_wicker.gif";imgWicker.name="Wicker";
	var imgWheat = new Image(); 
  imgWheat.src="../images/shop/" + sType + "_" + sMaterial + "_wheat.gif";imgWheat.name="Wheat";
	var imgNubuck = new Image(); 
  imgNubuck.src="../images/shop/" + sType + "_" + sMaterial + "_nubuck.gif";imgNubuck.name="Nubuck";
	var imgCamel = new Image(); 
  imgCamel.src="../images/shop/" + sType + "_" + sMaterial + "_camel.gif";imgCamel.name="Camel";	
  var imgTobacco = new Image(); 
  imgTobacco.src="../images/shop/" + sType + "_" + sMaterial + "_tobacco.gif";imgTobacco.name="Tobacco";
	var imgSage = new Image(); 
  imgSage.src="../images/shop/" + sType + "_" + sMaterial + "_sage.gif";imgSage.name="Sage";
  	var imgWeathered_Red = new Image(); 
  imgWeathered_Red.src="../images/shop/" + sType + "_" + sMaterial + "_weathred.gif";imgWeathered_Red.name="Weathered_Red";
  	var imgBark = new Image(); 
  imgBark.src="../images/shop/" + sType + "_" + sMaterial + "_bark.gif";imgBark.name="Bark";

  var imgSandstone = new Image(); 
  imgSandstone.src="../images/shop/" + sType + "_" + sMaterial + "_sandstone.gif";imgSandstone.name="Sandstone";
	var imgVintage = new Image(); 
  imgVintage.src="../images/shop/" + sType + "_" + sMaterial + "_vintage.gif";imgVintage.name="Vintage";
	var imgSand = new Image(); 
  imgSand.src="../images/shop/" + sType + "_" + sMaterial + "_sand.gif";imgSand.name="Sand";
	var imgCitrus = new Image(); 
  imgCitrus.src="../images/shop/" + sType + "_" + sMaterial + "_citrus.gif";imgCitrus.name="Citrus";
	var imgSkyBlue = new Image(); 
  imgSkyBlue.src="../images/shop/" + sType + "_" + sMaterial + "_skyblue.gif";imgSkyBlue.name="Sky_Blue";
	var imgLime = new Image(); 
  imgLime.src="../images/shop/" + sType + "_" + sMaterial + "_lime.gif";imgLime.name="Lime";
  //alert(imgSkyBlue.name);
  
	var colors = new Array();//"Khaki", "British Khaki", "Olive Drab", "Stone", "Black", "Wheat");
	// -- 2
  var imageAllArray = new Array(imgKhaki, imgBritish_Khaki, imgOlive_Drab, imgStone, imgBlack, imgCoral, imgNavy, imgYellow, imgOlive, imgCharcoal, imgMushroom, imgCement, imgSand, imgWicker, imgWheat, imgNubuck, imgCamel, imgTobacco, imgSandstone, imgVintage, imgSage, imgWeathered_Red, imgBark, imgSand, imgCitrus, imgSkyBlue, imgLime);
	var imageArray = new Array();
	
// -------------------------------------

function roll(linkNum)
// side nav rollover function occurs on mouseOver
{
  var sideSlot = document.getElementById("slotSide" + linkNum);
	sideSlot.innerHTML=">";
	sideSlot.style.color="#990000";
	document.getElementById("slot" + linkNum).style.color="#990000";
}

function rollout(linkNum)
// side nav rollover function occurs on mouseOut
{
	document.getElementById("slotSide" + linkNum).innerHTML="";
	document.getElementById("slot" + linkNum).style.color="#000000";
}

function onSwatchImageOver(swatchName)
{
  //highlight swatch name
	document.getElementById(swatchName).style.color="#000000";
}
function onSwatchImageOut(swatchName)
{
  //unhiglight swatch name
	document.getElementById(swatchName).style.color="";
}

function onSwatchImageClick(swatchName)
{
	if (!arraysDefined) defineArrays();
	
	swapProductImage(getColorIndexFromName(swatchName));
}
// determines the array index of the color selected from the colorName
function getColorIndexFromName(colorName)
{
	if (!arraysDefined) defineArrays();	
		var colorIndex = -1;
	for (var i=0; i<colors.length; i++)
	{
		if(colors[i] == colorName)
		{
			colorIndex = i;			
		}	
	}	
	return colorIndex;
}

function onColorSelectionChange(colorSelect)
{
  var selectedColorName = colorSelect.options[colorSelect.selectedIndex].value;
  swapProductImage(getColorIndexFromName(selectedColorName));
}
function onModelSelectionChange(modelSelect)
{
  //when M3(7) selected only certain colors are allowed
  //if other model selected, restore original colors
  //store original colors
    if (!arraysDefined) defineArrays();
    var modelText = modelSelect.options[modelSelect.selectedIndex].text;
	//get current color selection
	var colorSelect = document.getElementById('colorSelect');
	var selectedColorName = colorSelect.options[colorSelect.selectedIndex].value;
    var bSelectedColorIsValid = false;
	
	for(var i=0;i<colorSelect.options.length;i++)
	{
	    
	    //colorSelect.options[i] = null;
	    //colorSelect.options.remove(i);
	}
	colorSelect.options.length = 0;
	//var output = '<option value="" >Color:</option>';
	colorSelect.options.add(new Option("Color:",""));
	if (modelText == "M3")
	{
    for (var i=0; i<m3Colors.length; i++)
    {
        var tempColor = m3Colors[i];
        var opt = new Option(tempColor, tempColor);
  		if (tempColor  == selectedColorName)
  		{
            bSelectedColorIsValid = true;
            opt.selected = true;
            colorSelect.options.add(opt);
  	        swapProductImage(getColorIndexFromName(selectedColorName));
  		}
  		else
  		{
  			colorSelect.options.add(opt);
  		}
    }
    if (!bSelectedColorIsValid)
        swapProductImage(getColorIndexFromName(m3Colors[0]));
  }
  else
  {
    for (var i=0; i<colors.length; i++)
    {
    var opt = new Option(colors[i], colors[i]);
  		if(colors[i] == selectedColorName)
  		{
  			//output += "<option selected value=\"" + colors[i] + "\" >" + colors[i] + "</option>";
  			opt.selected = true;
  			colorSelect.options.add(opt);
  			swapProductImage(i);
  		}
  		else
  		{
  			//output += "<option value=\"" + colors[i] + "\" >" + colors[i] + "</option>";
  			colorSelect.options.add(opt);
  		}
    }
    }
    //alert(output);
	//colorSelect.innerHTML=output;
	//alert(colorSelect.innerHTML);
	
}
function onSizeSelectionChange(sizeSelect)
{
  /*var selectedSizeText = sizeSelect.options[sizeSelect.selectedIndex].text;
  if (selectedSizeText == '48' || selectedSizeText == '50' || selectedSizeText == '52')
  {
    //change model to m2p and color to khaki
    var modelSelect = document.getElementById('modelSelect');
    for (var i=0; i<modelSelect.options.length; i++)
    {
      if (modelSelect.options[i].text == 'M2P') modelSelect.selectedIndex = i;
    }
    var colorSelect = document.getElementById('colorSelect');
    for (var i=0; i<colorSelect.options.length; i++)
    {
      if (colorSelect.options[i].text == 'Khaki') colorSelect.selectedIndex = i;
    }
    swapProductImage(getColorIndexFromName('Khaki'));
  }*/
  
}
// swaps the product image based on the index number found in getArrayIndex
function swapProductImage(imageIndex)
{	
  if (imageIndex > -1)
  {
  	var thisImage = document.getElementById('prod_image');
  	thisImage.src=imageArray[imageIndex].src;	
	}
}

// defines the two main arrays of the script
// colors - derived from the drop down (id=colorSelect) on the html page
//			  - holds all the colors for current product
//
// imageArray - derived from the colors and imageAllArray
//			  - holds the image objects needed for current product
function defineArrays()
{
	var myFlag = 0;
	var temp;
	var colorSelect = document.getElementById('colorSelect');
	for (var i=0; i<colorSelect.options.length; i++)
	{
		if(colorSelect.options[i].value == '')
		{
			// first time through
			myFlag = 1;
		}
		else
		{
			if (myFlag == 1)
			{
				colors[i - 1] = colorSelect.options[i].value;
				//alert(colors[x-1] + ":1 " + x);
			} 
			else
			{
				colors[i] = colorSelect.options[i].value;
				//alert(colors[x] + ":2 " + x);
			}
		}
	}

	for (var j=0; j<colors.length; j++)
	{
		temp = colors[j].toLowerCase();
		temp = temp.replace(' ', '_');				
		for (var k=0; k<imageAllArray.length; k++)
		{		
			if(temp == imageAllArray[k].name.toLowerCase())
			{				
				imageArray[j] = imageAllArray[k];
			}
		}
	}
	arraysDefined = true;
}

function calcRedir()
// Function for retail calculator
{
	errOut = '';

	// get form values
	ddseason = document.getElementById("season").value;
	seasonIndex = document.getElementById("season").selectedIndex;
	ddseasonname = document.getElementById("season").options[seasonIndex].innerHTML;

	ddstate = document.getElementById("state").value;
	stateIndex = document.getElementById("state").selectedIndex;
	ddstatename = document.getElementById("state").options[stateIndex].innerHTML; 
	ddstatename = ddstatename.substring(3,ddstatename.length); 

	ddaabi = document.getElementById("aabi").value;
	aabiIndex = document.getElementById("aabi").selectedIndex;
	ddaabiname = document.getElementById("aabi").options[aabiIndex].innerHTML;

	if(ddseason == '' || ddseason == 'Select A Season')
	{
		errOut += 'Season\n';
	}
	if(ddstate == '' || ddstate == 'Select A State')
	{
		errOut += 'State\n'
	}
	if(ddaabi == '' || ddaabi == 'Select An Amount')
	{
		errOut += 'Anticipated Annual Bills In-Stock Purchases\n';
	}

	// Output errors or open pop-up
	if(errOut != '')
	{
		alert('Please select a value for the following:\n---------------\n' + errOut);
	}
	else
	{
		outValue = "R" + ddstate + ddseason + ddaabi;
		window.open('chart.aspx?chartid=' + outValue + '&season=' + ddseasonname + '&state=' + ddstatename + '&aabi=' + ddaabiname + '','Calculator','height=500,width=796,scrollbars=yes', false);
	}
}