function ajax_logochange_save( row, ab, updating )
{
    var xmlHttp;

    try
    {
	xmlHttp = new XMLHttpRequest();
    }
    catch(e)
    {
	try
	{
		xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
	}
	catch(e)
	{
		try
		{
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
		catch(e)
		{
			alert("Your browser does not support AJAX!");
			return false;
		}
	}
    }

    //Bind what to do when the request completes
    xmlHttp.onreadystatechange = function()
    {
	if(xmlHttp.readyState == 4)
	{
	    //redraw the basket
	    document.getElementById("BasketDiv").innerHTML = xmlHttp.responseText;

	    //Redraw the selects
	    redrawSelects( true );
	}
    }

    other = 'B';
    if(ab == 'B'){other = 'A';}

    if(updating == "logo")
    {
	logo = document.getElementsByName( "logo"+ab+row )[0];
	logo = logo.value;
	var url = "ajax_update_logo.asp?area=checkout&stage=logo&u=logo"+ ab +"&r=" + row + "&ab=" + ab + "&logo"+ ab +"=" + logo;
    }
    else if(updating == "logoPos")
    {
	logopos = document.getElementsByName( "logo"+ ab +"pos"+row )[0];
	logopos = logopos.value;
	// Carefull! The radio indexes start at 0, so embroidered = 0, transfer = 1.
	    // However, this should be embroidered = 1, transfer = 2... So, +1.
	var logoType = getSelectedRadio(document.getElementsByName("Logo" + ab + "Type" + row)) + 1;

	logoposother = document.getElementsByName( "logo"+other+"pos"+row )[0];
	logoposother = logoposother.value;

	if(logoposother == "K" && logoType == 2)
	{
	    logopos = "L";
	    document.getElementsByName( "logo"+ ab +"pos"+row )[0].selectedIndex=5;
	}

	var url = "ajax_update_logo.asp?area=checkout&stage=logo&u=pos"+ ab +"&r=" + row + "&ab=" + ab + "&logo"+ ab +"pos="+ logopos + "&logo"+ ab +"Type=" + logoType;
    }
    else if(updating == "logoType")
    {
	// Carefull! The radio indexes start at 0, so embroidered = 0, transfer = 1.
	// However, this should be embroidered = 1, transfer = 2... So, +1.
	var logoType = getSelectedRadio(document.getElementsByName("Logo" + ab + "Type" + row)) + 1;
	logopos = document.getElementsByName( "logo"+ ab +"pos"+row )[0];
	logopos = logopos.value;

	logoposother = document.getElementsByName( "logo"+other+"pos"+row )[0];
	logoposother = logoposother.value;

	if(logoposother == "K")
	{
	    logopos = "L";
	    document.getElementsByName( "logo"+ ab +"pos"+row )[0].selectedIndex=5;
	}

	var url = "ajax_update_logo.asp?area=checkout&stage=logo&u=logotype"+ ab +"&r=" + row + "&ab=" + ab + "&logo"+ ab +"type=" + logoType + "&logo"+ ab +"pos="+ logopos;
    }

    //alert(url);

    xmlHttp.open("GET",url,true);
    xmlHttp.send(null);

} //end function

$(document).ready(function(){
    redrawSelects( false );
});

function redrawSelects( fromajax )
{
     $("select.logoselect").each(function(index, data){
	row = ( $(this).attr('name').charAt($(this).attr('name').length-1) );
	ab='A';	other='B';
	
	thislogo = $("[name='logoA"+row+"']").val();
	otherlogo = $("[name='logoB"+row+"']").val();

	//Store both logo positions
	thisposselect = $("[name='logo"+ab+"pos"+row+"']");
	otherposselect = $("[name='logo"+other+"pos"+row+"']");
	thispos = thisposselect.val();
	otherpos = otherposselect.val();

	//If both logos are selected, redraw the selects, without the position selected by the other
	if( (thislogo!=0) && (otherlogo!=0) )
	{
	    //The positions have overlapped, sort it out.
	    if(thispos==otherpos)
	    {
		selectlength = thisposselect.children().length;
		//The .index selector isn't behaving and I want this done, so it's using a .each hack
		thisposselect.children().each(function(index, data){
		    if( $(this).val()==thispos )
		    {
			if(index == (selectlength-1))
			{
			    otherposselect.val( otherposselect.children().eq(index-1) );
			    otherpos = otherposselect.val();
			}
			else
			{
			    otherposselect.val( otherposselect.children().eq(index+1).val() );
			    otherpos = otherposselect.val();
			}
		    }
		});
		if(!fromajax)
		{
		    ajax_logochange_save( row, ab, "logoPos" );
		}
	    }

	    //Figure out what's a valid value for each of the selects
	    thisvalids = new Array();
	    othervalids = new Array();

	    $.each(["A","C","F","I","K","L","M","N","O","R"], function(index,value){
		if(value != thisposselect.val()){othervalids.push(value)}
		if(value != otherposselect.val()){thisvalids.push(value)}
	    });

	    thisposselect.empty();
	    $.each(thisvalids, function(index, data){
		thisposselect.append('<option value="'+data+'">'+data+'</option>');
		if(data==thispos){thisposselect.val(data);}
	    });
	    
	    otherposselect.empty();
	    $.each(othervalids, function(index, data){
		otherposselect.append('<option value="'+data+'">'+data+'</option>');
		if(data==otherpos){otherposselect.val(data);}
	    });

	}
	else //Else, redraw the selects with all positions
	{
	    thisposselect.empty();
	    otherposselect.empty();

	    $.each(["A","C","F","I","K","L","M","N","O","R"], function(index,data){
		thisposselect.append('<option value="'+data+'">'+data+'</option>');
		if(data==thispos){thisposselect.val(data);}

		otherposselect.append('<option value="'+data+'">'+data+'</option>');
		if(data==otherpos){otherposselect.val(data);}
	    });

	}
    });
}

function getSelectedRadio(buttonGroup) {
    // returns the array number of the selected radio button or -1 if no button is selected
    if (buttonGroup[0]) { // if the button group is an array (one button is not an array)
	for (var i=0; i<buttonGroup.length; i++) {
	    if (buttonGroup[i].checked) {
		return i
	    }
	}
    } else {
	if (buttonGroup.checked) {return 0;} // if the one button is checked, return zero
    }
    // if we get to this point, no radio button is selected
    return -1;
} // Ends the "getSelectedRadio" function

function logoChange( row, ab )
{
    //call ajax save
    ajax_logochange_save( row, ab, "logo" );    
}

function logoTypeChange( row, ab )
{    //call ajax save
    ajax_logochange_save( row, ab, "logoType" );
}

function logoposChange( row, ab )
{
    //call ajax save
    ajax_logochange_save( row, ab, "logoPos" );
}

function logoposWarnClose()
{
	var divid = document.getElementById('logoPosClash');
	divid.style.display = "none";
}