var currentSection;

var sections = new Array();

function Section(sectionName, id)
{
	this.sectionName = sectionName;
	this.id = id;
}

sections.push(new Section("Background", ""));
sections.push(new Section("Navigation", "nav"));
sections.push(new Section("Stage 1", "left_stage"));
sections.push(new Section("Stage 2", "right_stage"));
sections.push(new Section("Title Bar", "title"));
sections.push(new Section("Button Foreground", ""));
sections.push(new Section("Button Background", ""));
sections.push(new Section("Text 1", ""));
sections.push(new Section("Text 2", ""));
sections.push(new Section("Text 3", ""));

function setEdit(sectionName)
{
	for (var i = 0; i < sections.length ; i++)
	{
		var section = sections[i];
		if (sectionName == section.sectionName)
		{
			currentSection = section;
			var editDisplay = document.getElementById("currentEdit");
			editDisplay.innerHTML = "<h6>Currently editing: " + currentSection.sectionName + "</h6>";
			return;
		}
	}
}

function getControls()
{
	var html = "";

	for (var i = 0; i < sections.length ; i++ )
	{
		var section = sections[i];
		html += "<a href=\"javascript:setEdit('" + section.sectionName + "');\">" + section.sectionName + "</a><br>";
	}

	return html;
}

function changeColor(colorName)
{
	if (!currentSection)
		return;

	

	var hex = getColorHex(colorName);


	if (currentSection.id == "")
	{
		
		if (currentSection.sectionName == "Background")
		{
			document.body.style.background = hex;
		}
		else if (currentSection.sectionName == "Button Foreground")
		{
			var elements = document.getElementsByName("nav_button");
			for (var i = 0; i < elements.length; i++)
			{
				elements[i].style.color = hex;
			}
			
		}
		else if (currentSection.sectionName == "Button Background")
		{
			var elements = document.getElementsByName("nav_button");
			for (var i = 0; i < elements.length; i++)
			{
				elements[i].style.background = hex;
			}
			
		}
		else if (currentSection.sectionName == "Text 1")
		{
			var elements = document.getElementsByTagName("h1");
			for (var i = 0; i < elements.length ; i++)
			{
				elements[i].style.color = hex;
			}
			
		}
		else if (currentSection.sectionName == "Text 2")
		{
			var elements = document.getElementsByTagName("h2");
			for (var i = 0; i < elements.length ; i++)
			{
				elements[i].style.color = hex;
			}
			
		}
		else if (currentSection.sectionName == "Text 3")
		{
			var elements = document.getElementsByTagName("h3");
			for (var i = 0; i < elements.length ; i++)
			{
				elements[i].style.color = hex;
			}
			
		}
	}
	else
	{
		var element = document.getElementById(currentSection.id);
		element.style.background = hex;
	}
}