var selectedGarment = -1;
var selectedColor = -1;
var previousGarmentSrc = "";

var colorHover = "gray";
var colorSelected = "black black black black";
var colorNeutral = "transparent";

function selectColor(id, str)
{
	var obj = document.getElementById('color' + id);
	
	// Unselect previous color
	if( selectedColor > -1 )
	{
		var obj2 = document.getElementById('color' + selectedColor);
		//obj2.style.borderColor = colorNeutral;
		obj2.style.display = "none";
	}
	
	// Select this garment
	document.getElementById("textselectedcolor").value = str;
	//obj.style.borderColor = colorSelected;
	obj.style.display = "inline";
	selectedColor = id;
}

function hoverC(id)
{
	var obj = document.getElementById('color' + id);

	obj.style.borderColor = colorHover;
}

function leaveC(id)
{
	var obj = document.getElementById('color' + id);

	if( id == selectedColor )
	{
		//obj.style.borderColor = colorSelected;
		obj.style.display = "inline";
	}
	else
	{
		//obj.style.borderColor = colorNeutral;
		obj.style.display = "none";
	}			
}



function selectGarment(id, str)
{
	var obj = document.getElementById('garment' + id);
	
	if( id == selectedGarment ) return;
	
	// Unselect previous garment
	if( selectedGarment > -1 )
	{
		var obj2 = document.getElementById('garment' + selectedGarment);
		//obj2.style.borderColor = colorNeutral;
		obj2.src = previousGarmentSrc;
	}
	
	// Preserve previous source image
	previousGarmentSrc = "images/garments/thumbnail1_" + str;

	// Select this garment
	//obj.style.borderColor = colorSelected;
	//obj.src = "images/garments/thumbnail2_" + str;
	selectedGarment = id;
	selectedColor = -1;
	
	// Start the page download
	startGet("xhr_garmentcolors.php?id=" + id);
}

function hoverG(id, str)
{
	var obj = document.getElementById('garment' + id);

	//obj.style.borderColor = colorHover;
	obj.src = "images/garments/thumbnail2_" + str;
}

function leaveG(id, str)
{
	var obj = document.getElementById('garment' + id);

	/*
	if( id == selectedGarment )
	{
		obj.style.borderColor = colorSelected;
	}
	else
	{
		obj.style.borderColor = colorNeutral;
	}
	*/
	if( id != selectedGarment )
	{
		obj.src = "images/garments/thumbnail1_" + str;
	}			
}

function frontChoice(num)
{
	switch( num )
	{
	case 0:
		document.getElementById("frontpos0").src = "images/order/step3_fullfront_selected.jpg";
		document.getElementById("frontpos1").src = "images/order/step3_frontleft.jpg";		
		document.garmentinfo.frontpos.value = 0;
	break;
	
	case 1:
		document.getElementById("frontpos0").src = "images/order/step3_fullfront.jpg";
		document.getElementById("frontpos1").src = "images/order/step3_frontleft_selected.jpg";		
		document.garmentinfo.frontpos.value = 1;
	break;
	}
}

function backChoice(num)
{
	if( document.garmentinfo.backpos.value == num )
	{
		// The clicked position is already the current; deselect it
		document.getElementById("backpos1").src = "images/order/step3_fullback.jpg";
		document.getElementById("backpos2").src = "images/order/step3_backtag.jpg";		
		document.garmentinfo.backpos.value = 0;
	}
	else
	{
		// Select the clicked item
		switch( num )
		{
		case 1:
			document.getElementById("backpos1").src = "images/order/step3_fullback_selected.jpg";
			document.getElementById("backpos2").src = "images/order/step3_backtag.jpg";		
			document.garmentinfo.backpos.value = 1;
		break;
		
		case 2:
			document.getElementById("backpos1").src = "images/order/step3_fullback.jpg";
			document.getElementById("backpos2").src = "images/order/step3_backtag_selected.jpg";		
			document.garmentinfo.backpos.value = 2;
		break;
		}
	}
}

function startGet(url)
{
	// Start data request
	startRequest(url, endGet, 'text');
	
	// Show throbber
	document.getElementById('garmentcolors').innerHTML = "Loading...";
}

function endGet(str)
{
	// Process received data
	//alert(str);
	document.getElementById('garmentcolors').innerHTML = str;
}


function stage2()
{
	if( selectedGarment < 0 )
	{
		alert("Please choose a garment type.");
		return;
	}
	
	if( selectedColor < 0 )
	{
		alert("Please choose a garment color.");
		return;
	}
	
	location = "order.php?stage=2&garmentType=" + selectedGarment + "&garmentColor=" + selectedColor;
}

function stage3()
{
	if( document.garmentinfo.frontpos.value == -1 )
	{
		alert("Please choose front placement by clicking on Full Front or Front Left.");
		return;
	}
	
	if( document.garmentinfo.group.value.length <= 0 )
	{
		alert("Please enter a Group Name.");
		return;
	}

	if( document.garmentinfo.event.value.length <= 0 )
	{
		alert("Please enter an Event Name.");
		return;
	}
	
	if( document.garmentinfo.eventloc.value.length <= 0 )
	{
		alert("Please enter an Event Location.");
		return;
	}	
	
	document.garmentinfo.submit();
}