//MSJ Consultancy JavaScript
//FUNCTION LIST
//onLoadFunction()
//removeDomChilds(domParent)
//hoverLink(id)
//offLink(id)
//clickLink(id)
//hoverMenuButton(id)
//offMenuButton(id)
//clickMenuButton(id)
//hoverMenuLink(id)
//offMenuLink(id)
//clearInput(id)
//activeColor(id)
//checkInput(id)
//checkEmail(id)
//checkBlank(id)
//changeStarColor(id, bool)
//checkFormat(id)
//checkDodgyChars(id)
//clickRadio(id, bool)
//setRequestButton()
//checkMaxChars(id)
//checkRadio(yesId, noId, mayId, starId)
//resetRegForm()
//hoverExpandIcon(id)
//offExpandIcon(id)
//clickExpandIcon(id, paraId)




function onLoadFunction(){
//Sets the news link button as "on" so the dom can see the colors and function properly in onClick
var newsLinkObj = document.getElementById("homelink");
newsLinkObj.style.color = "white";
newsLinkObj.style.backgroundColor = "darkslategray";

var hsnButtonObj1 = document.getElementById("hsn-1");

hsnButtonObj1.style.color = "white";
hsnButtonObj1.style.backgroundColor = "darkslateblue";

}

function removeDomChilds(domParent){
//pass the parent name here, and it will delete all child nodes.
//alert("It passed this way");
	if ( domParent.hasChildNodes() )
	{
		//alert(domParent);
		while(domParent.childNodes.length >=1)
		{
			//alert("removing child");
			domParent.removeChild(domParent.firstChild);
		}
		
	}
}

function hoverLink(id){
//alert("id = " + id);
var idObj = document.getElementById(id);
var textColor = idObj.style.color;

if(textColor == "white" || textColor == "#ffffff"){
	//Cancel if this link was selected by a click

	exit;
}

idObj.style.color = "darkslategray";
idObj.style.backgroundColor = "lavender";


//alert("hovering");

}

function offLink(id){
//alert("off hover");
var idObj = document.getElementById(id);
var textColor = idObj.style.color;

if(textColor == "white" || textColor == "#ffffff"){
	//Cancel if this link was selected by a click

	exit;
}

idObj.style.color="black";
idObj.style.backgroundColor = "white";

}

function clickLink(id){
//unclick previously selected link, by looping array of links and returning selected link to default colors.
//var linkArray = new Array();
var linkArray = new Array("home", "hsn", "ness", "about", "cv");
arrayCount = linkArray.length - 1;
var i;
for(i=0; i<=arrayCount; i++){
	var linkId = linkArray[i];
	//adjust id to find link buttons
	linkId = linkId + "link";
	var linkColor = document.getElementById(linkId).style.color;
	//alert(linkColor);
	if(linkColor == "white"  || linkColor == "#ffffff"){
		//alert("link was selected " + linkColor);
		var otherObj = document.getElementById(linkId);
		
		otherObj.style.color="black";
		otherObj.style.backgroundColor = "white";
		//switch off the topic's div display, change id from ..link to ...div
		var divId = linkId.substr(0,linkId.length - 4);
		
		divId = divId + "div";
		
		//document.getElementById(divId).style.display = "none";
		 document.getElementById(divId).className = "displayoff";
	}

}
lid = id + "link";
var idObj = document.getElementById(lid);
idObj.style.color="white";
idObj.style.backgroundColor = "darkslategray";

var did = id + "div";
document.getElementById(did).className = "displayon";

//Show selected links topic, replace "link" from id with "div", switch off current topics div
//

//alert(arrayCount); 


}

function hoverMenuButton(id){
//alert("id = " + id);
var idObj = document.getElementById(id);
var textColor = idObj.style.color;

if(textColor == "white" || textColor == "#ffffff"){
	//Cancel if this link was selected by a click

	exit;
}

idObj.style.color = "darkslategray";
//idObj.style.backgroundColor = "lavender";
idObj.style.borderColor = "darkslateblue";

//alert("hovering");

}

function offMenuButton(id){
//alert("off hover");
var idObj = document.getElementById(id);
var textColor = idObj.style.color;

if(textColor == "white" || textColor == "#ffffff"){
	//Cancel if this link was selected by a click

	exit;
}


idObj.style.color="black";
idObj.style.backgroundColor = "lavender";
idObj.style.borderColor = "white";

}

function clickMenuButton(id){
//unclick previously selected link, by looping array of links and returning selected link to default colors.
//var linkArray = new Array();
var linkArray = new Array("hsn-1", "hsn-2", "hsn-3", "hsn-4", "hsn-5");
arrayCount = linkArray.length - 1;
var i;
for(i=0; i<=arrayCount; i++){
	var buttonId = linkArray[i];
	
	var buttonColor = document.getElementById(buttonId).style.color;
	//alert(buttonColor);
	if(buttonColor == "white" || buttonColor == "#ffffff"){
		switch (buttonId){
		case "hsn-1":
			topicDiv = "hsnaboutdiv";
			break;
		case "hsn-2":
			topicDiv = "hsnaimsdiv";
			break;
		case "hsn-3":
			topicDiv = "hsnrelaunchdiv";
			break;
		case "hsn-4":
			topicDiv = "hsnsteerdiv";
			break;
		case "hsn-5":
			topicDiv = "hsnregdiv";
			break;

		}
		//alert("link was selected " + linkColor);
		var otherObj = document.getElementById(buttonId);
		
		otherObj.style.color="black";
		otherObj.style.backgroundColor = "lavender";
		//switch off the topic's div display, change id from ..link to ...div
		
		
		//document.getElementById(divId).style.display = "none";
		 document.getElementById(topicDiv).className = "displayoff";
	}

}
	switch (id){
	case "hsn-1":
		topicDiv = "hsnaboutdiv";
		break;
	case "hsn-2":
		topicDiv = "hsnaimsdiv";
		break;
	case "hsn-3":
		topicDiv = "hsnrelaunchdiv";
		break;
	case "hsn-4":
		topicDiv = "hsnsteerdiv";
		break;
	case "hsn-5":
		topicDiv = "hsnregdiv";
		break;

	}

var idObj = document.getElementById(id);
idObj.style.color="white";
idObj.style.backgroundColor = "darkslateblue";
idObj.style.borderColor = "white";

//var did = id + "div";
document.getElementById(topicDiv).className = "displayon";

}

function hoverMenuLink(id){
//alert("id = " + id);
var idObj = document.getElementById(id);

//special case for home links, roll out abbreviations
var linkValue = idObj.firstChild.childNodes[0].data;
//alert(linkValue);
switch(linkValue){
case "RSS":
	idObj.firstChild.childNodes[0].data = "Royal Statistical Society";
	break;
case "RSS\'s SUF":
	idObj.firstChild.childNodes[0].data = "Statistics Users Forum";
	break;
case "NeSS":
	idObj.firstChild.childNodes[0].data = "Neighbourhood Statistics";
	break;
case "HSN":
	idObj.firstChild.childNodes[0].data = "Housing Statistics Network";
	break;
case "HSN IF":
	idObj.firstChild.childNodes[0].data = "HSN Internet Forum";
	break;

}
idObj.style.color = "darkslategray";
//idObj.style.backgroundColor = "lavender";
idObj.style.borderColor = "darkslateblue";

//alert("hovering");

}

function offMenuLink(id){
//alert("off hover");
var idObj = document.getElementById(id);

//special case, shortening link names from abbreviation on hover
var linkValue = idObj.firstChild.childNodes[0].data;
//alert(linkValue);
switch (linkValue){
case "Royal Statistical Society":
	idObj.firstChild.childNodes[0].data = "RSS";
	break;
case "Statistics Users Forum":
	idObj.firstChild.childNodes[0].data = "RSS's SUF";
	break;

case "Neighbourhood Statistics":
	idObj.firstChild.childNodes[0].data = "NeSS";
	break;
case "Housing Statistics Network":
	idObj.firstChild.childNodes[0].data = "HSN";
	break;
case "HSN Internet Forum":
	idObj.firstChild.childNodes[0].data = "HSN IF";
	break;

}

idObj.style.color="black";
idObj.style.backgroundColor = "lavender";
idObj.style.borderColor = "white";

}

function clearInput(id){
//only clear if focussing for first time, check existing text
var idObj = document.getElementById(id);
var text = idObj.value;

text = text.substr(0,5);
//alert(text);
if(text == "Enter" || text == "First" || text == "Last " || text == "Your ")
{
	
	//Clears contents on focus and changes text color to black
	idObj.value = "";
	idObj.style.color = "black";


}
//Otherwise nothing happens old text remains for editing

}

function activeColor(id){
document.getElementById(id).style.color = "black";

}


function checkInput(id){

//Check characters are not more that limit set. Different for each one.
var idObj = document.getElementById(id);

var chqBlank = checkBlank(id);
//	alert(chqBlank);
changeStarColor(id, chqBlank);

//Check to see if all are ready, ie green
//setRequestButton();

}

function checkEmail(id){
//make sure not blank, then validate email format exists
var idObj = document.getElementById(id);

var chqBlank = checkBlank(id);
//alert("check email called, and chqBlank is" + chqBlank);

//if blank, no point in continuing this check exit and make sure star is red
if(chqBlank == false)
{
	changeStarColor(id, chqBlank);
	exit;
}

var chqFormat = checkFormat(id);
//alert(chqFormat);
changeStarColor(id, chqFormat);
//setRequestButton();

}

function checkBlank(id){
	//Check input not blank. Return true if not blank, false if blank

	var idValue = document.getElementById(id).value;
	//alert(idValue);

	if(idValue != "")
	{
		//alert(idValue);
		return true;
	}
	else
	{
		return false;
	}
}


function changeStarColor(id, bool){
//alert(id);
var strCheck = id.indexOf("star");
//alert(strCheck);
//adds "star" to id, make sure not including star
if(strCheck == -1){
	//alert(id);
	var starId = id + "star";
}
else
{
	//default
	starId = id;
	//alert(starId);
}
//some calls will include star in id, others are relying on id of related elements, hence adding star
//sorry, messy  i know

//alert(starId);

var starObj = document.getElementById(starId);

if(bool)
{

	//Replace red * with green *
	starObj.style.color = "forestgreen";
	
	//alert(starColor);
	//Check all other essential info stars, 
	
}
else
{
	//nothing happens, but make sure color remains or returns to tomato(not red)
	starObj.style.color = "tomato";


}
//go through set request button procedure
setRequestButton();

}


function checkFormat(id){
//Check format fits the data. 
var idObj = document.getElementById(id);
var dataEntry = idObj.value;

switch(id)
{
case "firstname": case "lastname": 
	
	break;
case "guestemail": 

	//make sure text input is in format of email, ie text@mailprovider.wotsitcalled
	//Using regular expression, first time here, seems to work
	var regex = /^[\w\-._+]+@[\w\-]+(\.\w{2,4})+$/;
	//alert(dataEntry);

	if(!regex.test(dataEntry))
	{
	return false;
	//alert("Please check to make sure you have entered your email correctly.");
	}
	else
	{
	//nothing happens
	//alert("Looking goooood");
	return true;
	}
	break;

}

}


function checkDodgyChars(id){

//Check characters are not dodgy.

}

function clickRadio(id, bool){
//change colour of star to green, as click means one is selected, go thru set request procedure
changeStarColor(id, bool);
}


function setRequestButton(){
//Check all requirements are met before enabling request button for activation.
var starArray = new Array("firstname", "lastname", "guestemail", "sgcheck", "regcheck", "upcheck");
var i;
for(i=0;i<=5;i++){
	var starId = starArray[i] + "star";
	var starColor = document.getElementById(starId).style.color;
	//don't use alert here, constantly calls itself!!!
	if(starColor != "forestgreen" && starColor != "rgb(34, 139, 34)" && starColor != "#228b22")
	{
		//exit function to prevent button being prematurely enabled
		document.getElementById("register").disabled = true;

		exit;
	}

}
		document.getElementById("register").disabled = false;

}

function checkMaxChars(id){
//give alert based on id of input text box
var idObj = document.getElementById(id);
var charLength = idObj.value.length;
//alert(charLength);

switch(id)
{
case "firstname":
	if(charLength == 20){
	alert("Please enter a first name with 20 characters or less. \n" +
	"If this is a problem please contact me.");
	}
	break;

case "lastname":
	if(charLength == 30){
	alert("Please enter a last name with 30 characters or less. \n" +
	"If this is a problem please contact me.");
	}

	break;

case "guestemail":
	if(charLength == 60){
	alert("Please enter an email address with 60 characters or less. \n" +
	"If this is a problem please contact me.");
	}
	break;

case "guestphone":
	if(charLength == 20){
	alert("Please enter a phone number with 20 characters or less. \n" +
	"If this is a problem please contact me.");
	}
	break;

case "guestorg":
	if(charLength == 60){
	alert("Please enter an organisation name with 60 characters or less. \n" +
	"If this is a problem please contact me.");
	}
	break;

}
}

function checkRadio(yesId, noId, mayId, starId){
//mayId not always required, check if one in activated group is checked are checked
var yesEle = document.getElementById(yesId);
var noEle = document.getElementById(noId);
//alert(mayId);

if(yesEle.checked == true)
{
	//alert("checked!");
	changeStarColor(starId, 'true')
}
if(noEle.checked == true)
{
	changeStarColor(starId, 'true')
}


if(mayId != "none")
{
	//add third for maybe option
	var mayEle = document.getElementById(mayId);
	if(mayEle.checked == true){changeStarColor(starId, 'true')}

}

}



function resetRegForm(){
//returns the registration form to its original appearance, colour and text
var titleEle = document.getElementById("guesttitle");
titleEle.style.color = "silver";
titleEle.selectedIndex = 0;

var firstEle = document.getElementById("firstname");
firstEle.style.color = "silver";
firstEle.value = "First Name";

var lastEle = document.getElementById("lastname");
lastEle.style.color = "silver";
lastEle.value = "Last Name";

var guestEle = document.getElementById("guestemail");
guestEle.style.color = "silver";
guestEle.value = "Enter e-mail address";

var phoneEle = document.getElementById("guestphone");
phoneEle.style.color = "silver";
phoneEle.value = "Enter phone number";

var orgEle = document.getElementById("guestorg");
orgEle.style.color = "silver";
orgEle.value = "Your organisation..";

//clear radio check boxes
document.getElementById("regyes").checked = false;
document.getElementById("regno").checked = false;
document.getElementById("upyes").checked = false;
document.getElementById("upno").checked = false;
document.getElementById("sgyes").checked = false;
document.getElementById("sgno").checked = false;
document.getElementById("sgmaybe").checked = false;

//return essential star colours to tomato
document.getElementById("firstnamestar").style.color = "tomato";
document.getElementById("lastnamestar").style.color = "tomato";
document.getElementById("guestemailstar").style.color = "tomato";
document.getElementById("regcheckstar").style.color = "tomato";
document.getElementById("upcheckstar").style.color = "tomato";
document.getElementById("sgcheckstar").style.color = "tomato";

//disable the register button
document.getElementById("register").disabled = true;


}


function hoverExpandIcon(id){
//changes colour of expansion icon
//document.getElementById(id).style.backgroundColor = "ivory";
document.getElementById(id).style.color = "darkslategray";
document.getElementById(id).style.fontSize = ".8em";

}


function offExpandIcon(id){
//changes colour of expansion icon
//document.getElementById(id).style.backgroundColor = "ivory";
document.getElementById(id).style.color = "grey";
document.getElementById(id).style.fontSize = ".6em";

}


function clickExpandIcon(id, paraId){
//Receives id of span button and pargraph related to topic
//Based on current status, toggles display or visibility of related paragraph, 
//and button display from plus to minus
var iconEle = document.getElementById(id);
var iconStatus = iconEle.firstChild.data;
var paraEle = document.getElementById(paraId);

//alert(iconStatus);
if(iconStatus == "view summary..")
{
	//Expand the paragraph and change sign to minus
	iconEle.firstChild.data = "close";
	paraEle.style.display = "block";

}
else if(iconStatus == "close")
{
	//Collapse the paragraph, change icon to plus again
	iconEle.firstChild.data = "view summary..";
	paraEle.style.display = "none";


}
}


