// Russell Thompson
// Project: Freelance 2009 temp page
// Page: general javascript for the temp page
// January, 2009
// copyright (c) 2009 Russ Thompson and Freelance I.T. Solutions all rights reserved

// DECLARATIONS AND ASSIGNMENTS

var contentArray = new Array();
var imageArray = new Array();

contentArray[0] = "<center><img src=\"images/appProgramming_top.jpg\" border=\"0\" /></center><hr /><font style=\"font-weight: bold; font-size: 13px;\">Today there are</font> many applications available from large companies.  These applications are usually written to cover a broad set of circumstances, giving everyone something and no one that perfect solution.<br /><br />We create custom application for both the desktop and web.  These applications include desktop / on-line reservation systems, accounting / billing systems, contact management systems, on-line payment systems, 'blogs,  CMSs, and more.<br /><br />Why should you contact us to develop your application?<ul><li class=\"bg_FFF4A2\">years of experience developing desktop and web applications.</li><li class=\"bg_FFFFFF\">clean, well designed user interfaces to increase usability.</li><li class=\"bg_FFF4A2\">custom applications that meet YOUR needs.</li><li class=\"bg_FFFFFF\">we will work with you to keep costs reasonable.</li></ul><center><a href=\"javascript: prepAJAX('applications', '', 'popupInnerDisplayDiv');\"><img src=\"images/customApplicationQuote.jpg\" border=\"0\" alt=\"get a custom quote for your application\" title=\"click here for custom application quote\" /></a></center>";
contentArray[1] = "<center><img src=\"images/webDesign_top.jpg\" border=\"0\" /></center><hr /><font style=\"font-weight: bold; font-size: 13px;\">The Web sites</font> we’ve designed range from simple - containing just a few HTML pages, to very complex - incorporating Java applets, Flash animations, database connectivity and more. Our members specialize in designing, developing, programming and maintaining custom websites. Our ‘get-to-know-our-client’ approach emphasizes communications with you, our client. The end result is a cost-effective, targeted, content-rich website that delivers your message to the Internet community in a visually appealing, accurate and effective way.<br /><br />Some reasons to let us create your website:<ul><li class=\"bg_FFFFFF\">clean layout and design</li><li class=\"bg_FFF4A2\">custom design and work (no templates)</li><li class=\"bg_FFFFFF\">optimized for better search engine visibility</li><li class=\"bg_FFF4A2\">accessible and easy to navigate</li><li class=\"bg_FFFFFF\">experience with the latest Internet technologies</li></ul><center><a href=\"javascript: prepAJAX('webQuote', '', 'popupInnerDisplayDiv');\"><img src=\"images/customWebQuote.jpg\" border=\" alt=\"get a custom web design quote\" title=\"click here for web design quote\" /></a></center>";
contentArray[2] = "<center><img src=\"images/marketing_top.jpg\" border=\"0\" /></center><hr /><font style=\"font-weight: bold; font-size: 13px;\">Our marketing team</font> is made up of professionals with 12 year experience in Internet marketing.  We analyze your entire marketing campaign and create an on-line marketing strategy that will work in conjunction with that campaign.  If your company is lacking a marketing campaign, we can work with you to create an entire marketing plan.<br /><br />Our marketing consulting package includes:<ul><li class=\"bg_FFFFFF\">research to optimize pricing strategy</li><li class=\"bg_FFF4A2\">Internet branding to parallel other marketing efforts</li><li class=\"bg_FFFFFF\">research/analyze data to find industry trends</li><li class=\"bg_FFF4A2\">best use of Internet promotions with other media</li><li class=\"bg_FFFFFF\">review of website copy to optimize for search engine visibility</li></ul><center><a href=\"javascript: prepAJAX('marketing', '', 'popupInnerDisplayDiv');\"><img src=\"images/contactMarketing.jpg\" border=\"0\" alt=\"contact internet marketing team\" title=\"click here to contact marketing professional\" /></a></center>";
contentArray[3] = "<center><img src=\"images/hosting_top.jpg\" border=\"0\" /></center><hr /><font style=\"font-weight: bold; font-size: 13px;\">Our hosting services</font> deliver the most advanced and reliable features and functionality available for the Web. Using RAID5 storage technology and co-located servers, your website and data are safe with us.<br /><br />Some features of our hosting service:<ul><li class=\"bg_FFF4A2\">no set-up fees</li><li class=\"bg_FFFFFF\">plans for basic sites to e-commerce and data-driven sites</li><li class=\"bg_FFF4A2\">99.9% up-time</li><li class=\"bg_FFFFFF\">e-mail included with site hosting plans</li></ul><br /><center><a href=\"javascript: prepAJAX('hosting', '', 'popupInnerDisplayDiv');\"><img src=\"images/seeHostingPrices.jpg\" border=\"0\" alt=\"see hosting prices\" title=\"click here to view hosting price list\" /></a></center>";

// FUNCTION TO PRELOAD IMAGES USED IN MODAL LAYERS (ABOVE)
function preloadImages()
{
	for (x = 0; x < preloadImages.arguments.length; x++)
	{
		imageArray[x] = new Image();
		imageArray[x].src = "images/" + preloadImages.arguments[x];
	}
}

// FUNCTIONS FOR MODAL LAYER
function modalVisible(theWhat)
{
	document.getElementById('modal_layer').style.visibility = "visible";
	
	switch (theWhat)
	{
		case "programming":
			document.getElementById('modalTitle').innerHTML = "Application Programming";
			
			// the below two lines work awesomely in FF et al, but of course don't work in IE... IE always screws up everything. so I must write some more indepth, difficault code
			//document.getElementById('modalControlDown').setAttribute("onclick", "javascript: modalVisible('design');");
			//document.getElementById('modalControlUp').setAttribute("onclick", "javascript: modalVisible('hosting');");
			
			// so that this all works in STUPID IE as well as FF
			document.getElementById('modal_controls').innerHTML = "";
			var theInnerHtml = "<img src=\"images/menuPopUp_arrowButton_down.jpg\" id=\"modalControlDown\" name=\"modalControlDown\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('design');\" />&nbsp;<img src=\"images/menuPopUp_arrowButton_up.jpg\" id=\"modalControlUp\" name=\"modalControlUp\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('hosting');\" />";
			document.getElementById('modal_controls').innerHTML = theInnerHtml;
			
			// the copy
			document.getElementById('m_copyArea').innerHTML = contentArray[0];
		break;
		
		case "design":
			document.getElementById('modalTitle').innerHTML = "Website Design";
			
			// the below two lines work awesomely in FF et al, but of course don't work in IE... IE always screws up everything. so I must write some more indepth, difficault code
			//document.getElementById('modalControlDown').setAttribute("onclick", "javascript: modalVisible('marketing');");
			//document.getElementById('modalControlUp').setAttribute("onclick", "javascript: modalVisible('programming');");
			
			// so that this all works in STUPID IE as well as FF
			document.getElementById('modal_controls').innerHTML = "";
			var theInnerHtml = "<img src=\"images/menuPopUp_arrowButton_down.jpg\" id=\"modalControlDown\" name=\"modalControlDown\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('marketing');\" />&nbsp;<img src=\"images/menuPopUp_arrowButton_up.jpg\" id=\"modalControlUp\" name=\"modalControlUp\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('programming');\" />";
			document.getElementById('modal_controls').innerHTML = theInnerHtml;
			
			// the copy
			document.getElementById('m_copyArea').innerHTML = contentArray[1];
		break;
		
		case "marketing":
			document.getElementById('modalTitle').innerHTML = "Internet Marketing";
			
			// the below two lines work awesomely in FF et al, but of course don't work in IE... IE always screws up everything. so I must write some more indepth, difficault code
			//document.getElementById('modalControlDown').setAttribute("onclick", "javascript: modalVisible('hosting');");
			//document.getElementById('modalControlUp').setAttribute("onclick", "javascript: modalVisible('design');");
			
			// so that this all works in STUPID IE as well as FF
			document.getElementById('modal_controls').innerHTML = "";
			var theInnerHtml = "<img src=\"images/menuPopUp_arrowButton_down.jpg\" id=\"modalControlDown\" name=\"modalControlDown\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('hosting');\" />&nbsp;<img src=\"images/menuPopUp_arrowButton_up.jpg\" id=\"modalControlUp\" name=\"modalControlUp\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('design');\" />";
			document.getElementById('modal_controls').innerHTML = theInnerHtml;
			
			// the copy
			document.getElementById('m_copyArea').innerHTML = contentArray[2];
		break;
		
		case "hosting":
			document.getElementById('modalTitle').innerHTML = "Web Hosting";
			
			// the below two lines work awesomely in FF et al, but of course don't work in IE... IE always screws up everything. so I must write some more indepth, difficault code
			//document.getElementById('modalControlDown').setAttribute("onclick", "javascript: modalVisible('programming');");
			//document.getElementById('modalControlUp').setAttribute("onclick", "javascript: modalVisible('marketing');");
			
			// so that this all works in STUPID IE as well as FF
			document.getElementById('modal_controls').innerHTML = "";
			var theInnerHtml = "<img src=\"images/menuPopUp_arrowButton_down.jpg\" id=\"modalControlDown\" name=\"modalControlDown\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('programming');\" />&nbsp;<img src=\"images/menuPopUp_arrowButton_up.jpg\" id=\"modalControlUp\" name=\"modalControlUp\" border=\"0\" class=\"controlImage\" onclick=\"javascript: modalVisible('marketing');\" />";
			document.getElementById('modal_controls').innerHTML = theInnerHtml;
			
			// the copy
			document.getElementById('m_copyArea').innerHTML = contentArray[3];
		break;
	} // end switch
}

function modalLayerOff()
{
	document.getElementById('modal_layer').style.visibility = "hidden";
} // end modalLayerOff function

function checkContactField(forWhatForm, theField)
{
	// decide what form to use
	switch (forWhatForm)
	{
		case "app":
			var myForm = document.appRequest;
		break;
		
		case "web":
			var myForm = document.webRequest;
		break;
		
		case "marketing":
			var myForm = document.marketingRequest;
		break;
	} // end switch for form name
	
	// now check the field(s)
	switch (theField)
	{
		case "phone":
			if (myForm.phone.value == "" || myForm.phone.value == " " || myForm.phone.value == null)
			{
				alert("If you would like us to contact you by phone, please enter a phone number.");
				myForm.phone.focus();
			}
		break;
		
		case "email":
			if (myForm.email.value == "" || myForm.email.value == " " || myForm.email.value == null)
			{
				alert("If you would like us to contact you by e-mail, please enter an e-mail address.");
				myForm.email.focus();
			}
		break;
	} // end switch
} // end checkContactField function

function changeHumanCode()
{
	// generate 7 random numbers between 0 and 20 (inclusive)
	var maxLoops = 7;
	var codeArray = new Array(7);
	var printCode = "";
	for (var x = 0; x < maxLoops; x++)
	{
		var y = Math.floor(Math.random() * 21);
		codeArray[x] = y;
	} // end loop to generate numbers
	
	// now loop through the array to create the code for the number images
	for (var z = 0; z < codeArray.length; z++)
	{
		printCode = printCode + "<img src=\"images/" + codeArray[z] + ".jpg\" border=\"0\" alt=\"\" />";
	} // end loop to create html code for images
	
	// convert the array to a string of numbers
	var stringCode = codeArray.join("");
	
	// insert everything into the html page
	document.getElementById('theHumanCode').value = stringCode;
	document.getElementById('codeCell').innerHTML = printCode;
} // end changeHumanCode function

function makeVisible(seeIt)
{
	switch (seeIt)
	{
		case "desktop":
			var thisElem = document.getElementById('desktopRow')
			var theOtherElem = document.getElementById('webRow');
			var yesElem = document.getElementById('siteYes');
			var noElem = document.getElementById('siteNo');
			var radioGroup = document.appRequest.have_web_site;
			var currentState;
			
			// first see if 'web app' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				// for testing ->				alert("Current computed style of Visibility: " + currentState);
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
					
					yesElem.style.visibility = "collapse";
					yesElem.style.display = "none";
					
					noElem.style.visibility = "collapse";
					noElem.style.display = "none";
				} // end currentState if
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				// for testing ->				alert("Current style setting of display: " + currentState);
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
					
					yesElem.style.display = "none";
					
					noElem.style.display = "none";
				} // end currentState if
				
				// now make the clicked on elements area visible
				thisElem.style.display = "inline";
			}
			
			if (currentState != "collapse" || currentState != "none")
			{
				// clear the 'have_web_site' radio buttons
				// for testing -> 				alert("Outside for loop. Num of radioGroup buttons: " + radioGroup.length + ".");
				for (var r = 0; r < radioGroup.length; r++)
				{
					// for testing -> 					alert("Inside for loop. Num of radioGroup buttons: " + radioGroup.length + ".");
					if (radioGroup[r].checked == true)
					{
						radioGroup[r].checked = false
					}
				} // end for loop to clear 'have_web_site' radio buttons
			}
			
			
		break;
		
		case "web":
			var thisElem = document.getElementById('webRow')
			var theOtherElem = document.getElementById('desktopRow');
			var currentState;
			
			// first see if 'web app' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				// for testing ->				alert("Current computed style of Visibility: " + currentState);
				
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
				
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				// for testing ->				alert("Current style setting of display: " + currentState);
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on stuff visible
				thisElem.style.display = "inline";
			}
			
			
		break;
		
		case "both":
			// both web and desktop app, make all viewable
			var testElem = document.getElementById('desktopRow'); // used just to test if IE is being used
			
			if (window.getComputedStyle)
			{
				document.getElementById('desktopRow').style.visibility = "visible";
				document.getElementById('desktopRow').style.display = "inline";
				document.getElementById('webRow').style.visibility = "visible";
				document.getElementById('webRow').style.display = "inline";
			}
			else if (testElem.currentStyle)
			{
				document.getElementById('desktopRow').style.display = "inline";
				document.getElementById('webRow').style.display = "inline";
			}
		break;
		
		case "not_sure":
			// if they are not sure about the type of app they want, we need to make sure all desktop and web app questions are closed
			var desktopElem = document.getElementById('desktopRow');
			var webElem = document.getElementById('webRow');
			var yesElem = document.getElementById('siteYes');
			var noElem = document.getElementById('siteNo');
			var radioGroup = document.appRequest.have_web_site;
			
			if (window.getComputedStyle)
			{
				if (window.getComputedStyle(desktopElem, null).visibility != "collapse")
				{
					desktopElem.style.visibility = "collapse";
					desktopElem.style.display = "none";
				}
				
				if (window.getComputedStyle(webElem, null).visibility != "collapse")
				{
					webElem.style.visibility = "collapse";
					webElem.style.display = "none";
				}
				
				if (window.getComputedStyle(yesElem, null).visibility != "collapse")
				{
					yesElem.style.visibility = "collapse";
					yesElem.style.display = "none";
				}
				
				if (window.getComputedStyle(noElem, null).visibility != "collapse")
				{
					noElem.style.visibility = "collapse";
					noElem.style.display = "none";
				}
			}
			else if (desktopElem.currentStyle)
			{
				if (desktopElem.currentStyle.display != "none")
				{
					desktopElem.style.display = "none";
				}
				
				if (webElem.currentStyle.display != "none")
				{
					webElem.style.display = "none";
				}
				
				if (yesElem.currentStyle.display != "none")
				{
					yesElem.style.display = "none";
				}
				
				if (noElem.currentStyle.display != "none")
				{
					noElem.style.display = "none";
				}
			}
			
			// clear the 'have_web_site' radio buttons
			for (var r = 0; r < radioGroup.length; r++)
			{
				if (radioGroup[r].checked == true)
				{
					radioGroup[r].checked = false
				}
			} // end for loop to clear 'have_web_site' radio buttons	
		break;
		
		case "siteYes":
			var thisElem = document.getElementById('siteYes')
			var theOtherElem = document.getElementById('siteNo');
			var currentState;
			
			// first see if 'site no' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.display = "inline";
			}			
		break;
		
		case "siteNo":
			var thisElem = document.getElementById('siteNo')
			var theOtherElem = document.getElementById('siteYes');
			var currentState;
			
			// first see if 'site yes' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				// for testing ->				alert("Current computed style of Visibility: " + currentState);
				
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				// for testing ->				alert("Current style setting of display: " + currentState);
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.display = "inline";
			}
		break;
		
		case "webDesign_site_yes":
			var thisElem = document.getElementById('webDesign_site_yes')
			var theOtherElem = document.getElementById('webDesign_site_no');
			var radioGroup = document.webRequest.current_idea_noSite;
			var currentState;
			
			// first see if 'site yes' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.display = "inline";
			}
			
			if (currentState != "collapse" || currentState != "none")
			{
				// clear the 'no site' radio buttons
				for (var r = 0; r < radioGroup.length; r++)
				{
					if (radioGroup[r].checked == true)
					{
						radioGroup[r].checked = false
					}
				} // end for loop to clear 'have_web_site' radio buttons
			}
		break;
		
		case "webDesign_site_no":
			var thisElem = document.getElementById('webDesign_site_no')
			var theOtherElem = document.getElementById('webDesign_site_yes');
			var checkboxGroup = document.webRequest.site_yes;
			var currentState;
			
			// first see if 'site yes' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.display = "inline";
			}
			
			if (currentState != "collapse" || currentState != "none")
			{
				// clear the 'have_site' checkboxes
				for (var r = 0; r < checkboxGroup.length; r++)
				{
					if (checkboxGroup[r].checked == true)
					{
						checkboxGroup[r].checked = false
					}
				} // end for loop to clear 'have_web_site' radio buttons
			}
		break;
		
		case "marketing_website_yes":
			var thisElem = document.getElementById('marketing_website_yes')
			var theOtherElem = document.getElementById('marketing_website_no');
			var checkboxGroup = document.marketingRequest.websiteNo_needs;
			var currentState;
			
			// first see if 'site yes' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.display = "inline";
			}
			
			if (currentState != "collapse" || currentState != "none")
			{
				// clear the 'have_site' checkboxes
				for (var r = 0; r < checkboxGroup.length; r++)
				{
					if (checkboxGroup[r].checked == true)
					{
						checkboxGroup[r].checked = false
					}
				} // end for loop to clear 'have_web_site' radio buttons
			}
		break;
		
		case "marketing_website_no":
			var thisElem = document.getElementById('marketing_website_no')
			var theOtherElem = document.getElementById('marketing_website_yes');
			var checkboxGroup = document.marketingRequest.websiteYes_needs;
			var currentState;
			
			// first see if 'site yes' stuff is visible, hide / collapse it if it is
			if (window.getComputedStyle)
			{
				currentState = window.getComputedStyle(theOtherElem, null).visibility;
				
				if (currentState != "collapse")
				{
					theOtherElem.style.visibility = "collapse";
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.visibility = "visible";
				thisElem.style.display = "inline";
			}
			else if (theOtherElem.currentStyle)
			{
				currentState = theOtherElem.currentStyle.display;
				
				if (currentState != "none")
				{
					theOtherElem.style.display = "none";
				}
				
				// now make the clicked on elements area visible
				thisElem.style.display = "inline";
			}
			
			if (currentState != "collapse" || currentState != "none")
			{
				// clear the 'have_site' checkboxes
				for (var r = 0; r < checkboxGroup.length; r++)
				{
					if (checkboxGroup[r].checked == true)
					{
						checkboxGroup[r].checked = false
					}
				} // end for loop to clear 'have_web_site' radio buttons
			}
		break;
	} // end switch
} // end makeVisible function