
// JavaScript Document
//global vars

var model = "stringo";

//logo and graphic placement holders top & left
var logoTop = 0;
var logoLeft = 0;
var logoTop1 = 0;
var logoLeft1 = 0;

var graphicTop = 0;
var graphicLeft = 0;
var graphicTop1 = 0;
var graphicLeft1 = 0;
var graphicTop2 = 0;
var graphicLeft2 = 0;
var graphicTop3 = 0;
var graphicLeft3 = 0;
var graphicTop4 = 0;
var graphicLeft4 = 0;
var graphicTop5 = 0;
var graphicLeft5 = 0;
var graphicTop6 = 0;
var graphicLeft6 = 0;
var graphicTop7 = 0;
var graphicLeft7 = 0;

var archTop = 0;
var archLeft = 0;
var archTop1 = 0;
var archLeft1 = 0;
var archTop2 = 0;
var archLeft2 = 0;



// Pulls in the URL and extracts the querystring isInt=
var fullURL = parent.document.URL;
var isInt = fullURL.substring(fullURL.indexOf('?')+7,fullURL.indexOf('?')+8);

//alert(isInt);
	
/*================================================
==================================================
============ Handles Boat Model Change=============
==================================================
================================================*/	


	
//  Takes input from Menu click and populates individual boat info from XML docs
	function newBoat(modelo)
	{ 
		model = modelo;
		
		var req = null; 

		//document.getElementById("comments2").innerHTML = "Started...";
 
		if (window.XMLHttpRequest)
		{
 			req = new XMLHttpRequest();
			if (req.overrideMimeType) 
			{
				req.overrideMimeType('text/xml');
			}
		} 
		else if (window.ActiveXObject) 
		{
			try {
				req = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e)
			{
				try {
					req = new ActiveXObject("Microsoft.XMLHTTP");
				} catch (e) {}
			}
	        	}



		req.onreadystatechange = function()
		{ 
		//alert("req.onreadystatechange  function kicked off");
			//document.getElementById("comments2").innerHTML = "Loading...";
			if(req.readyState == 4)
			{
				if(req.status == 200)
				{
					
					document.getElementById('boats123').innerHTML = "";
					document.getElementById('hullSelection').innerHTML = "";
					document.getElementById('hullSelection').style.visibility='visible';
					var doc = req.responseXML;
					
					
					
					var boatArray = doc.getElementsByTagName('boat');
					var allOptions = boatArray[0].getElementsByTagName('options');
					var hullOptions = boatArray[0].getElementsByTagName('hullOptions');
					
					// Calls a fucntion to populate image div.  Sends the hullOptions nodes as well
					populateBoatImages(model, hullOptions);
					
					// Scrolling div container
					var ni = document.getElementById('boats123');
					var ne = document.getElementById('hullSelection');
					var cs = document.getElementById('colorSwatches');
					
					
					
					// Get the hull xml into an array for iteration
					// This will need to be interated for Chaparral
					var hull = hullOptions[0].getElementsByTagName('hull');
					var hColor = hullOptions[0].getElementsByTagName('color');
							
							
							
				
							
							var mT = document.createTextNode("$");
							
							var checkboxH = document.createElement('INPUT');
								checkboxH.setAttribute ('type','checkbox');
								checkboxH.setAttribute ('name','optionCheck');
								checkboxH.setAttribute ('onClick','addOptions()');
								
														
								
								
								
						// Populates Color Swatches
							cs.innerHTML = "";	

							for(j = 0; j<hColor.length; j++)
									{
										
									var title = hColor[j].getAttribute('desc');
									var hex = hColor[j].getAttribute('hex');
									var colorId = hColor[j].getAttribute('id');		
											
									
									try{
										if(colorId == 'black')
										{
										radioGroupColor = document.createElement('<input type="radio" name="hullColor" id="black" onClick="changeColor(\'' + hex + '\');" value="' + hex + '" checked/>');
										}
										else{
										radioGroupColor = document.createElement('<input type="radio" id="'+ colorId +'" name="hullColor" onClick="changeColor(\'' + hex + '\');" value="' + hex + '" />');
										}
										}// onClick="changeColor(' + hex + ');
										catch(err)
										{
										var radioGroupColor = document.createElement('INPUT');
										radioGroupColor.setAttribute ('type','radio');
										radioGroupColor.setAttribute ('name','hullColor');
										radioGroupColor.setAttribute ('onClick','changeColor(\'' + hex + '\')');
										radioGroupColor.setAttribute ('value', hex);
										//radioGroupColor.id = "group" + colorId;
										if(colorId == 'black'){radioGroupColor.setAttribute ('checked','true');}
										}
						
									var hullHolder = document.createElement('div');
									hullHolder.className='swatchHolder';
									hullHolder.id=colorId;
									
									if(colorId =='white'){hullHolder.style.visibility="hidden";}
									else if(colorId =='iceBlue'){hullHolder.style.display="none";}
						
									var hullSelect = document.createElement('div');
									hullSelect.className='swatchSelect';
							
									var hullColor = document.createElement('div');
									hullColor.className='colorBox';
									
									var hullTitle = document.createElement('div');
									hullTitle.className='colorTitle';
									
									cs.appendChild(hullHolder);
						
									hullHolder.appendChild(hullSelect);
									hullHolder.appendChild(hullColor);
									hullHolder.appendChild(hullTitle);
						
									hullSelect.appendChild(radioGroupColor);
									hullTitle.appendChild(document.createTextNode(title));
									hullColor.style.background = "#" + hex;
									
									
									}
								
								// some div id's above need to be changed to #colorSwatches
								
								
								
								
								
/*================================================
==================================================
======= Hull Selection and XML iteration =========
==================================================
================================================*/
								
								
					//Cycles through HullOptions/hull in xml file and lists all hull combos
							for (var i = 0; i<hull.length; i++)
								{
									var id = hull[i].getAttribute('id');
									var price = hull[i].getAttribute('price');	
									var desc = hull[i].getAttribute('desc');	
									
									price = parseInt(price);
								
								
								
								try{
									if(id == 'standard' || id == 'xtremeTB')
									{radioGroupHull = document.createElement('<input type="radio" name="hullGraphics" onClick="hullChange(\'' + id + '\',\'' + model +  '\')" value="' + price + '" checked />');}
									else{radioGroupHull = document.createElement('<input type="radio" name="hullGraphics" onClick="hullChange(\'' + id + '\',\'' + model +  '\')" value="' + price + '" />');}
									}
									catch(err)
									{
										var radioGroupHull = document.createElement('INPUT');
										radioGroupHull.setAttribute ('type','radio');
										radioGroupHull.setAttribute ('name','hullGraphics');
										radioGroupHull.setAttribute ('onClick','hullChange(\"' + id + '\",\"' + model +  '\")');
										radioGroupHull.setAttribute ('value', price);
										if(id == 'standard' || id== 'xtremeTB'){radioGroupHull.setAttribute ('checked','true');}
									}
								
								
								
								
							// here is where the 
									
								var hullHolder = document.createElement('div');
								hullHolder.className='hullHolder';
								
								var hullSelect = document.createElement('div');
								hullSelect.className='hullSelect';
								
								var hullTitle = document.createElement('div');
								hullTitle.className='hullTitle';
								
								var hullPrice = document.createElement('div');
								hullPrice.className='hullPrice';
								if(isInt == "1"){hullPrice.style.visibility="hidden";}
								
								ne.appendChild(hullHolder);
								
								hullHolder.appendChild(hullSelect);
								hullHolder.appendChild(hullTitle);
								hullHolder.appendChild(hullPrice);
								
								hullSelect.appendChild(radioGroupHull);
								hullTitle.appendChild(document.createTextNode(desc));
								hullPrice.appendChild(document.createTextNode('$' + price));
								
								
								
								//Populates indented secondary menu color selection...  Could be used for graphics as well.
								if(id == "wideband")
									{
										
									
										
										var logos = hullOptions[0].getElementsByTagName('graphic');
										for (var j = 0; j<logos.length; j++)
										{
											var list = logos[j].getAttribute('list');
											
											if(list == "y")
											{	
											var id = logos[j].getAttribute('id');
											var top = logos[j].getAttribute('top');
											var left = logos[j].getAttribute('left');
											var priceL = logos[j].getAttribute('price');
											var desc = logos[j].getAttribute('desc');
											
											priceL = parseInt(priceL);
											
											
											try{
												checkboxLogo = document.createElement('<input type="checkbox" name="checkboxLogo" onClick="hullChange(\'' + id + '\',\'' + model +  '\');" value=\"'+ priceL + '\" disabled />');
												}// onClick="changeColor(' + hex + ');
												catch(err)
												{
												var checkboxLogo = document.createElement('INPUT');
												checkboxLogo.setAttribute ('type','checkbox');
												checkboxLogo.setAttribute ('name','checkboxLogo');
												checkboxLogo.setAttribute ('onClick','hullChange(\"' + id + '\",\"' + model +  '\")');
												checkboxLogo.setAttribute ('value', priceL);
												checkboxLogo.disabled = true;
												}
								
											var hullHolder = document.createElement('div');
											hullHolder.className='hullHolderThin';
								
											var hullSelect = document.createElement('div');
											hullSelect.className='colorSelect';
									
											//var hullColor = document.createElement('div');
											//hullColor.className='colorBox';
											
											var hullTitle = document.createElement('div');
											hullTitle.className='colorTitleThin';
											
											var hullPrice = document.createElement('div');
											hullPrice.className='hullPrice';
											if(isInt == "1"){hullPrice.style.visibility="hidden";}
											
											ne.appendChild(hullHolder);
								
											hullHolder.appendChild(hullSelect);
											//hullHolder.appendChild(hullColor);
											hullHolder.appendChild(hullTitle);
											hullHolder.appendChild(hullPrice);
								
											hullSelect.appendChild(checkboxLogo);
											hullTitle.appendChild(document.createTextNode(desc));
											//hullColor.style.background = "#" + hex;
											hullPrice.appendChild(document.createTextNode('$' + priceL));
											
											
											}
									}
									}
								
								
								
								}
					
					
			// this for statement populates the options from xml doc also handles events such as clicks..etc
					for (var i = 0; i<allOptions.length; i++)
						{
							var titleId=allOptions[i].getAttribute('title');
							var titleLrg = document.createTextNode(titleId);
							//alert(titleLrg);
							
							//Creates Option Container
							var optionContainer = document.createElement('div');
							optionContainer.className='optionContainer';
							optionContainer.id=titleId;
					
							//Appends boats123 = ni with a new option container
							ni.appendChild(optionContainer);
							
							
							
							
							var optionTitleLrg = document.createElement('div');
								optionTitleLrg.className='optionTitleLrg';
							
							//appends the Large title div to the option Container
							optionContainer.appendChild(optionTitleLrg);
							optionTitleLrg.appendChild(titleLrg);


							var specificOptions = allOptions[i].getElementsByTagName('boat');



	// need to create the table up here 
	// and append <tr>'s to it below
								var optionTable = document.createElement('table');
								optionTable.className='optionTable';
								var optionTbody = document.createElement('tbody');

								
								optionContainer.appendChild(optionTable);
								optionTable.appendChild(optionTbody);


							//second level for statement.  Cycles through individual option selections and populates the builder 
						for (var j = 0; j<specificOptions.length; j++)
							{
								
								var priceNum = specificOptions[j].getAttribute('price');
								var selectID = specificOptions[j].getAttribute('id');
								var optionID = document.createTextNode(selectID);
								var title = document.createTextNode(specificOptions[j].getAttribute('title'));
								var desc = specificOptions[j].getAttribute('desc');
								var price = document.createTextNode(commaInsert(priceNum));
								var selText = "selected";
								var selected = document.createTextNode(selText);
								//var price = document.createTextNode("$" + priceNum);
								var picture = specificOptions[j].getAttribute('big_preview');
								var overwrite = specificOptions[j].getAttribute('individualOverwrite');
								var showDefault = specificOptions[j].getAttribute('showDefault');
								//alert(typeof(overwrite));
								
								//alert(optionID);
								
	
	
	// this is where the option HOlder is consructed
								
								
								var optionHolder = document.createElement('tr');
								optionHolder.className='optionHolder';
								
									var optionSelect = document.createElement('td');
									optionSelect.className='optionSelect';
								
									var optionSelNo = document.createElement('td');
									optionSelNo.className='optionID';
									
									var optionTitle = document.createElement('td');
									optionTitle.className='optionTitle';
								
									var optionPrice = document.createElement('td');
									optionPrice.className='optionPrice';
									if(isInt == "1"){optionPrice.style.visibility="hidden";}
								
									var selectedDesig = document.createElement('td');
									selectedDesig.className='selectedDesig';
									selectedDesig.id= 'sel' + selectID;
								
								optionTbody.appendChild(optionHolder);
								optionHolder.appendChild(optionSelect);
								optionHolder.appendChild(optionSelNo);
								optionHolder.appendChild(optionTitle);
								optionHolder.appendChild(optionPrice);
								optionHolder.appendChild(selectedDesig);
								optionTitle.appendChild(title);
								selectedDesig.appendChild(selected);
								optionSelNo.appendChild(optionID);
								
								//populates engine options with radio buttons
								if (allOptions[i].getAttribute('title') == 'Engines')
									{
										
									try{
										if(showDefault == 'true'){radioGroup = document.createElement('<input type="radio" name="engineCheck" onClick="addOptions()" title="' + selectID +'"value="' + priceNum + '" checked/>');}
										else{radioGroup = document.createElement('<input type="radio" name="engineCheck" onClick="addOptions()" title="' + selectID +'" value="' + priceNum + '" />');}
										}
										catch(err)
										{				
										var radioGroup = document.createElement('INPUT');
										radioGroup.setAttribute ('type','radio');
										radioGroup.setAttribute ('name','engineCheck');
										radioGroup.setAttribute ('onClick','addOptions()');
										radioGroup.setAttribute ('value', priceNum);
										radioGroup.setAttribute ('title', selectID);
										radioGroup.setAttribute ('id', selectID);
										if(showDefault == 'true'){radioGroup.setAttribute ('checked','true');}
											
										}
									optionSelect.appendChild(radioGroup);
									}
								//populates individual overwrite items with radio group buttons	
								else if (typeof(overwrite) == 'string')
									{
									try{
										radioOverwriteGroup = document.createElement('<input type="radio" id="'+ selectID +'" name="' + overwrite + '" onClick="addOptions()" title="' + selectID +'" value="' + priceNum + '" />');
										}
										catch(err)
										{
										var radioOverwriteGroup = document.createElement('INPUT');
										radioOverwriteGroup.setAttribute ('type','radio');
										radioOverwriteGroup.setAttribute ('name',overwrite);
										radioOverwriteGroup.setAttribute ('onClick','addOptions()');
										radioOverwriteGroup.setAttribute ('value', priceNum);
										radioOverwriteGroup.setAttribute ('title', selectID);
										radioOverwriteGroup.setAttribute ('id', selectID);
										}
									optionSelect.appendChild(radioOverwriteGroup);	
									}
									
								else
									{
									try{
										checkbox = document.createElement('<input type="checkbox" id="'+ selectID +'" name="optionCheck" onClick="addOptions()" title="' + selectID +'" value="' + priceNum + '" />');
										}
										catch(err)
										{
										var checkbox = document.createElement('INPUT');
										checkbox.setAttribute ('type','checkbox');
										checkbox.setAttribute ('name','optionCheck');
										checkbox.setAttribute ('onClick','addOptions()');
										checkbox.setAttribute ('value', priceNum);
										checkbox.setAttribute ('title', selectID);
										checkbox.setAttribute ('id', selectID);
										}
									optionSelect.appendChild(checkbox);
									}
									
								
								
								// If the picture url is not empty the camera icon element is created and inserted after title.
								
								if (picture != "")
									{
									var optionImage = document.createElement('img');
									optionImage.setAttribute ('src','images/camIcon.jpg');
									optionImage.setAttribute ('alt', 'View Image of this option');
									optionImage.setAttribute ('border', '0');
									
									var imageLink = document.createElement('a');
									imageLink.href = picture;
									imageLink.className='camIcon';
									imageLink.rel='lightbox';
									imageLink.title=desc;

									imageLink.border='0';
									
									imageLink.appendChild(optionImage);
									optionTitle.appendChild(imageLink);
									
									}
									else
									{
									var spacerImage = document.createElement('img');
									spacerImage.setAttribute ('src','images/spacerIcon.jpg');
									spacerImage.setAttribute ('border', '0');
									optionTitle.appendChild(spacerImage);
									}
									
										
										
								optionPrice.appendChild(price);
								
							}
						
					

						
						}
					
					addOptions();
					
					
					if(model == "sux204" || model == "sux224" || model == "sux244" || model == "sux264")
					{
						hullChange("xtremeTB", model);
					}
					
					if(model == "ssw186" || model == "ssw196" || model == "ssw206" || model == "ssw216" || model == "ssw226" || model == "sun284" || model == "sun264" || model == "sun244" || model == "sun224")
					{
						hullChange("standard", model);
					}
					
					
				}	
				
				else	
				{
					//document.getElementById("comments2").innerHTML="Error: returned status code " + req.status + " " + req.statusText;
				}	
			} 
		};
		//var queryString = model;
		req.open("GET", "xml/" + model + ".xml" ,true);
		//req.open("GET", "http://www.robalo.com/AJAX/RedOak.xml", true); 
		req.send(null); 
	} 
	
	


/*================================================
==================================================
============ Tally's price ========= =============
==================================================
================================================*/

	
	function addOptions()
	{
		
		//this function will determine model and determine if any boxes just checked require other's to be checked
		itemCheck();
		
		var o_value = 0;
		var r_value = 0;
		var c_value = 0;
		var h_value = 0;
		// optional graphic price
		var i_value = 0;
		//overwrite prices
		var aaa_value = 0;
		var bbb_value = 0;
		var ccc_value = 0;
		var ddd_value = 0;
		var eee_value = 0;
		var fff_value = 0;
		var fabric_value = 0;

//alert(document.boatOptions.engineCheck.length);

		//Interates through Engine Radio Group
		for (var j=0; j< document.boatOptions.engineCheck.length; j++)
			{
			if (document.boatOptions.engineCheck[j].checked)
				{
				var r_value = Number(document.boatOptions.engineCheck[j].value);
				var radioItem = document.boatOptions.engineCheck[j].title;
				document.getElementById('sel'+radioItem).style.visibility="visible";
				}
			else{
				var radioItem = document.boatOptions.engineCheck[j].title;
				document.getElementById('sel'+radioItem).style.visibility="hidden";
				}
			}
		
		
		//Interates through Option Checkboxes
		//alert(document.boatOptions.optionCheck.length);
		for (var i=0; i< document.boatOptions.optionCheck.length; i++)
			{
			if (document.boatOptions.optionCheck[i].checked)
				{
				c_value = c_value + Number(document.boatOptions.optionCheck[i].value);
				var checkedItem = document.boatOptions.optionCheck[i].title;
				document.getElementById('sel'+checkedItem).style.visibility="visible";
				}
			else{
				var checkedItem = document.boatOptions.optionCheck[i].title;
				document.getElementById('sel'+checkedItem).style.visibility="hidden";
				}
			}	
			
		// adds  value of optional graphics checkbox
		if(document.hullOptions.checkboxLogo)
		{
 		if(document.hullOptions.checkboxLogo.checked == true && document.hullOptions.checkboxLogo.disabled == false)
			{
				i_value = Number(document.hullOptions.checkboxLogo.value);
			}
		else{i_value = 0;
		}
		}
			
			
		//Interates through Hull Option Radio Group
		for (var i=0; i< document.hullOptions.hullGraphics.length; i++)
			{
			if (document.hullOptions.hullGraphics[i].checked)
				{
				h_value = Number(document.hullOptions.hullGraphics[i].value);
				}
			}
			
		//Interates through AAA Radio Group
		if(typeof(document.boatOptions.AAA) != 'undefined')
		{
		for (var i=0; i< document.boatOptions.AAA.length; i++)
			{
			if (document.boatOptions.AAA[i].checked)
				{
				aaa_value = Number(document.boatOptions.AAA[i].value);
				var AAAItem = document.boatOptions.AAA[i].title;
				document.getElementById('sel'+AAAItem).style.visibility="visible";
				}
			else{
				try
				{
				var AAAItem = document.boatOptions.AAA[i].title;
				document.getElementById('sel'+AAAItem).style.visibility="hidden";
				}
				catch(err){}
				}
			}
		}
			
		//Interates through BBB Radio Group
		if(typeof(document.boatOptions.BBB) != 'undefined')
		{
		for (var i=0; i< document.boatOptions.BBB.length; i++)
			{
			if (document.boatOptions.BBB[i].checked)
				{
				bbb_value = Number(document.boatOptions.BBB[i].value);
				var BBBItem = document.boatOptions.BBB[i].title;
				document.getElementById('sel'+BBBItem).style.visibility="visible";
				}
			else{
				try
				{
				var BBBItem = document.boatOptions.BBB[i].title;
				document.getElementById('sel'+BBBItem).style.visibility="hidden";
				}
				catch(err){}
				}
			}
		}
		
		//Interates through CCC Radio Group
		if(typeof(document.boatOptions.CCC) != 'undefined')
		{
		for (var i=0; i< document.boatOptions.CCC.length; i++)
			{
			if (document.boatOptions.CCC[i].checked)
				{
				ccc_value = Number(document.boatOptions.CCC[i].value);
				var CCCItem = document.boatOptions.CCC[i].title;
				document.getElementById('sel'+CCCItem).style.visibility="visible";
				}
			else{
				try
				{
				var CCCItem = document.boatOptions.CCC[i].title;
				document.getElementById('sel'+CCCItem).style.visibility="hidden";
				}
				catch(err){}
				}
			}
		}
		//NEW ONES
		//Interates through DDD Radio Group
		if(typeof(document.boatOptions.DDD) != 'undefined')
		{
		for (var i=0; i< document.boatOptions.DDD.length; i++)
			{
			if (document.boatOptions.DDD[i].checked)
				{
				ddd_value = Number(document.boatOptions.DDD[i].value);
				var DDDItem = document.boatOptions.DDD[i].title;
				document.getElementById('sel'+DDDItem).style.visibility="visible";
				}
			else{
				try
				{
				var DDDItem = document.boatOptions.DDD[i].title;
				document.getElementById('sel'+DDDItem).style.visibility="hidden";
				}
				catch(err){}
				}
			}
		}
		
		//Interates through EEE Radio Group
		if(typeof(document.boatOptions.EEE) != 'undefined')
		{
		for (var i=0; i< document.boatOptions.EEE.length; i++)
			{
			if (document.boatOptions.EEE[i].checked)
				{
				eee_value = Number(document.boatOptions.EEE[i].value);
				var EEEItem = document.boatOptions.EEE[i].title;
				document.getElementById('sel'+EEEItem).style.visibility="visible";
				}
			else{
				try
				{
				var EEEItem = document.boatOptions.EEE[i].title;
				document.getElementById('sel'+EEEItem).style.visibility="hidden";
				}
				catch(err){}
				}
			}
		}
		
		//Interates through FFF Radio Group
		if(typeof(document.boatOptions.FFF) != 'undefined')
		{
		for (var i=0; i< document.boatOptions.FFF.length; i++)
			{
			if (document.boatOptions.FFF[i].checked)
				{
				fff_value = Number(document.boatOptions.FFF[i].value);
				var FFFItem = document.boatOptions.FFF[i].title;
				document.getElementById('sel'+FFFItem).style.visibility="visible";
				}
			else{
				try
				{
				var FFFItem = document.boatOptions.FFF[i].title;
				document.getElementById('sel'+FFFItem).style.visibility="hidden";
				}
				catch(err){}
				}
			}
		}
		
		//Interates through FABRIC Radio Group
		if(document.boatOptions.FABRIC)
		{//alert(document.getElementsByName('FABRIC') );
		for (var i=0; i< document.boatOptions.FABRIC.length; i++)
			{
			if (document.boatOptions.FABRIC[i].checked)
				{
				fabric_value = Number(document.boatOptions.FABRIC[i].value);
				var FABRICItem = document.boatOptions.FABRIC[i].title;
				try{document.getElementById('sel'+FABRICItem).style.visibility="visible";}catch(err){}
				}
			else{
				try
				{
				var FABRICItem = document.boatOptions.FABRIC[i].title;
				document.getElementById('sel'+FABRICItem).style.visibility="hidden";
				}
				catch(err){}
				}
			}
		}
		
		//alert(fabric_value);
				o_value = Number(r_value) + Number(c_value) + Number(h_value) + Number(i_value) + Number(aaa_value) + Number(bbb_value) + Number(ccc_value) + Number(ddd_value) + Number(eee_value) + Number(fff_value) + Number(fabric_value);
			
				//alert(o_value);
				
				//adds commas to toal
				var m =o_value.toString();
				//alert(m.length);
				
				
				
			
				
				if (m.length > 3)
					{
						var q = m.length - 3;
						var firstValue = m.substring(0, q); 
						var secondValue = m.substring(q);
						document.getElementById("total").innerHTML  = "$" + firstValue + "," + secondValue;
						
					}
				else{document.getElementById("total").innerHTML  = "$" + m;}
				

			
		
		
	}
	
	
	
	/*================================================
==================================================
============ Converts a number to a string and separates it with commas=============
==================================================
================================================*/	
	
	
/*function formatCurrency(x)
{
  var _x=x.toString();
  var _len=_x.length;
  var _ret="";
  for(var i=_len;i>0;i--)
  {
    if(!((_len-i)%3))
    {
      _ret=","+_ret;
    }
    _ret=_x[i-1]+_ret;
  }
  _ret=_ret.substr(0,_ret.length-1);
  return _ret;
}*/



function commaInsert(m)
	{			
		if (m.length > 3)
		{
			var q = m.length - 3;
			var firstValue = m.substring(0, q); 
			var secondValue = m.substring(q);
			var finalValue  = "$" + firstValue + "," + secondValue;
			return finalValue;
		}
	else{
		var finalValue = "$" + m;
		return finalValue;
		}
	}

/*================================================
==================================================
============ Populates boat imagery  =============
==================================================
================================================*/	

function populateBoatImages(model, hullOptions)
{
		//populates main image First
		
		if(model == "sux204" || model == "sux224" || model == "sux244" || model == "sux264")
		{
		document.getElementById("buildMeBoat").src="boats/" + model + "/base7.png";
		}
		else
		{
		document.getElementById("buildMeBoat").src="boats/" + model + "/base.png";
		}
		document.getElementById('coverContainer').style.visibility="hidden";
		document.getElementById('buildMeBoat').style.visibility="visible";
		document.getElementById('borderColor').style.visibility="visible";
		if(isInt != "1")
		{
		document.getElementById('msrp').style.visibility="visible";
		document.getElementById('total').style.visibility="visible";
		}
		//document.getElementById('borderColor1').style.visibility="visible";
		document.getElementById("arch").style.visibility="hidden";
		document.getElementById("arch1").style.visibility="hidden";
		document.getElementById("graphic").style.visibility="hidden";
		document.getElementById("graphic1").style.visibility="hidden";
	//populates model designator
		document.getElementById("modelDesig").src="../images/modelDesignators/95wPNG/" + model.substring(3) + ".png";
		document.getElementById('modelDesig').style.display="block";
	//populates badge
		document.getElementById("badge").src="../images/badges/95wPNG/" + model.substring(0, 3) + ".png";
		document.getElementById('badge').style.display="block";
		
		document.getElementById('borderColor').style.borderTopColor= "#000000";	
		document.getElementById('borderColor1').style.borderTopColor= "#000000";	

	
	
	// iterates through logo nodes in xml file and extracts position data and assigns it to global vars
	var logos = hullOptions[0].getElementsByTagName('logo');
	for (var i = 0; i<logos.length; i++)
	{
		var id = logos[i].getAttribute('id');
		var top = logos[i].getAttribute('top');
		var left = logos[i].getAttribute('left');
		
		top = parseInt(top);
		left = parseInt(left);


			if(id == "standard")
			{
				
				// Set Styles of divs to be populated
				document.getElementById('buildLogo').src="boats/" + model + "/logo.png";	
				document.getElementById('buildLogo').style.top= top + "px";
				document.getElementById('buildLogo').style.left= left + "px";
				document.getElementById('buildLogo').style.visibility="visible";
				logoTop = top;
				logoLeft = left;

			}
			else if(id == "wideband")
			{
				logoTop1 = top;
				logoLeft1 = left;
			}
	}
	
	
// iterates through graphic nodes in xml file and extracts position data and assigns it to global vars
var graphics = hullOptions[0].getElementsByTagName('graphic');
	for (var i = 0; i<graphics.length; i++)
	{
		var id = graphics[i].getAttribute('id');
		var top = graphics[i].getAttribute('top');
		var left = graphics[i].getAttribute('left');
		
		top = parseInt(top);
		left = parseInt(left);

			if(id == "standard")
			{
				graphicT = top;
				graphicL = left;
				document.getElementById('graphic').src="boats/" + model + "/logo.png";	
				document.getElementById('graphic').style.top= top + "px";
				document.getElementById('graphic').style.left= left + "px";
				document.getElementById('graphic').style.visibility="visible";
			}
			else if(id == "sport")
			{
				graphicTop = top;
				graphicLeft = left;
			}
			
			else if(id == "logo")
			{
				graphicTop1 = top;
				graphicLeft1 = left;
			}
			
			else if(id == "blackSport")
			{
				graphicTop2 = top;
				graphicLeft2 = left;
			}
			
			else if(id == "xLogo")
			{
				graphicTop3 = top;
				graphicLeft3 = left;
			}
			
			else if(id == "ddRed")
			{
				graphicTop4 = top;
				graphicLeft4 = left;
			}
			
			else if(id == "ddCopper")
			{
				graphicTop5 = top;
				graphicLeft5 = left;
			}
			
			else if(id == "ddBlack")
			{
				graphicTop6 = top;
				graphicLeft6 = left;
			}
			
			else if(id == "WT")
			{
				graphicTop7 = top;
				graphicLeft7 = left;
			}
			
					
	}

//iterates through arch nodes if present
if(hullOptions[0].getElementsByTagName('arch'))
{
var archPos = hullOptions[0].getElementsByTagName('arch');
	for (var i = 0; i<archPos.length; i++)
	{
		var id = archPos[i].getAttribute('id');
		var top = archPos[i].getAttribute('top');
		var left = archPos[i].getAttribute('left');
		
		top = parseInt(top);
		left = parseInt(left);

		if(id == "white")
			{
				archTop = top;
				archLeft = left;
			}
			
			else if(id == "black")
			{
				archTop1 = top;
				archLeft1 = left;
			}
			
			else if(id == "tower")
			{
				archTop2 = top;
				archLeft2 = left;
			}
	}
}

canvasVisibility();

	
}



function changeColor(hex)
{
	
		var hullColor = document.getElementById('borderColor');  //.style.borderTopColor= "#000000";	
		var canvasColor = document.getElementById('borderColor1');  //.style.borderTopColor= "#000000";	

		//sets hull color
		hullColor.style.borderTopColor= "#" + hex;
		//sets canvas visibility
		canvasVisibility();
		
		
		//sets canvas color
		if(hex == 'ffffff')
		{
			canvasColor.style.borderTopColor= "#000000";
		}
		else
		{
			canvasColor.style.borderTopColor= "#" + hex;
		}
		
		if(model == "sux264" || model == "sux244" || model == "sux224" || model == "sux204")
			{
			if(document.hullOptions.hullGraphics[2].checked == true)
				{
				var graphic1 = document.getElementById("graphic1");
					
					if(document.getElementsByName('hullColor')[0].checked == true)
						{
						graphic1.src="boats/" + model + "/graphic7.png";
						//position visible elements
						graphic1.style.top= graphicTop6 + "px";
						graphic1.style.left= graphicLeft6 + "px";
						}
					else if(document.getElementsByName('hullColor')[1].checked == true)
						{
						graphic1.src="boats/" + model + "/graphic5.png";
						//position visible elements
						graphic1.style.top= graphicTop4 + "px";
						graphic1.style.left= graphicLeft4 + "px";
						}
					else if(document.getElementsByName('hullColor')[2].checked == true)
						{
						graphic1.src="boats/" + model + "/graphic6.png";
						//position visible elements
						graphic1.style.top= graphicTop5 + "px";
						graphic1.style.left= graphicLeft5 + "px";
						}
				}
			}
			
	
	
	addOptions();
}







//called when Hull color/graphic button is called
function hullChange(id, model)
{
	//alert(model);
	
	
	
	//Declare vars that will serve as placement holders for image elements
	
		var hullColor = document.getElementById('borderColor');  //.style.borderTopColor= "#000000";	
		var canvasColor = document.getElementById('borderColor1'); 
	
	
		// Boat Holder	
		var buildMeBoat = document.getElementById("buildMeBoat");
		//Logo Placeholder
		var buildLogo = document.getElementById("buildLogo");
		//First Graphic Holder
		var graphic = document.getElementById("graphic");
		//Second Graphic Holder
		var graphic1 = document.getElementById("graphic1");
		//White Arch Holder
		var arch = document.getElementById("arch");
		//Black Arch Holder
		var arch1 = document.getElementById("arch1");
		//Standard Graphic Holder
		var tower = document.getElementById("tower");
		
		//colors
		try{var white = document.getElementById('white');}catch(err){}
		try{var black = document.getElementById('black');}catch(err){}
		try{var red = document.getElementById('red');}catch(err){}
		try{var copper = document.getElementById('copper');}catch(err){}
		try{var blue = document.getElementById('blue');}catch(err){}
		try{var yellow = document.getElementById('yellow');}catch(err){}
		try{var shadow = document.getElementById('shadow');}catch(err){}
		try{var blueIce = document.getElementById('blueIce');}catch(err){}
		try{var dblack = document.getElementById('dblack');}catch(err){}
		try{var dred = document.getElementById('dred');}catch(err){}
		try{var dcrush = document.getElementById('dcrush');}catch(err){}
		try{var dice = document.getElementById('dice');}catch(err){}
		try{var dburn = document.getElementById('dburn');}catch(err){}
		try{var damp = document.getElementById('damp');}catch(err){}
		try{var drush = document.getElementById('drush');}catch(err){}
	


	
	if(id == 'standard')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base.png";

		if(blueIce)
			{
			blueIce.style.visibility="hidden";
			if(document.getElementsByName('hullColor')[5].checked == true)
				{
				document.getElementsByName('hullColor')[0].checked = true;
				document.getElementById('borderColor').style.borderTopColor= "#000000";
				document.getElementById('borderColor1').style.borderTopColor= "#000000";
				}			
			}
		//visible and hidden elements
		graphic.style.visibility="hidden";
		graphic1.style.visibility="hidden";
		buildLogo.style.visibility="visible";
		black.style.visibility="visible";
		arch1.style.visibility="hidden";
		
		//position visible elements
		buildLogo.style.top= logoTop + "px";
		buildLogo.style.left= logoLeft + "px";
		
		// this should be reversed as most boats no longre have logo graphics
		if(model != 'ssx276' && model != 'ssx256' && model != 'ssx236' && model != 'ssw186' && model != 'ssw196' && model != 'ssw206' && model != 'ssw216' && model != 'ssw226') 
		{
		//option and checkbox enable/disable/click/unclick
		document.hullOptions.checkboxLogo.disabled = true;
		}
		
		if(model == 'ssx276' || model == 'ssx256' || model == 'ssx236')
		{
		document.getElementById('iceBlue').style.display = 'none';	
		document.getElementById('blue').style.display = 'block';	
		if(document.getElementsByName('hullColor')[6].checked == true)
		{
		document.getElementsByName('hullColor')[0].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#000000";
		document.getElementById('borderColor1').style.borderTopColor= "#000000";
		}
		}
		
		
		
		//sets canvas visibility
		canvasVisibility();
		//resets colors
		resetColor();
		
		}
	
	
	else if(id == 'wideband')
		{
			
			if(model != 'ssx276' && model != 'ssx256' && model != 'ssx236' && model != 'ssw226' && model != 'ssw216' && model != 'ssw206' && model != 'ssw196' && model != 'ssw186') 
				{			
				//Checks to see if logo box had been previously checked, if so, sets the graphic back active and sets the white color swatch back			
				if(document.hullOptions.checkboxLogo && document.hullOptions.checkboxLogo.checked == true)
					{
						graphic1.style.visibility="visible";
						try
						{
							white.style.visibility="visible";
						}
						catch(err){}
						
					}
				else
					{
						graphic1.style.visibility="hidden";
						resetColor();
					}
			
				document.hullOptions.checkboxLogo.disabled = false;
			//end else statement for ssx's
				}
		
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base1.png";
		
		
		if(blueIce)
			{
			blueIce.style.visibility="hidden";
			if(document.getElementsByName('hullColor')[5].checked == true)
				{
				document.getElementsByName('hullColor')[0].checked = true;
				document.getElementById('borderColor').style.borderTopColor= "#000000";
				document.getElementById('borderColor1').style.borderTopColor= "#000000";
				}			
			}

		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="hidden";
		black.style.visibility="visible";
		arch1.style.visibility="hidden";
		
		//position visible elements
		buildLogo.style.top= logoTop1 + "px";
		buildLogo.style.left= logoLeft1 + "px";
		
		//option and checkbox enable/disable/click/unclick
		if(model == 'ssx276' || model == 'ssx256' || model == 'ssx236')
		{
		document.getElementById('iceBlue').style.display = 'none';	
		document.getElementById('blue').style.display = 'block';	
		if(document.getElementsByName('hullColor')[6].checked == true)
		{
		document.getElementsByName('hullColor')[0].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#000000";
		document.getElementById('borderColor1').style.borderTopColor= "#000000";
		}
		
		}
		
			
		//sets canvas visibility
		canvasVisibility();
		
		
		}
	
	
	
	
	
	
	
	else if(id == 'widebandGraphic')
		{
		//populate imagery
		if(model == "sun264" || model == "sun244" || model == "sun224" || model == "sun284" || model == "ssw186")
		{
		buildMeBoat.src="boats/" + model + "/base1.png";
		}
		else
		{
		buildMeBoat.src="boats/" + model + "/base2.png";
		}
		
		graphic.src="boats/" + model + "/graphic1.png";

		if(blueIce)
			{
			blueIce.style.visibility="hidden";
			if(document.getElementsByName('hullColor')[5].checked == true)
				{
				document.getElementsByName('hullColor')[0].checked = true;
				document.getElementById('borderColor').style.borderTopColor= "#000000";
				document.getElementById('borderColor1').style.borderTopColor= "#000000";
				}			
			}
		
		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="visible";
		graphic1.style.visibility="hidden";
		black.style.visibility="visible";
		arch1.style.visibility="hidden";

		
		//position visible elements
		graphic.style.top= graphicTop + "px";
		graphic.style.left= graphicLeft + "px";	
		buildLogo.style.top= logoTop + "px";
		buildLogo.style.left= logoLeft + "px";
		
		
		if(model != 'ssx276' && model != 'ssx256' && model != 'ssx236' && model != 'ssw226' && model != 'ssw216' && model != 'ssw206' && model != 'ssw196' && model != 'ssw186') 
		{
		//option and checkbox enable/disable/click/unclick	
		document.hullOptions.checkboxLogo.disabled = true;
		}
		
		if(model == 'ssx276' || model == 'ssx256' || model == 'ssx236')
		{
		document.getElementById('iceBlue').style.display = 'none';	
		document.getElementById('blue').style.display = 'block';	
		if(document.getElementsByName('hullColor')[6].checked == true)
		{
		document.getElementsByName('hullColor')[0].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#000000";
		document.getElementById('borderColor1').style.borderTopColor= "#000000";
		}
		}
		
		
		//sets canvas visibility
		canvasVisibility();
		//resets colors
		resetColor();
		}
		
	
	
	else if(id == 'logo')
		{
		if(document.hullOptions.checkboxLogo.checked == true)
			{
				// check wideband color option
				document.hullOptions.hullGraphics[1].checked = true;
			try
			{
				white.style.visibility="visible";
				black.style.visibility="visible";
			}
			catch(err){}
			
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base1.png";
		graphic1.src="boats/" + model + "/graphic2.png";
		
		
		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="hidden";
		graphic1.style.visibility="visible";
		arch1.style.visibility="hidden";
		
		//position visible elements
		graphic1.style.top= graphicTop1 + "px";
		graphic1.style.left= graphicLeft1 + "px";	
		buildLogo.style.top= logoTop1 + "px";
		buildLogo.style.left= logoLeft1 + "px";	
		
		
		//option and checkbox enable/disable/click/unclick
		
		//sets canvas visibility
		canvasVisibility();
		
			}
		else
		{
		graphic1.style.visibility="hidden";
		black.style.visibility="visible";
		arch1.style.visibility="hidden";
		//sets canvas visibility
		canvasVisibility();
		resetColor();
		}
		}
		
		
	else if(id == 'sport')
		{
		if(document.hullOptions.checkboxLogo.checked == true)
			{
				// check wideband color option
				document.hullOptions.hullGraphics[1].checked = true;
			
			//populate imagery
			buildMeBoat.src="boats/" + model + "/base1.png";
			graphic1.src="boats/" + model + "/graphic1.png";
			
		    //visible and hidden elements
			buildLogo.style.visibility="visible";
			graphic.style.visibility="hidden";
			graphic1.style.visibility="visible";
			black.style.visibility="visible";
			arch1.style.visibility="hidden";
			
			//position visible elements
			graphic1.style.top= graphicTop + "px";
			graphic1.style.left= graphicLeft + "px";	
			buildLogo.style.top= logoTop + "px";
			buildLogo.style.left= logoLeft + "px";
			
			//option and checkbox enable/disable/click/unclick
			
			
			//sets canvas visibility
			canvasVisibility();
			
			
			}
			else
			{
			document.getElementById('graphic1').style.visibility="hidden";
			black.style.visibility="visible";
			arch1.style.visibility="hidden";
			//sets canvas visibility
			canvasVisibility();
			}
			
			
		
			
			
		}
	
		
		
		
		
		else if(id == 'vapor')
		{
			
		
		
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base10.png";
		
		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="hidden";
		black.style.visibility="visible";
		arch1.style.visibility="hidden";
		
		// Sets blue ice to visible
		blueIce.style.visibility="visible";

		//position visible elements
		buildLogo.style.top= logoTop + "px";
		buildLogo.style.left= logoLeft + "px";
				
		
		
		//option and checkbox enable/disable/click/unclick
		if(model == 'ssx276' || model == 'ssx256' || model == 'ssx236')
		{
		document.getElementById('iceBlue').style.display = 'none';	
		document.getElementById('blue').style.display = 'block';	
		if(document.getElementsByName('hullColor')[6].checked == true)
		{
		document.getElementsByName('hullColor')[0].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#000000";
		document.getElementById('borderColor1').style.borderTopColor= "#000000";
		}
		
		}
		
			
		//sets canvas visibility
		canvasVisibility();
		
		
		}





	else if(id == 'crystal')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base3.png";
		arch.src="boats/" + model + "/arch.png";



		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="hidden";
		graphic1.style.visibility="hidden";
		arch.style.visibility="visible";
		arch1.style.visibility="hidden";
		black.style.visibility="hidden";
		white.style.visibility="visible";
		
		
		//option and checkbox enable/disable/click/unclick
		//document.hullOptions.checkboxLogo.disabled = true;
		
		
		//position visible elements
		arch.style.top= archTop + "px";
		arch.style.left= archLeft + "px";
		
		//Check un-check handling
		if(document.getElementsByName('hullColor')[0].checked == true || document.getElementsByName('hullColor')[6].checked == true)
		{
		document.getElementsByName('hullColor')[5].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#ffffff";
		document.getElementById('borderColor1').style.borderTopColor= "#000000";
		}
		
		
		document.getElementById('iceBlue').style.display = 'none';	
		document.getElementById('blue').style.display = 'block';	
	
		
		
		//sets canvas visibility
		canvasVisibility();
		}
	
	
	
	else if(id == 'carbon')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base4.png";
		arch1.src="boats/" + model + "/arch1.png";

		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="hidden";
		arch1.style.visibility="visible";
		arch.style.visibility="hidden";
		black.style.visibility="hidden";
		white.style.visibility="visible";
		
		//option and checkbox enable/disable/click/unclick
		//document.hullOptions.checkboxLogo.disabled = true;
		
		
		//position visible elements
		arch1.style.top= archTop + "px";
		arch1.style.left= archLeft + "px";
		
		//Check un-check handling
		if(document.getElementsByName('hullColor')[0].checked == true || document.getElementsByName('hullColor')[2].checked == true)
		{
		document.getElementsByName('hullColor')[5].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#ffffff";
		document.getElementById('borderColor1').style.borderTopColor= "#000000";
		}
		
		if(model == 'ssx276' || model == 'ssx256' || model == 'ssx236')
		{
		document.getElementById('iceBlue').style.display = 'block';	
		document.getElementById('blue').style.display = 'none';	
		}
		
		
		//sets canvas visibility
		canvasVisibility();


		}
	
	
	else if(id == 'xtremeWB')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base6.png";
		graphic1.src="boats/" + model + "/graphic4.png";

		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="hidden";
		graphic1.style.visibility="visible";
		dblack.style.visibility="hidden";
		dred.style.visibility="hidden";
		dcrush.style.visibility="hidden";
		dice.style.visibility="visible";
		dburn.style.visibility="visible";
		damp.style.visibility="visible";
		drush.style.visibility="visible";

		
		//position visible elements
		graphic1.style.top= graphicTop3 + "px";
		graphic1.style.left= graphicLeft3 + "px";	
	
		
		//Check un-check handling
		document.getElementsByName('hullColor')[3].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#0096d6";
		document.getElementById('borderColor1').style.borderTopColor= "#0096d6";
		
		
		//sets canvas visibility
		canvasVisibility();
		}
	
	
	else if(id == 'xtremeTB')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base7.png";
		graphic1.src="boats/" + model + "/graphic4.png";
	
		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="hidden";
		graphic1.style.visibility="visible";
		dblack.style.visibility="visible";
		dred.style.visibility="visible";
		dcrush.style.visibility="visible";
		dice.style.visibility="hidden";
		dburn.style.visibility="hidden";
		damp.style.visibility="hidden";
		drush.style.visibility="hidden";
	
		
		//position visible elements
		graphic1.style.top= graphicTop3 + "px";
		graphic1.style.left= graphicLeft3 + "px";
		
		//Check un-check handling
		document.getElementsByName('hullColor')[0].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#000000";
		document.getElementById('borderColor1').style.borderTopColor= "#000000";
		
		//sets canvas visibility
		canvasVisibility();
		
		}
	
	
	else if(id == 'xtremeDD')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base8.png";
		graphic.src="boats/" + model + "/graphic8.png";
		if(document.getElementsByName('hullColor')[0].checked == true)
		{
		graphic1.src="boats/" + model + "/graphic7.png";
		//position visible elements
		graphic1.style.top= graphicTop6 + "px";
		graphic1.style.left= graphicLeft6 + "px";
		}
		else if(document.getElementsByName('hullColor')[1].checked == true)
		{
		graphic1.src="boats/" + model + "/graphic5.png";
		//position visible elements
		graphic1.style.top= graphicTop4 + "px";
		graphic1.style.left= graphicLeft4 + "px";
		}
		else if(document.getElementsByName('hullColor')[2].checked == true)
		{
		graphic1.src="boats/" + model + "/graphic6.png";
		//position visible elements
		graphic1.style.top= graphicTop5 + "px";
		graphic1.style.left= graphicLeft5 + "px";
		}
		else
		{
			document.getElementsByName('hullColor')[0].checked = true;
			document.getElementById('borderColor').style.borderTopColor= "#000000";
			document.getElementById('borderColor1').style.borderTopColor= "#000000";
			graphic1.src="boats/" + model + "/graphic7.png";
			//position visible elements
			graphic1.style.top= graphicTop6 + "px";
			graphic1.style.left= graphicLeft6 + "px";
			
		}
		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="visible";
		graphic1.style.visibility="visible";
		dblack.style.visibility="visible";
		dred.style.visibility="visible";
		dcrush.style.visibility="visible";
		dice.style.visibility="hidden";
		dburn.style.visibility="hidden";
		damp.style.visibility="hidden";
		drush.style.visibility="hidden";
	
		
		//position static elements
		graphic.style.top= graphicTop7 + "px";
		graphic.style.left= graphicLeft7 + "px";

		
		//sets canvas visibility
		canvasVisibility();
		
		}
		
		
		
		else if(id == 'blackWideband')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base9.png";
		arch1.src="boats/" + model + "/arch1.png";


		//visible and hidden elements
		graphic.style.visibility="hidden";
		graphic1.style.visibility="hidden";
		buildLogo.style.visibility="visible";
		black.style.visibility="hidden";
		arch.style.visibility="hidden";
		arch1.style.visibility="visible";
		
		//position visible elements
		buildLogo.style.top= logoTop + "px";
		buildLogo.style.left= logoLeft + "px";
		arch1.style.top= archTop + "px";
		arch1.style.left= archLeft + "px";
		
		
		//option and checkbox enable/disable/click/unclick
		document.hullOptions.checkboxLogo.disabled = true;
		document.getElementsByName('hullColor')[1].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#b51019";
		document.getElementById('borderColor1').style.borderTopColor= "#b51019";
		
		
		
		//sets canvas visibility
		canvasVisibility();
		//resets colors
		resetColor();
		
		}
		
		
		else if(id == 'blackGraphic')
		{
		//populate imagery
		buildMeBoat.src="boats/" + model + "/base1.png";
		graphic.src="boats/" + model + "/graphic3.png";
		arch1.src="boats/" + model + "/arch1.png";
	
		//visible and hidden elements
		buildLogo.style.visibility="visible";
		graphic.style.visibility="visible";
		graphic1.style.visibility="hidden";
		black.style.visibility="hidden";
		arch1.style.visibility="visible";
		arch.style.visibility="hidden";

		
		//position visible elements
		graphic.style.top= graphicTop + "px";
		graphic.style.left= graphicLeft + "px";	
		buildLogo.style.top= logoTop + "px";
		buildLogo.style.left= logoLeft + "px";
		arch1.style.top= archTop + "px";
		arch1.style.left= archLeft + "px";
		
		
		//option and checkbox enable/disable/click/unclick	
		document.hullOptions.checkboxLogo.disabled = true;
		document.getElementsByName('hullColor')[1].checked = true;
		document.getElementById('borderColor').style.borderTopColor= "#b51019";
		document.getElementById('borderColor1').style.borderTopColor= "#b51019";
		
		//sets canvas visibility
		canvasVisibility();
		//resets colors
		resetColor();
		}
		
		

	addOptions();
}








// This resets the background color of the boat if and only if a white hull color has been selected and the newly selected item does not allow a white hull color selection
// This function also makes the white color selection swatch invisible
function resetColor()
{
	try{
		if(document.getElementById('borderColor').style.borderTopColor == "rgb(255, 255, 255)" || document.getElementById('borderColor').style.borderTopColor == "#ffffff")
		  {
			if(model != "sig370")
			{}
			else
			{
			var hullColor = document.getElementsByName('hullColor');
			hullColor[0].checked = true;
			document.getElementById('borderColor').style.borderTopColor= "#000000";
			}
		  }
		  document.getElementById('white').style.visibility="hidden";
		}
		
	catch(err){}
}








/*================================================
==================================================
============ Prints the Build ====================
==================================================
================================================*/	


function printBuild()
{
	//showBox function is for lead entry pop-up box
	//showBox();
	window.print();
}

function printBuild2()
{
	hideBox();
	window.print();
}














/*================================================
==================================================
======== Custom Form in Lightbox like app=========
==================================================
================================================*/



function showBox(){
    $('overlaid').show();
    center('box');
    return false;
}

function hideBox(){
    $('box').hide();
    $('overlaid').hide();
    return false;
}

function center(element){
    try{
        element = $(element);
    }catch(e){
        return;
    }

    var my_width  = 0;
    var my_height = 0;

    if ( typeof( window.innerWidth ) == 'number' )
	{
        my_width  = window.innerWidth;
        my_height = window.innerHeight;
    }
	else if ( document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight ) )
	{
        my_width  = document.documentElement.clientWidth;
        my_height = document.documentElement.clientHeight;
    }
    else if ( document.body &&( document.body.clientWidth || document.body.clientHeight ) )
	{
        my_width  = document.body.clientWidth;
        my_height = document.body.clientHeight;
    }

    element.style.position = 'absolute';
    element.style.zIndex   = 99;

    var scrollY = 0;

    if ( document.documentElement && document.documentElement.scrollTop )
	{
        scrollY = document.documentElement.scrollTop;
    }
	else if ( document.body && document.body.scrollTop )
	{
        scrollY = document.body.scrollTop;
    }
	else if ( window.pageYOffset )
	{
        scrollY = window.pageYOffset;
    }
	else if ( window.scrollY )
	{
        scrollY = window.scrollY;
    }

    var elementDimensions = Element.getDimensions(element);

    var setX = ( my_width  - elementDimensions.width  ) / 2;
    var setY = ( my_height - elementDimensions.height ) / 2 + scrollY;

    setX = ( setX < 0 ) ? 0 : setX;
    setY = ( setY < 0 ) ? 0 : setY;

    element.style.left = setX + "px";
    element.style.top  = setY + "px";

    element.style.display  = 'block';
}



//determines and sets canvas visibility
function canvasVisibility()
{
	//determines if canvas color should be visible or not.
		if(document.getElementById("arch").style.visibility == 'visible' || document.getElementById("arch1").style.visibility == 'visible' || model == "sux264" || model == "sux244" || model == "sux224" || model == "sux204" || model == "sig370")
		{
			document.getElementById('borderColor1').style.visibility = "visible";
		}
		else
		{
			document.getElementById('borderColor1').style.visibility= "hidden";
		}
}



//////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////
/////////////
///////////// checks for and compensates for conditional option related arguments
/////////////
//////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////


function itemCheck()
{
	
	if(model == 'ssx276' || model == 'ssx256' || model == 'ssx236')
	{
		//find if carbon is checked
		if(document.hullOptions.hullGraphics[4].checked == true)
		{
		//disable white arch and white hinged, not black hinged though
		document.getElementById('511CRY').disabled=true;
		document.getElementById('511CRY').checked=false;
		document.getElementById('542').disabled=true;
		document.getElementById('511CAR').disabled=false;
		}
		//find if crystal is checked
		else if(document.hullOptions.hullGraphics[3].checked == true)
		{
		//disable white arch and black arches, not white hinged though
		document.getElementById('511CAR').disabled=true;
		document.getElementById('511CAR').checked=false;
		document.getElementById('542').disabled=true;
		document.getElementById('511CRY').disabled=false;
		}
		else
		{
		//enable arches
		document.getElementById('511CRY').disabled=false;
		document.getElementById('511CAR').disabled=false;
		document.getElementById('511CRY').checked=false;
		document.getElementById('511CAR').checked=false;
		document.getElementById('542').disabled=false;
		

		}
	}




 	if(model == 'sun284' || model == 'sun264')
	{
		if(document.hullOptions.hullGraphics[4].checked == true || document.hullOptions.hullGraphics[5].checked == true)
		{
		if(document.getElementById('755').checked==false)
		{
		//select black arch option
		document.getElementById('731').checked=true;
		//de-selects hinged white
		document.getElementById('745').checked=false;
		//de-selects white arch
		document.getElementById('721').checked=false;
		//disables white arch and hinged white arch
		document.getElementById('745').disabled=true;
		document.getElementById('721').disabled=true;
		}
		

		}
		else
		{
		//un-checks black arch
		document.getElementById('731').checked=false;
		document.getElementById('755').checked=false;
		//disables white arch and hinged white arch
		document.getElementById('745').disabled=false;
		document.getElementById('721').disabled=false;
	
		}
	
	}


	if(model == 'sig270')
	{
	// checks for requirements for vacuflush systems
	if(document.getElementById('503').checked==true || document.getElementById('504').checked==true )
		{	
		document.getElementById('553').checked=true;
		}
	}


	if(model == 'ssi180' || model == 'ssi204' || model == 'ssi210')
	{
	// checks extended swim platform if the customer selects platform logo mat
	if(document.getElementById('695').checked==true)
		{	
		document.getElementById('667').checked=true;
		}
	}
	
	if(model == 'ssi275')
	{
	// A/C requries overnight package
	if(document.getElementById('502').checked==true)
		{	
		document.getElementById('532').checked=true;
		}
	}
	
	if(model == 'sun264' || model == 'sun244' || model == 'sun224')
	{
	// Premium Speakers require dual batt setup
	if(document.getElementById('712').checked==true)
		{	
		document.getElementById('725').checked=true;
		}
	}

	if(model == 'sun264')
	{
	//Grill requires dual batt setup
	if(document.getElementById('728').checked==true || document.getElementById('713').checked==true)
		{	
		document.getElementById('725').checked=true;
		}
	}
	
	
	if(model == 'sun244' || model == 'sun224')
	{
	//Windscreen package only available with wraparound windshield
	if(document.getElementById('717').checked==true)
		{	
		document.getElementById('702').checked=true;
		}
	}
	
	if(model == 'sux264')
	{
	//Checks black arch option if white arch option or other hinged arch options are not checked
	if(document.getElementById('745').checked==false && document.getElementById('755').checked==false)
		{	
		document.getElementById('731').checked=true;
		}
	}


 



//end of conditional option statements
}
























