window.onload = init;

function init()
{
	// Ensure that we're working with a relatively capable user agent
	if (!document.getElementById || !document.createTextNode)
	{
		return;
	}

	var objSubmit = document.getElementById('submitAsCT');
	var objOptioncontainer = document.getElementById('AsCToptions');
	var objContent = document.createElement('p');
	var objLabel = document.createElement('label');
	var objInput = document.createElement('input');
	var objCookies = document.getElementById('savesettings');
	var iCounter;

	// Technology checkboxes
	var objCSS = document.getElementById('cssopt');
	var objMedia = document.getElementById('mediaopt');
	var objSMIL = document.getElementById('smilopt');
	var objScript = document.getElementById('scriptopt');

	// Intro, Sufficient and Advisory Techniques
	var objAdvisory = document.getElementById('advopt');
	var objSufficient = document.getElementById('sufopt');
	var objIntroduction = document.getElementById('introopt');
	
	// Level checkboxes
	var objLevel1 = document.getElementById('level1opt');
	var objLevel2 = document.getElementById('level2opt');
	var objLevel3 = document.getElementById('level3opt');

	// Ensure we have everything we need to set up the quick reference
	if (!objSubmit || !objContent || !objCookies || !objCSS || !objMedia || !objSMIL || !objScript || !objIntroduction || !objAdvisory || !objSufficient || !objLevel1 || !objLevel2 || !objLevel3)
	{
		return;
	}

	// Add handlers to toggle on/off content with the appropriate class names
	objCSS.onclick = function(){return toggleContent(this, 'basecssbase', 'optcss', 'inline', 'CSS techniques and failures now hidden');};
	objMedia.onclick = function(){return toggleContent(this, 'basemedia', 'optmedia', 'inline', 'Multimedia techniques and failures now hidden');};
	objSMIL.onclick = function(){return toggleContent(this, 'basesmilbase', 'optsmil', 'inline', 'SMIL techniques and failures now hidden');};
	objScript.onclick = function(){return toggleContent(this, 'basescriptbase', 'optscript', 'inline', 'Scripting techniques and failures are now hidden');};
	objIntroduction.onclick = function(){return toggleContent(this, 'introduction', 'optintroduction', 'inline', 'Introduction section now hidden');
	updateStatus('introduction', 'Hidden');};
	objAdvisory.onclick = function(){return toggleContent(this, 'advisory', 'optadvisory', 'inline', 'Advisory techniques are now hidden');};
	objSufficient.onclick = function(){return toggleContent(this, 'sufficient', 'optsufficient', 'inline', 'Sufficient techniques and failures are now hidden');};
	objLevel1.onclick = function(){return toggleContent(this, 'level1', 'optlevel1', 'inline', 'Level 1 Success Criteria and techniques now hidden');};
	objLevel2.onclick = function(){return toggleContent(this, 'level2', 'optlevel2', 'inline', 'Level 2 Success Criteria and techniques now hidden');};
	objLevel3.onclick = function(){return toggleContent(this, 'level3', 'optlevel3', 'inline', 'Level 3 Success Criteria and techniques now hidden');};

	// Add content about a script-enabled browser
	objContent.appendChild(document.createTextNode('You have scripting enabled in your browser, so the Quick Reference will automatically change as you select and unselect the checkboxes.'));
	objContent.setAttribute('id', 'jsactive');
	objContent.className = 'subheader';
	objOptioncontainer.parentNode.insertBefore(objContent, objOptioncontainer);
	
		// Add spacer paragraph to compensate for hiding button when anchors are loaded
	objContent = document.createElement('p');
	objContent.className = 'spacer';
	objContent.appendChild(document.createTextNode(''));
	objSubmit.parentNode.insertBefore(objContent, objSubmit);

	// Create the element to toggle on/off the options block
//	objContent = document.createElement('p');
//	objInput.setAttribute('type', 'checkbox');
//	objInput.setAttribute('id', 'toggleoptions');
//	objInput.setAttribute('name', 'toggleoptions');
//	objInput.onclick = function(){return toggleContent(this, null, 'introduction', 'block', null);};
//	objContent.appendChild(objInput);
//	objContent.appendChild(document.createTextNode('Hidden'));
//	objLabel.appendChild(document.createTextNode('Hide introduction?'));
//	objLabel.setAttribute('for', 'toggleoptions');
//	objContent.appendChild(objLabel);

//	objAuto.parentNode.insertBefore(objContent, objAuto);

	// Hide the submit button, as content is updated automatically when scripting is enabled
	objSubmit.style.display = 'none';
	
	objCookies.onclick = function(){return toggleCookies(this);};

	// Hide advisory techniques to start
	//var objCollection = getElementsByClassName(document, '*', 'advisory');

//	for (iCounter=0; iCounter<objCollection.length; iCounter++)
//	{
//		objCollection[iCounter].style.display = 'none';
//	}

//	objCollection = null;

//	return;
}

function toggleContent(objElement, strClass, strOption, strProperty, strMessage)
{
	var objCollection = getElementsByClassName(document, '*', strClass);
	var objNode, iCounter;

	// Iterate through the classes, and toggle on/off, depending on choice
	if (strClass)
	{
		for (iCounter=0; iCounter<objCollection.length; iCounter++)
		{
			if (objElement.checked)
			{
				// If the element is a span, change it to inline; otherwise, block
				if (objCollection[iCounter].nodeName.toLowerCase() == 'span')
				{
					objCollection[iCounter].style.display = 'inline';
				}
				else
				{
					objCollection[iCounter].style.display = 'block';
				}
			}
			else
			{
				objCollection[iCounter].style.display = 'none';
			}
		}
	}

	// Update the indicators for which technologies and levels are included
	if (strOption)
	{
		objNode = document.getElementById(strOption);
		if (objNode)
		{
			if (objElement.checked && strProperty == 'inline')
			{
				objNode.style.display = 'inline';
			}
			else if (!objElement.checked && strProperty == 'block')
			{
				objNode.style.display = 'block';
			}
			else
			{
				objNode.style.display = 'none';
			}
		}
	}

	if (strMessage)
	{
		updateStatus(objElement, strMessage);
	}

	// Save cookie value if required
	if (document.getElementById('savesettings').checked)
	{
		if (objElement.checked)
		{
			setCookie(objElement.id, 'Y');
		}
		else
		{
			setCookie(objElement.id, 'N');
		}
	}

	objCollection = null;
}

function updateStatus(objElement, strMessage)
{
	var strID = objElement.id;
	var objLabel = document.getElementsByTagName('label');
	var strIDRef, strSpanID, objSpan, iCounter;

	for (iCounter=0; iCounter<objLabel.length; iCounter++)
	{
		strIDRef = objLabel[iCounter].getAttribute('for');
		// And then there's IE to consider!
		if (strIDRef === null)
		{
			strIDRef = objLabel[iCounter].getAttribute('htmlfor');
		}

		if (strIDRef == strID)
		{
			strSpanID = strID + 'span';
			objSpan = document.getElementById(strSpanID);

			if (!objElement.checked && !objSpan)
			{
				objSpan = document.createElement('span');
				objSpan.className = 'showhideR';
				objSpan.setAttribute('id', strSpanID);
				objSpan.appendChild(document.createTextNode(strMessage));
				objLabel[iCounter].parentNode.appendChild(objSpan);
			}
			else if (objSpan)
			{
				objSpan.parentNode.removeChild(objSpan);
			}

			break;
		}
	}
}


function getElementsByClassName(objElement, strTagName, strClassName)
{
	var objCollection = objElement.getElementsByTagName(strTagName);
	var arReturn = [];
	var strClass, arClass, iClass, iCounter;

	for(iCounter=0; iCounter<objCollection.length; iCounter++)
	{
		strClass = objCollection[iCounter].className;
		if (strClass)
		{
			arClass = strClass.split(' ');
			for (iClass=0; iClass<arClass.length; iClass++)
			{
				if (arClass[iClass] == strClassName)
				{
					arReturn.push(objCollection[iCounter]);
					break;
				}
			}
		}
	}

	objCollection = null;
	return (arReturn);
}


function toggleCookies(objElement, objEvent)
{
	var objCheck, iCounter;

	if (objElement.checked)
	{
		setCookie('allowcookies', 'Y');
		// Store the current state of the checkboxes
		objCheck = document.getElementsByTagName('input');
		for (iCounter=0; iCounter<objCheck.length; iCounter++)
		{
			if (objCheck[iCounter].type.toLowerCase() == 'checkbox' && objCheck[iCounter].checked)
			{
				setCookie(objCheck[iCounter].id, 'Y');
			}
			else
			{
				setCookie(objCheck[iCounter].id, 'N');
			}
		}
	}
	else
	{
		setCookie('allowcookies', 'N');
	}

	return true;
}

function setCookie(strName, strValue)
{
	var objDate = new Date();

	objDate.setTime(objDate.getTime()+(365*24*60*60*1000));

	var strExpires = '; expires=' + objDate.toGMTString();

	document.cookie = strName + '=' + strValue + strExpires + '; path=/';
}