//declare the variable
var Input = {
  initialize: function()
  {
    if(document.getElementsByTagName("form"))
    {
      var divs = document.getElementsByTagName("div");

      //then set up the rollovers and onlick events
      for(var i = 0; i < divs.length; i++)
      {
        if(divs[i].className == "checkbox" || divs[i].className == "checkbox_wipe" )
        {
          divs[i].onmousedown = Input.checkbox_effect;
          divs[i].onmouseup = Input.checkbox_handle;
          divs[i].onmouseover = Input.checkbox_rollover;
          divs[i].onmouseout = Input.checkbox_rollout;

          //check if any of the checkboxes should be checked (i.e. we have pressed the back button)
          selector = divs[i].getElementsByTagName("input")[0];

          if (selector.checked == true)
          {
          	divs[i].className = divs[i].className + " selected";
    				divs[i].style.backgroundPosition = "4px -401px";
    				divs[i].style.backgroundColor = "#fdfda5";
			
			// now check to see if we have an other box
			if(document.getElementById(divs[i].getElementsByTagName("input")[0].name + "_other")) {
				document.getElementById("x_other").style.visibility = "visible";
			 	document.getElementById("x_other").style.position = "static";
			}
			
			
          }
        }

        else if (divs[i].className == "radio")
        {
          divs[i].onmousedown = Input.radio_effect;
          divs[i].onmouseup = Input.radio_handle;
          divs[i].onmouseover = Input.radio_rollover;
          divs[i].onmouseout = Input.radio_rollout;

          //check if any of the radios should be checked (i.e. we have pressed the back button)
          selector = divs[i].getElementsByTagName("input")[0];
          if (selector.checked == true)
          {
          	divs[i].className = divs[i].className + " selected";
    				divs[i].style.backgroundPosition = "0 -400px";
    				divs[i].style.backgroundColor = "#fdfda5";

						// now check to see if we have an other box
						if(document.getElementById(divs[i].getElementsByTagName("input")[0].name + "_other")) {
							document.getElementById("x_other").style.visibility = "visible";
						 	document.getElementById("x_other").style.position = "static";
						}

          }
        }

        else if (divs[i].className.match("radio_white_container") ||
        	       divs[i].className.match("radio_blue_container") || divs[i].className.match("radio_miss_container"))
        {
          divs[i].onmousedown = Input.radio_container_effect;
          divs[i].onmouseup = Input.radio_container_handle;
          divs[i].onmouseover = Input.radio_container_rollover;
          divs[i].onmouseout = Input.radio_container_rollout;

					//check if any of the radios should be checked (i.e. we have pressed the back button
          selector = divs[i].getElementsByTagName("div")[0].getElementsByTagName("input")[0];

					//if so then check them
					if (selector.checked == true)
					{
						divs[i].className = divs[i].className + " selected";
    				divs[i].style.backgroundPosition = "25% -400px";
    				divs[i].style.backgroundColor = "#fdfda5";

						//add the no_text option
    				if (divs[i].className.match("no_text"))
    					{divs[i].style.backgroundPosition = "50% -400px";}

							// now check to see if we have an other box
							if(document.getElementById(divs[i].getElementsByTagName("input")[0].name + "_other")) {
								document.getElementById("x_other").style.visibility = "visible";
							 	document.getElementById("x_other").style.position = "static";
							}

					}

        }

        else if (divs[i].className.match("w_blank"))
        	{
        		  divs[i].style.backgroundColor = "#F2F6FF";
           		divs[i].style.color = "#F2F6FF";
           		divs[i].style.backgroundPosition = "25% -134px";
        	}

        else if (divs[i].className.match("b_blank"))
        	{
        		  divs[i].style.backgroundColor = "#D8E1F2";
           		divs[i].style.color = "#D8E1F2";
           		divs[i].style.backgroundPosition = "25% -134px";
        	}


      }
    }
  },

	//CheckBox Function
	//Rollover
  checkbox_rollover: function()
  {

		if (this.className == "checkbox")
		    {this.style.backgroundColor = "#CCCCCC";}

		else if (this.className == "checkbox selected")
				{this.style.backgroundColor = "#B5B85E";}

		else if (this.className == "checkbox_wipe")
				{
					if (this.style.backgroundColor == "#FFFFFF")
						{this.style.backgroundColor = "#CCCCCC";}
					else
						{this.style.backgroundColor = "#CCCCCC";}
				}
  },

	//Rollout
  checkbox_rollout: function()
  {
		if (this.className == "checkbox selected")
			{this.style.backgroundColor = "#fdfda5";}
		else
			{this.style.backgroundColor = "";}
  },

	//onMouseDown
	checkbox_effect: function()
	{
		this.style.backgroundPosition = "4px -201px";
	},

	//onMouseUp (i.e. Click)
	checkbox_handle: function ()
	{
		selector = this.getElementsByTagName("input")[0];

		//standard checkbox click (i.e. turn the click on)
		if (this.className == "checkbox")
		{
			selector.checked = true;
			this.className = "checkbox selected"
			this.style.backgroundPosition = "4px -402px";
			this.style.backgroundColor = "#fdfda5";
		}

		//checkbox already clicked (i.e. turn the click off)
		else if (this.className == "checkbox selected")
		{
			selector.checked = false;
			this.className = "checkbox";
			this.style.backgroundPosition = "";
			this.style.backgroundColor = "";
		}

		//checkbox_wipe
		else if (this.className == "checkbox_wipe")
		{
			if (selector.checked == false)
				{	//first highlight the current checkbox_wipe
					selector.checked = true;
					this.style.backgroundPosition = "4px -402px";
					this.style.backgroundColor = "#fdfda5";

					//we need to disable all the above checkboxes
					inputs = document.getElementsByTagName("div");
					for(i = 0; i < inputs.length; i++)
					{
						if (inputs[i].className == "checkbox" || inputs[i].className == "checkbox selected" )
							{inputs[i].className = "checkbox_disabled";
							 inputs[i].getElementsByTagName("input")[0].checked = false;
							 inputs[i].style.backgroundColor = "";}
					}

				}
			else
				{
					//first reset the checkbox wipe
					selector.checked = false;
					this.style.backgroundPosition = "";
					this.style.backgroundColor = "";

					//we need to enable all the above checkboxes
					inputs = document.getElementsByTagName("div");
					for(i = 0; i < inputs.length; i++)
					{
						if (inputs[i].className == "checkbox_disabled")
							{inputs[i].className = "checkbox";
							 inputs[i].style.backgroundColor = "";
							 inputs[i].style.backgroundPosition = "4px 0"}
					}
				}
		}
	},

	//radio buttons
	//rollover function
  radio_rollover: function()
  {
		if (this.className == "radio")
		    {this.style.backgroundColor = "#CCCCCC";}

		else if (this.className == "radio selected")
				{this.style.backgroundColor = "#B5B85E";}
  },

	//Rollout
	radio_rollout: function()
	{
		if (this.className == "radio")
		    {this.style.backgroundColor = "";}

		else if (this.className == "radio selected")
				{this.style.backgroundColor = "#fdfda5";}
	},

	//mousedown event
	radio_effect: function()
	{
		this.style.backgroundPosition = "0 -201px";
	},

	//mouseup event (i.e. click)
	radio_handle: function()
	{
		//highlight the selected radio
		selector = this.getElementsByTagName("input")[0];
		selector.checked = true;
		this.className = "radio selected";
		this.style.backgroundPosition = "0 -401px";
		this.style.backgroundColor = "#fdfda5";

		//deselect / de-highlight all the others
		 inputs = document.getElementsByTagName("input");
      for(i = 0; i < inputs.length; i++)
      {
        if(inputs[i].getAttribute("name") == selector.getAttribute("name"))
        {
          if(inputs[i] != selector)
          {
            inputs[i].parentNode.className = "radio";
            inputs[i].parentNode.style.backgroundPosition = "0 0";
            inputs[i].parentNode.style.backgroundColor = "";
          }
				}
			}
	},

	//and now the radio container functions - used on type M questions
	//rollover
	radio_container_rollover: function()
	{
		var textcolour = "#CCCCCC";

		//standard rollovers
		if (this.className.match("radio_white_container") ||
		    this.className.match("radio_blue_container"))
					{this.style.backgroundColor = "#CCCCCC";}

		else if (this.className.match("radio_white_container selected") ||
			       this.className.match("radio_blue_container selected"))
							{this.style.backgroundColor = "#B5B85E";}

		else if (this.className.match("radio_miss_container"))
							{	textcolour = "#9F0000";
								this.style.backgroundColor = "#9F0000";}

		var thisName = "q_" + this.getAttribute("name");
		if (document.getElementById(thisName))
			{document.getElementById(thisName).style.backgroundColor = textcolour;}
	},

	//rollout
	radio_container_rollout: function()
	{
		var acounter = 0;
		if (this.className.match("radio_white")) {acounter++;}
		if (this.className.match("radio_blue")) {acounter++;}
		if (this.className.match("selected")) {acounter++;}
		if (this.className.match("no_text")) {acounter++;}

		if (this.className.match("radio_white_container selected") ||
			  this.className.match("radio_blue_container selected"))
					{this.style.backgroundColor = "#fdfda5"}

		else if (acounter == 3)
			       	{this.style.backgroundColor = "#fdfda5";}

		else {this.style.backgroundColor = "";}


		var thisName = "q_" + this.getAttribute("name");
		if (document.getElementById(thisName))
			{document.getElementById(thisName).style.backgroundColor = "";}
	},

	//mousedown
	radio_container_effect: function()
	{
		//if blank (i.e. blanked out choice question) then return
		if (this.className.match("blank")) {return;}

		//otherwise change the background position
		if (this.className.match("no_text"))
			{this.style.backgroundPosition = "50% -201px";}
		else
			{this.style.backgroundPosition = "25% -201px";}


	},

	//mouseup (i.e. click)
	radio_container_handle: function()
	{
		//if blank (i.e. blanked out choice question) then return
		if (this.className.match("blank")) {return;}

		selector = this.getElementsByTagName("input")[0];
		var thisRadio = this.className;
		var thisName = "q_" + this.getAttribute("name");

		//bodge in case it is double clicked
		if (thisRadio == "radio_blue_container selected") {thisRadio = "radio_blue_container";}
    if (thisRadio == "radio_white_container selected") {thisRadio = "radio_white_container";}

    if (thisRadio == "radio_blue_container m_missing")
    	{
    		thisRadio = "radio_blue_container";
	    	if (document.getElementById(thisName))
	    		{
	    			document.getElementById(thisName).className = "g_blue_question";
  	  		  document.getElementById(thisName).style.backgroundColor = "#CCCCCC";
  	  		}
  	  	}

    if (thisRadio == "radio_white_container m_missing")
    	{
    		thisRadio = "radio_white_container";
	    	if (document.getElementById(thisName))
    	  	{
    	  		document.getElementById(thisName).className = "g_white_question";
    	  		document.getElementById(thisName).style.backgroundColor = "#CCCCCC";
    	  	}
    	  }

		//change style of the one we click
    this.className = thisRadio + " selected";
		this.style.backgroundPosition = "25% -401px";
    this.style.backgroundColor = "#fdfda5";

    if (this.className.match("no_text")) {this.style.backgroundPosition = "50% -401px";}

		//grey out the text on the left
		if (document.getElementById(thisName))
			{document.getElementById(thisName).style.color = "#6F6F6F";}

		//deselect all the others in the row
    inputs = document.getElementsByTagName("input");

    for(i = 0; i < inputs.length; i++)
    {
    	if(inputs[i].getAttribute("name") == selector.getAttribute("name"))
    	{
          if(inputs[i] != selector)
          {
            inputs[i].parentNode.parentNode.className = thisRadio;
            inputs[i].parentNode.parentNode.style.backgroundPosition = "25% top";
            inputs[i].parentNode.parentNode.style.backgroundColor = "";

            if (inputs[i].parentNode.parentNode.className.match("no_text"))
            	{inputs[i].parentNode.parentNode.style.backgroundPosition = "50% top";}
          }
       }
     }

     //now for choice questions, need to blank the entire row and column
    if (this.className.match("choice"))
    {

    //work across the row - easy
    for(i = 0; i < inputs.length; i++)
    	{
    		if(inputs[i].getAttribute("name") == selector.getAttribute("name"))
    		{
          	if (selector != inputs[i])
          	{
          		//display the blank part of the image
            	inputs[i].parentNode.parentNode.style.backgroundPosition = "25% -134px";

							//and change the class name
            	if (inputs[i].parentNode.parentNode.className == "radio_white_container choice")
            		{inputs[i].parentNode.parentNode.className = "w_blank";
            		 inputs[i].parentNode.parentNode.style.color = "#F2F6FF";	}
            	else
            		{inputs[i].parentNode.parentNode.className = "b_blank";
            		 inputs[i].parentNode.parentNode.style.color = "#D8E1F2";		}
            }

       	}
     	}

     	//work down the column - tricky
     	inputs = document.getElementsByTagName("radio");
     	var totalchoices = document.frmCheckMe.elements["ycount"].value;
     	var totalrows = (inputs.length + 1) / totalchoices;

			//create a totalchoices into
			var int_choices = parseInt(totalchoices);

			//declare a new array which will hold all the radio buttons
     	var Array_greyOut = new Array();

			//get all the form elements into array num
			var num = document.getElementsByTagName("input");
			total = 0;

			//loop through and add to my radio button Array as required
			for(i = 0; i < num.length; i++)
			{
				if (num[i].type == "radio")
					{
						Array_greyOut[total] = num[i];
						total = total + 1;
					}
			}

			//need to work out in which column I am (i.e. starting column)
			//loop through and get number
			var itemNumber = -1;

			for (i=0; i < Array_greyOut.length; i = i + 1)
			{
				if (selector == Array_greyOut[i]) {itemNumber = i;}
			}

			//and finally loop downwards
     	for (i=(itemNumber % totalchoices); i < Array_greyOut.length; i = i + int_choices)
     	{
     		if (i != itemNumber)
     		{
					//and change the class name
        	if (Array_greyOut[i].parentNode.parentNode.className == "radio_white_container choice" ||
            	Array_greyOut[i].parentNode.parentNode.className == "radio_white_container choice selected" ||
            	Array_greyOut[i].parentNode.parentNode.className == "w_blank")
        		{
        			Array_greyOut[i].parentNode.parentNode.className = "w_blank";
           		Array_greyOut[i].parentNode.parentNode.style.backgroundColor = "#F2F6FF";
           		Array_greyOut[i].parentNode.parentNode.style.color = "#F2F6FF";
           		Array_greyOut[i].parentNode.parentNode.style.backgroundPosition = "25% -134px";
          	}
        	else
        		{
        			Array_greyOut[i].parentNode.parentNode.className = "b_blank";
           		Array_greyOut[i].parentNode.parentNode.style.backgroundColor = "#D8E1F2";
           		Array_greyOut[i].parentNode.parentNode.style.color = "#D8E1F2";
							Array_greyOut[i].parentNode.parentNode.style.backgroundPosition = "25% -134px";
						}
				}
     	}

     	//now reset the actual button clicked
     	selector.parentNode.parentNode.style.backgroundPosition = "25% -401px";
     	selector.parentNode.parentNode.style.color = "black";

			selector.parentNode.parentNode.backgroundColor = "#fdfda5";
    }

	}

}

//initialise all the divs
window.onload = Input.initialize; setTimeout("loadCode()",1000);