//Checks for the browser type.  If its IE6 or 5.5, the javascript will execute different pieces of code
var arVersion = navigator.appVersion.split("MSIE");
var version = parseFloat(arVersion[1]);

//Manages all the functions that happen between step of the application
function nextStep(stepNum)
{
	switch(stepNum) 
	{
		case 1:
			if(currentTableTopStyle == "")
			{
				alert("You must select a style before continuing.");
			}
			else
			{
				if ((version >= 5.5) && (version < 7) && (document.body.filters))
					document.getElementById("printButton").style.display = "none";
				nextStepAction(stepNum);
			}
		break;
		case 2:
			if(currentTileColor == "")
			{
				alert("You must select a tile before continuing.");
			}
			else
			{
				if ((version >= 5.5) && (version < 7) && (document.body.filters))
				{
					document.getElementById("div_bgtile").innerHTML = '<img id="bgtile" src="images/burners/blank_burner.png" class="bgtile" />';
					document.getElementById("div_bgtile_final").innerHTML = '<img id="bgtile_final" src="images/burners/blank_burner.png" class="bgtile" />';
				}
				document.getElementById("bgtile").src = "images/tableTops/" + currentTileColor + "_" + currentTableTopStyle + ".png";
				document.getElementById("bgtile_final").src = "images/tableTops/" + currentTileColor + "_" + currentTableTopStyle + ".png";	
				if ((version >= 5.5) && (version < 7) && (document.body.filters))
					DXImageAlphaLoader("bgtile");
				nextStepAction(stepNum);	
			}
		break;
		case 3:
			if(currentDesign == "")
				alert("You must select a design before continuing.");
			else
				nextStepAction(stepNum);
		break;
		case 4:
			if(currentPattern == "")
			{
				alert("You must select a burner pattern before continuing.");
			}
			else
			{
				if ((version >= 5.5) && (version < 7) && (document.body.filters))
				{
					document.getElementById("div_frame").innerHTML = '<img id="frame" src="images/burners/blank_burner.png" class="frame" />';
					document.getElementById("div_frame_final").innerHTML = '<img id="frame_final" src="images/burners/blank_burner.png" class="frame" />';
				}
				document.getElementById("frame").src = "images/burners/" + currentPattern + "_burner.png";
				document.getElementById("frame_final").src = "images/burners/" + currentPattern + "_burner.png";	
				if ((version >= 5.5) && (version < 7) && (document.body.filters))
					DXImageAlphaLoader("frame");
				nextStepAction(stepNum);
			}
		break;
		case 5:
			if((currentColorA == "") || (currentColorB == "") || (currentColorC == ""))
				alert("You must select three burner glass colors before continuing.");
			else
			{
				generateReceipt();
				nextStepAction(stepNum);
			}
		break;
		default:
			nextStepAction(stepNum);
		break;
	}
}

function nextStepAction(stepNum)
{
	document.getElementById("step" + stepNum).style.display = "none";
	document.getElementById("step" + (stepNum + 1)).style.display = "block";
}

function prevStep(stepNum)
{
	if((stepNum == 3) && (version >= 5.5) && (version < 7) && (document.body.filters))
	{
		document.getElementById("div_bgtile").innerHTML = '<img id="bgtile" src="images/burners/blank_burner.png" class="bgtile" />';
		document.getElementById("div_bgtile_final").innerHTML = '<img id="bgtile_final" src="images/burners/blank_burner.png" class="bgtile" />';
	}	
	if((stepNum == 4) && (version >= 5.5) && (version < 7) && (document.body.filters))
	{
		document.getElementById("div_frame").innerHTML = '<img id="bgtile_final" src="images/burners/blank_burner.png" class="bgtile" />';
		document.getElementById("div_frame_final").innerHTML = '<img id="frame_final" src="images/burners/blank_burner.png" class="frame" />';
	}
	if(stepNum == 5)
	{
		if ((version >= 5.5) && (version < 7) && (document.body.filters))
		{
			document.getElementById('div_color_a').innerHTML = '<img id="color_a" src="images/small_blank.gif" class="a" />';
			document.getElementById('div_color_a_final').innerHTML = '<img id="color_a_final" src="images/small_blank.gif" class="a" />';
			document.getElementById('div_color_b').innerHTML = '<img id="color_b" src="images/small_blank.gif" class="b" />';
			document.getElementById('div_color_b_final').innerHTML = '<img id="color_b_final" src="images/small_blank.gif" class="b" />';
			document.getElementById('div_color_c').innerHTML = '<img id="color_c" src="images/small_blank.gif" class="c" />';
			document.getElementById('div_color_c_final').innerHTML = '<img id="color_c_final" src="images/small_blank.gif" class="c" />';
		}
		document.getElementById("color_a").src = "images/small_blank.png";
		document.getElementById("color_a_selected_stone").src = "images/small_blank.png";
		document.getElementById("color_a_final").src = "images/small_blank.png";
		document.getElementById("color_a_final_stone").src = "images/small_blank.png";
		currentColorA = "";
		document.getElementById("color_b").src = "images/small_blank.png";
		document.getElementById("color_b_selected_stone").src = "images/small_blank.png";
		document.getElementById("color_b_final").src = "images/small_blank.png";
		document.getElementById("color_b_final_stone").src = "images/small_blank.png";
		currentColorB = "";
		document.getElementById("color_c").src = "images/small_blank.png";
		document.getElementById("color_c_selected_stone").src = "images/small_blank.png";
		document.getElementById("color_c_final").src = "images/small_blank.png";
		document.getElementById("color_c_final_stone").src = "images/small_blank.png";
		currentColorC = "";
		document.getElementById("color_a_text").innerHTML = '';
		document.getElementById("color_b_text").innerHTML = '';
		document.getElementById("color_c_text").innerHTML = '';
		document.getElementById("color_a_text_fin").innerHTML = '';
		document.getElementById("color_b_text_fin").innerHTML = '';
		document.getElementById("color_c_text_fin").innerHTML = '';
	}
	document.getElementById("step" + stepNum).style.display = "none";
	document.getElementById("step" + (stepNum - 1)).style.display = "block";
}

function setImages(type,selected,stepcount)
{
	i = 5;
	while(i > stepcount)
	{
		document.getElementById("step" + i + "_" + type).src = "images/customize/" + type + "/" + selected + "_small.jpg";
		i = i - 1;
	}
	document.getElementById("final_" + type).src = "images/customize/" + type + "/" + selected + "_small.jpg";
}

//Manages selection of table top style
var currentTableTopStyle = "";
function tableTopSelect(style)
{
	if(currentTableTopStyle != "")
	{
		document.getElementById("table_top_" + currentTableTopStyle).className = "normalize";
	}
	document.getElementById("table_top_" + style).className = "style_select";
	currentTableTopStyle = style;
	setImages("tableTop",currentTableTopStyle,1);
}

//Manages selection of Tile Color
var currentTileColor = "";
function tileSelect(color)
{
	if(currentTileColor != "")
	{
		document.getElementById("tile_" + currentTileColor).className = "normalize";
	}
	document.getElementById("tile_" + color).className = "tile_select";
	currentTileColor = color;
	setImages("tiles",currentTileColor,2);
}

//Manages selection of the Design
var currentDesign = "";
function designSelect(design)
{
	if(currentDesign != "")
	{
		document.getElementById("design_" + currentDesign).className = "normalize";
	}
	document.getElementById("design_" + design).className = "design_select";
	currentDesign = design;
	setImages("base",currentDesign,3);
}

//Manages selection of the Table Pattern
var currentPattern = "";
function patternSelect(pattern)
{
	if(currentPattern != "")
	{
		document.getElementById("pattern_" + currentPattern).className = "normalize";
	}
	document.getElementById("pattern_" + pattern).className = "pattern_select";
	currentPattern = pattern;
	setImages("burner",currentPattern,4);
}

var currentColorA = "";
var colorASelect = '';
function colorAStart()
{
	createDocumentInputPopOver('popover', colorASelect, 842, 522,'','','','');
}

function selectColorA(color, nicename)
{
	document.getElementById('div_color_a').innerHTML = '<img id="color_a" src="images/small_blank.gif" class="a" />';
	document.getElementById('div_color_a_final').innerHTML = '<img id="color_a_final" src="images/small_blank.gif" class="a" />';
	document.getElementById("color_a").src = "images/" + currentPattern + "_a/" + currentPattern + "_a_" + color + ".png";
	document.getElementById("div_color_a").className = currentPattern + " ie6_color_a_" + currentPattern;
	document.getElementById("color_a_selected_stone").src = "images/stones/" + color + ".jpg";
	document.getElementById("color_a_final").src = "images/" + currentPattern + "_a/" + currentPattern + "_a_" + color + ".png";
	document.getElementById("div_color_a_final").className = currentPattern + " ie6_color_a_" + currentPattern;
	document.getElementById("color_a_final_stone").src = "images/stones/" + color + ".jpg";
	document.getElementById("color_a_text").innerHTML = nicename;
	document.getElementById("color_a_text_fin").innerHTML = nicename;
	if ((version >= 5.5) && (version < 7) && (document.body.filters))
	{
		DXImageAlphaLoader("color_a");
	}
	currentColorA = color;
	removeDocumentInputPopOver()
}

var currentColorB = "";
var colorBSelect = '';
function colorBStart()
{
	createDocumentInputPopOver('popover', colorBSelect, 842, 522,'','','','');
}

function selectColorB(color, nicename)
{
	document.getElementById('div_color_b').innerHTML = '<img id="color_b" src="images/small_blank.gif" class="b" />';
	document.getElementById('div_color_b_final').innerHTML = '<img id="color_b_final" src="images/small_blank.gif" class="b" />';
	document.getElementById("color_b").src = "images/" + currentPattern + "_b/" + currentPattern + "_b_" + color + ".png";
	document.getElementById("div_color_b").className = currentPattern + " ie6_color_b_" + currentPattern;
	document.getElementById("color_b_selected_stone").src = "images/stones/" + color + ".jpg";
	document.getElementById("color_b_final").src = "images/" + currentPattern + "_b/" + currentPattern + "_b_" + color + ".png";
	document.getElementById("div_color_b_final").className = currentPattern + " ie6_color_b_" + currentPattern;
	document.getElementById("color_b_final_stone").src = "images/stones/" + color + ".jpg";
	document.getElementById("color_b_text").innerHTML = nicename;
	document.getElementById("color_b_text_fin").innerHTML = nicename;
	if ((version >= 5.5) && (version < 7) && (document.body.filters))
	{
		DXImageAlphaLoader("color_b");
	}
	currentColorB = color;
	removeDocumentInputPopOver()
}

var currentColorC = "";
var colorCSelect = '';
function colorCStart()
{
	createDocumentInputPopOver('popover', colorCSelect, 842, 522,'','','','');
}

function selectColorC(color, nicename)
{
	document.getElementById('div_color_c').innerHTML = '<img id="color_c" src="images/small_blank.gif" class="c" />';
	document.getElementById('div_color_c_final').innerHTML = '<img id="color_c_final" src="images/small_blank.gif" class="c" />';
	document.getElementById("color_c_final").src = "images/" + currentPattern + "_c/" + currentPattern + "_c_" + color + ".png";
	document.getElementById("div_color_c_final").className = currentPattern + " ie6_color_c_" + currentPattern;
	document.getElementById("color_c_final_stone").src = "images/stones/" + color + ".jpg";
	
	document.getElementById("color_c").src = "images/" + currentPattern + "_c/" + currentPattern + "_c_" + color + ".png";
	document.getElementById("div_color_c").className = currentPattern + " ie6_color_c_" + currentPattern;
	document.getElementById("color_c_selected_stone").src = "images/stones/" + color + ".jpg";
	
	document.getElementById("color_c_text").innerHTML = nicename;
	document.getElementById("color_c_text_fin").innerHTML = nicename;
	
	if ((version >= 5.5) && (version < 7) && (document.body.filters))
	{
		DXImageAlphaLoader("color_c");
	}
	currentColorC = color;
	removeDocumentInputPopOver()
}

function setDBStore()
{
	document.getElementById("dbStore_tableTop").value = currentTableTopStyle;
	document.getElementById("dbStore_tile").value = currentTileColor;
	document.getElementById("dbStore_design").value = currentDesign;
	document.getElementById("dbStore_pattern").value = currentPattern;
	document.getElementById("dbStore_colorA").value = currentColorA;
	document.getElementById("dbStore_colorB").value = currentColorB;
	document.getElementById("dbStore_colorC").value = currentColorC;
}

//pass it the ID of the item you want to calculator the width and height for
var ie6FixWidth = 0;
var ie6FixHeight = 0;
var ie6TemporaryID = "";
function DXImageAlphaLoader(id)
{
	document.getElementById('ie6fix').src = document.getElementById(id).src;
	ie6TemporaryID = id;
	var t = setTimeout('DXImageAlphaLoaderProcess()',800);
}

function DXImageAlphaLoaderProcess()
{
	DXImageAlphaLoaderGetWidthHeight();
	DXImageAlphaLoaderCreator()
}

function DXImageAlphaLoaderGetWidthHeight()
{
	ie6FixWidth = document.getElementById('ie6fix').width;
	ie6FixHeight = document.getElementById('ie6fix').height;
}

function DXImageAlphaLoaderCreator()
{
	var newImg = document.getElementById(ie6TemporaryID);
	var newImgID = (newImg.id) ? "id='" + newImg.id + "' " : "";
	var newImgClass = (newImg.className) ? "class='" + newImg.className + "' " : "";
	var newImgStyle = "display:inline-block";
	var newImgWidth = ie6FixWidth;
	var newImgHeight = ie6FixHeight;
	var newImgHTML = "<span " + newImgID + newImgClass
					  + " style=\"" + "width:" + newImgWidth
					  + "px; height:" +  newImgHeight
					  + "px;" + newImgStyle + ";"
					  + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
					  + "(src=\'" + newImg.src + "\', sizingMethod='scale');\"></span>";
	document.getElementById("div_" + ie6TemporaryID).innerHTML = newImgHTML;
	document.getElementById("div_" + ie6TemporaryID + "_final").innerHTML = newImgHTML;
}

function printMe()
{
	document.getElementById("step6").style.display = "block";
	window.print();
}

function finalizeOrder(num)
{
	var submitBool = false;
	if(num == 1)
	{
		if(emptyvalidation(document.getElementById("name1"),"Please enter in a name into the appropriate name field.") != false)
		{
			//if we have a name, then check to see for valid email
			if(emailnemptyvalidation(document.getElementById("email1"),"Please enter in a valid email into the appropraite email field.") != false)
			{
				submitBool = true;
			}
			else
			{
				document.getElementById("email1").focus(); 
				return false;
			}
		}
		else
		{
			document.getElementById("name1").focus(); 
			return false;
		}
	}
	if(num == 2)
	{
		if(emptyvalidation(document.getElementById("name2"),"Please enter in a name into the appropriate name field.") != false)
		{
			if(emailnemptyvalidation(document.getElementById("email2"),"Please enter in a valid email into the appropriate email field.") !=  false)
			{
				if(phonevalidation(document.getElementById("phone2"),"Please enter 10 digits only for the phone number.") !=  false)
				{
					submitBool = true;
				}
				else
				{
					document.getElementById("phone2").focus(); 
					return false;
				}
			}
			else
			{
				document.getElementById("email2").focus(); 
				return false;
			}
		}
		else
		{
			document.getElementById("name2").focus(); 
				return false;	
		}
	}
	if (submitBool == true)
	{
		setDBStore();
		document.getElementById("dbStore_name").value = document.getElementById("name" + num).value;
		document.getElementById("dbStore_email").value = document.getElementById("email" + num).value;
		if(num == 2)
		{
			document.getElementById("dbStore_phone").value = document.getElementById("phone" + num).value;
			if (document.getElementById("callbacktime2") != "")
			{
				document.getElementById("dbStore_callbacktime").value = document.getElementById("callbacktime" + num).value;
				document.getElementById("dbStore_type").value = "callback";
			}
		}
		else
		{
			document.getElementById("dbStore_type").value = "willcall";
		}
		document.getElementById("confirm").click();
	}
}

//Validation Functions
function emailnemptyvalidation(entered, alertbox)
{
	if(entered == null)	//if object doesnt exist 
		return false;	
	// E-mail Validation by Henrik Petersen / NetKontoret
	// Explained at www.echoecho.com/jsforms.htm
	// Please do not remove this line and the two lines above.
	with (entered)
	{
		apos=value.indexOf("@"); 
		dotpos=value.lastIndexOf(".");
		lastpos=value.length-1;
		if (apos<1 || dotpos-apos<2 || lastpos-dotpos>3 || lastpos-dotpos<2) 
		{
			if (alertbox) {alert(alertbox);} 
			return false;
		}
		else 
		{
			return true;
		}
	}
}

function phonevalidation(entered, alertbox)
{
	if(entered == null)	//if object doesnt exist 
		return false;	
	// place any other field validations that you require here
	// validate myradiobuttons
	with (entered)
	{
		//alert(entered.value.length);
		if (entered.value.length == 10) {
			return true;
		}
		else
		{
			alert(alertbox);
			return false;
		}
	}
}

function emptyvalidation(entered, alertbox)
{
	if(entered == null)	//if object doesnt exist 
		return false;	
// Emptyfield Validation by Henrik Petersen / NetKontoret
// Explained at www.echoecho.com/jsforms.htm
// Please do not remove this line and the two lines above.
//with (entered)
//{
//if (value==null || value=="")
//{if (alertbox!="") {alert(alertbox+'Error: value='+value);} return false;}
//else {return true;}
//}
	with (entered)
	{
		if (value==null || value=="")
		{
			if (alertbox!="") {alert(alertbox);} return false;}
		else {
			return true;
		}
	}
}

function generateReceipt()
{
	document.getElementById("receipt_tableTop").innerHTML = currentTableTopStyle;
	document.getElementById("receipt_burner").innerHTML = currentPattern;
	document.getElementById("receipt_base").innerHTML = currentDesign;
	document.getElementById("receipt_tiles").innerHTML = currentTileColor;
	document.getElementById("receipt_color_a").innerHTML = currentColorA;
	document.getElementById("receipt_color_b").innerHTML = currentColorB;
	document.getElementById("receipt_color_c").innerHTML = currentColorC;
}