var viewingColors = false;
var helpingColors;
var viewingColors;
var dropped;
function colorClick()
{
	if(viewingColors == false)
	{
		if(helpingColors == true)
		{
			giveColorHelp();
		}
		viewingColors = true;
		// activate lower-left box
		var element = document.getElementById('ProductImageColorBox');
		
		fadeElementIn('ProductImageColorBox','ProductImageColorBoxDisplay');;
				
		// grab location of cursor in relation to image
	}
	else
	{
		viewingColors = false;
		if(helpingColors == true)
		{
			giveColorHelp();
		}
		fadeElement('ProductImageColorBox','ProductImageColorBox');
	}
}

function giveColorHelp()
{
	if(helpingColors != true)
	{
		helpingColors = true;
		var element = document.getElementById('ProductImageColorHelpBox');
		fadeElementIn('ProductImageColorHelpBox','HelpBoxDisplay');
	}
	else
	{
		helpingColors = false;
		fadeElement('ProductImageColorHelpBox','HelpBox');
	}
}




function dropdown_open()
{
	if(dropped == false)
	{
		var element = document.getElementById('ColorDropdown');
		element.className = 'unhidden';
		dropped = true;
	}
	else
	{
		var element = document.getElementById('ColorDropdown');
		element.className = 'hidden';
		dropped = false;
	}
}
function ChangeMix(title,id)
{
	dropdown_open();
	var element = document.getElementById('ActiveColorMix');
	element.innerHTML = title;
	clientSideInclude('colorbox','content/colormix.ajax.php?colorMix=' + id);
}

function fillColorOptions(itemArray)
{
	var i;
	var chtml = "";
	for(i=0;i<itemArray.length;i=i+1)
	{
		chtml = chtml + "<div class=\"ItemSelect\" onClick=\"ChangeMix('" + itemArray[i][0] + "'," + itemArray[i][1] + ");\">" + itemArray[i][0] + "</div>";
	}
	var element = document.getElementById('ColorDropdown');
	element.innerHTML = chtml;
	ChangeMix(itemArray[0][0],itemArray[0][1]);
}


function clientSideInclude(id, url) {
  var req = false;
  // For Safari, Firefox, and other non-MS browsers
  if (window.XMLHttpRequest) {
    try {
      req = new XMLHttpRequest();
    } catch (e) {
      req = false;
    }
  } else if (window.ActiveXObject) {
    // For Internet Explorer on Windows
    try {
      req = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        req = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e) {
        req = false;
      }
    }
  }
 var csiElement = document.getElementById(id);
 if (!csiElement) {
  alert("Bad id " + id +
   "passed to clientSideInclude." +
   "You need a div or span element " +
   "with this id in your page.");
  return;
 }
  if (req) {
    // Synchronous request, wait till we have it all
    req.open('GET', url, false);
    req.send(null);
    csiElement.innerHTML = req.responseText;
  } else {
    csiElement.innerHTML =
   "Sorry, your browser does not support " +
      "XMLHTTPRequest objects. This page requires " +
      "Internet Explorer 5 or better for Windows, " +
      "or Firefox for any system, or Safari. Other " +
      "compatible browsers may also exist.";
  }
}