img1 = new Image();
img1.src = "/media/pics/white-end-r.gif";
img2 = new Image();
img2.src = "/media/pics/white-end-l.gif";
img3 = new Image();
img3.src = "/media/pics/white-tag.gif";
img4 = new Image();
img4.src = "/media/pics/addtocarton.gif";
img5 = new Image();
img5.src = "/media/pics/startchaton.gif";
img6 = new Image();
img6.src = "/media/pics/checkouton.gif";
img7 = new Image();
img7.src = "/media/pics/cornertop.gif";
img8 = new Image();
img8.src = "/media/pics/cornerleft.gif";
img9 = new Image();
img9.src = "/media/pics/e4e4e4.gif";
img10 = new Image();
img10.src = "/media/pics/toolbottom.gif";
img11 = new Image();
img11.src = "/media/pics/cart.gif";
img12 = new Image();
img12.src = "/media/pics/mycart.gif";
img13 = new Image();
img13.src = "/media/pics/homeon.gif";


var logon;

function show_login()	{
    i_got_my_id();
	if (logon == 1) {
		hide_tooltip('login');
		logon = 0;
	}
	else {
		show_tooltip('login',-100,20);
		$('login_email').focus();
		logon = 1;
	}
}

function do_login()	{
	onSuccess = function(meta)	{
		window.location.reload()
        // document.location = '/customerarea.html';
	}
	onFailure = function(meta)	{
		$('login_errormsg').update( '<span style="color: red; font-weight: bold;">Error: ' + meta.responseText + '</span>' )
	}
	new Ajax.Request( '/login.html', {
		method: 'post',
		onSuccess: onSuccess,
		onFailure: onFailure,
		parameters: { 'email': $('login_email').value, 'order': $('login_order').value }
	})
}

function forgot_id() {
    document.getElementById("login_form").action = 'javascript:doForgotID()';
    document.getElementById("login_errormsg").innerHTML = 'Please enter your E-mail to receive your ID';
    document.getElementById("login_id_link").innerHTML = 'I got my ID';
    document.getElementById("login_id_link").href = 'javascript:i_got_my_id();';
	document.getElementById("login_id_tr").style.display = 'none';
	document.getElementById("login_id_tr").style.visibility='hidden';
    document.getElementById("login_submit").value = 'Send ID';
}

function i_got_my_id() {
    document.getElementById("login_form").action = 'javascript:do_login()';
    document.getElementById("login_errormsg").innerHTML = 'Please enter any of your previous Order IDs';
    document.getElementById("login_id_link").innerHTML = 'Forgot ID?';
    document.getElementById("login_id_link").href = 'javascript:forgot_id();';
    document.getElementById("login_id_tr").style.display = '';
	document.getElementById('login_id_tr').style.visibility='visible';
    document.getElementById("login_submit").value = 'Sign In';
}


function picsmall_click(id)	{
	var old = $('picbig').src.replace(/.*\/(\d+)\.jpg$/, '$1');
    if( id != old ) {
	    $('picbig').src = '/media/pics/0.gif';
		$('picbig').src = '/media/images/'+$('picbig').width+'/'+id+'.jpg';
	    $(id).setStyle({'border': '1px solid white'});
	    $(old).setStyle({'border':'1px dotted #cccccc'});
    }
}

function thumbOn(name) {
    myImg = name.getElementsByTagName('IMG')[0];
	myImg.style.border = '1px solid #a8bce0';
//    myButt = name.getElementsByTagName('TD')[3];
//    myButt.style.color = '#21375E';
    myButt = name.getElementsByTagName('TD')[6];
    myButt.style.color = '#21375E';
    name.style.color = '#a8bce0';
}

function thumbOff(name) {
    myImg = name.getElementsByTagName('IMG')[0];
	myImg.style.border = '1px dotted #aaaaaa';
//    myButt = name.getElementsByTagName('TD')[3];
//    myButt.style.color = 'black';
    myButt = name.getElementsByTagName('TD')[6];
    myButt.style.color = 'black';
    name.style.color = '#cccccc';
}

function reformatmodel() {
	var activewidth = document.getElementById("master").offsetWidth;

    spacer(activewidth);

	if (activewidth > 1200) {
		document.getElementById("picbig").src = document.getElementById("picbig").src.replace( '/500/', '/700/' );
		document.getElementById("picbig").width = '700';
		document.getElementById("picbig").height = '525';
	}
	else {
		document.getElementById("picbig").src = document.getElementById("picbig").src.replace( '/700/', '/500/' );
		document.getElementById("picbig").width = '500';
		document.getElementById("picbig").height = '375';
	}
}

function reformatcatalogue() {
    hide_tooltip('login');
    logon = 0;
	var activewidth = document.getElementById("master").offsetWidth;
	var details = getElementsByStyleClass("details");
	var thumbs = getElementsByStyleClass("picsmall");

    spacer(activewidth);

	if (activewidth > 1200) {
		for (i=0;i<thumbs.length;i++) {
			thumbs[i].src = thumbs[i].src.replace( '/150/', '/200/' );
			thumbs[i].width = "200";
			thumbs[i].height = "150";
		}
		for (i=0;i<details.length;i++) {
			details[i].src = details[i].src.replace( 's70.gif', 's.gif' );
			details[i].width = "90";
		}

	}
	else {
		for (i=0;i<thumbs.length;i++) {
			thumbs[i].src = thumbs[i].src.replace( '/200/', '/150/' );
			thumbs[i].width = "150";
			thumbs[i].height = "113";
		}
		for (i=0;i<details.length;i++) {
			details[i].src = details[i].src.replace( 's.gif', 's70.gif' );
			details[i].width = "60";
		}
	}
}

function spacer(activewidth) {
    hide_tooltip('login');
    logon = 0;
	if (activewidth > 1200) {
   		document.getElementById("spacer").width = '702';

    }
	else {
   		document.getElementById("spacer").width = '502';
    }
}

function getElementsByStyleClass (className) {
  var all = document.all ? document.all :
    document.getElementsByTagName('*');
  var elements = new Array();
  for (var e = 0; e < all.length; e++)
    if (all[e].className == className)
      elements[elements.length] = all[e];
  return elements;
}

//////////////////////////////////////////////////////////////////////

function brandon(name) {
	name.className = "brandon";
	return true;
}
function brandoff(name) {
	name.className = "brandoff";
	return true;
}

function show_tooltip(element,moveright,movedown)	{
//	offset = { 'quality': 9, 'delivery': 17, 'support': 24}
	a = $(element)
	pos = a.viewportOffset()
	t = $(element)
	t.setStyle('left: ' + (getAbsoluteLeft(element+'pic') + moveright))
    t.setStyle('top: ' + (getAbsoluteTop(element+'pic') + movedown))
//	t.appear({duration: 0.0, to: 1});
	t.show()
}

function hide_tooltip(element)	{
	t = $(element)
//	t.fade({duration: 0.2});
	t.hide()
}

function getAbsoluteLeft(objectId) {
	// Get an object left position from the upper left viewport corner
	o = document.getElementById(objectId)
	oLeft = o.offsetLeft            // Get left position from the parent object
	while(o.offsetParent!=null) {   // Parse the parent hierarchy up to the document element
		oParent = o.offsetParent    // Get parent object reference
		oLeft += oParent.offsetLeft // Add parent left position
		o = oParent
	}
	return oLeft
}

function getAbsoluteTop(objectId) {
	// Get an object top position from the upper left viewport corner
	o = document.getElementById(objectId)
	oTop = o.offsetTop            // Get top position from the parent object
	while(o.offsetParent!=null) { // Parse the parent hierarchy up to the document element
		oParent = o.offsetParent  // Get parent object reference
		oTop += oParent.offsetTop // Add parent top position
		o = oParent
	}
	return oTop
}

function doForgotID()	{
	new Ajax.Request('/forgot.html', {
		method: 'get',
		parameters: { 'email': document.getElementById('login_email').value },
		onSuccess: function(transport)	{
			$('login_errormsg').update( transport.responseText )
		},
		onFailure: function(transport)	{
			alert('Some Error Occured ' + transport.status)
		}
	})
}
