function onIt() {
	if (!document.getElementsByTagName) return;
	if (!document.getElementById("show-billing-address")) return;
	
	
	if (!document.getElementById("billing-error")) {		
		var hide = document.getElementById("show-billing-address");
		hide.style.display = "none";
	} else {
		window.location = "#billing-error";
		window.location.href = "#billing-error";
	}
	
	if (!document.getElementById("delivery-error")) {		
		var hide = document.getElementById("show-delivery-address");
		hide.style.display = "none";
	} else {
		window.location = "#delivery-error";
		window.location.href = "#delivery-error";
	}
	
	var linkShowBilling = document.getElementById("link-show-billing-address");
	linkShowBilling.onclick = show1;
	//linkShowBilling.setAttribute('onclick', 'show("show-billing-address")')
	
	
	var linkShowDelivery = document.getElementById("link-show-delivery-address");
	linkShowDelivery.onclick = show2;
	//linkShowDelivery.setAttribute('onclick', 'show("show-delivery-address")')
}

function show1() {
	var elem = "show-billing-address";
	var hide = document.getElementById(elem);
	if (hide.style.display == "block") {
		hide.style.display = "none";
	} else {
		hide.style.display = "block";
	}
}

function show2() {
	var elem = "show-delivery-address";
	var hide = document.getElementById(elem);
	if (hide.style.display == "block") {
		hide.style.display = "none";
	} else {
		hide.style.display = "block";
	}
}



function showToo(elem) {
	var hide = document.getElementById(elem);
	if (hide.style.visibility == "visible") {
		hide.style.visibility = "hidden";
	} else {
		hide.style.visibility = "visible";
	}
}

/*function inlinePopups() {
	if (!document.getElementsByTagName) return;
	if (!document.getElementById("depositPopup")) return;
	
	var linkShowDeposit = document.getElementById("inlinePopup-link");
	linkShowDeposit.setAttribute('onclick', 'showToo("depositPopup"); return false')
	
	var linkShowInsuance = document.getElementById("inlinePopup-insurancelink");
	linkShowInsuance.setAttribute('onclick', 'showToo("insurancePopup"); return false')	
}*/


//addLoadEvent(inlinePopups);
addLoadEvent(onIt);

// convert the color to rgb from hex
function hexToRGB(c)
{
	var color = c;
	if(c.indexOf('#') != -1)
	{
		var temp = c.split('#');
		color = temp[1];
	}
	var rgb = [parseInt(color.substring(0,2),16), parseInt(color.substring(2,4),16), parseInt(color.substring(4,6),16)];
	return rgb;
}

//Color FADE
//@param id: elementID
//  element: background, color, border
//      end: contains
//    steps: 25
//	  speed: 30
//highlight: true - if you want it to fade back out
function colorFade(id, element, end, steps, speed, highlight)
{
  var start,startrgb,endrgb,er,eg,eb,step,rint,gint,bint,step, originalColor;
  var target = document.getElementById(id);
  steps = steps || 20;
  speed = speed || 20;
  //clear interval
  if(target.timer)
  {
  	clearInterval(target.timer);
  }
  //Save some default colors here
  if(end == 'warning')
  {
	  endrgb = hexToRGB('f9bcbc'); 
  }
  else if(end == 'success')
  {
	  endrgb = hexToRGB('A2F26C')
  }
  else if(end == 'highlight')
  {
	  endrgb = hexToRGB('FFFF9C')
  }
  else
  {
	  //Custom color
	  endrgb = hexToRGB(end);
  }
    
  er = endrgb[0];
  eg = endrgb[1];
  eb = endrgb[2];
  if(!target.r) 
  {
    //Check what were fading
	if(element == 'background')
	{
		start = target.style.backgroundColor;
    }
	else if(element == 'border')
    {
		start = target.style.borderColor;
    }
	else
	{
		start = target.style.color;
    }
	//Check incase undefined or whatever
	if (start == undefined || start == "" || start == "transparent") 
	{
		start = "#FFFFFF";
	}
	
	if(highlight == true)
	{
		originalColor = start;
	}
	else
	{
	    originalColor = false;
	}
	
	startrgb = hexToRGB(start);
    r = startrgb[0];
    g = startrgb[1];
    b = startrgb[2];
    target.r = r;
    target.g = g;
    target.b = b;
  }
  rint = Math.round(Math.abs(target.r-er)/steps);
  gint = Math.round(Math.abs(target.g-eg)/steps);
  bint = Math.round(Math.abs(target.b-eb)/steps);
  if(rint == 0) { rint = 1 }
  if(gint == 0) { gint = 1 }
  if(bint == 0) { bint = 1 }
  target.step = 1;
  target.timer = setInterval( function() { animateColor(id,element,steps,er,eg,eb,rint,gint,bint,originalColor) }, speed);
}

// incrementally close the gap between the two colors //
function animateColor(id,element,steps,er,eg,eb,rint,gint,bint,originalColor)
{
	var target = document.getElementById(id);
    //Clear the timeout if finished
    if(target.movement) { clearTimeout(target.movement); }
    var color;
    if(target.step <= steps) {
    	var r = target.r;
    	var g = target.g;
    	var b = target.b;
    	//Work out tints
		if(r >= er) {
			r = r - rint;
  		} else {
			r = parseInt(r) + parseInt(rint);
 	    }
    	if(g >= eg) {
			g = g - gint;
    	} else {
			g = parseInt(g) + parseInt(gint);
		}	
    	if(b >= eb) {
			b = b - bint;
    	} else {
			b = parseInt(b) + parseInt(bint);
    }
    color = 'rgb(' + r + ',' + g + ',' + b + ')';
    
	//What element to style
	if(element == 'background') {
		target.style.backgroundColor = color;
    } else if(element == 'border') {
		target.style.borderColor = color;
    } else {
		target.style.color = color;
    }
	
    target.r = r;
    target.g = g;
    target.b = b;
    target.step = target.step + 1;
  } else {
    clearInterval(target.timer);
    color = 'rgb(' + er + ',' + eg + ',' + eb + ')';
    if(element == 'background') {
		target.style.backgroundColor = color;
    } else if(element == 'border') {
		target.style.borderColor = color;
    } else {
		target.style.color = color;
    }
	if(originalColor != false) {
		//If highlight is set then we wait 1 second and undo
		var s = "colorFade('"+id+"','"+element+"','"+originalColor+"',"+25+","+30+","+false+")";
		target.movement = setTimeout(s, 1000);
	}
	else
	{
		clearTimeout(target.movement);
	}
  }
}
function slider() {
	if (!document.getElementsByTagName) return;
	if (!document.getElementById("controls")) return;
	var controls = document.getElementById("controls");
	var slider = document.getElementById("slider");
	slider.style.marginLeft = "0px";
	var li = controls.getElementsByTagName("li");
	for (var i = 0; i < li.length; i++) {
		li[i].childNodes[0].id = i;
		li[i].childNodes[0].onclick = slide;
	}
}
function slide() {
	var x = this.id * 920;
	x = x * -1;
	slideElement("slider", x, 20);
	return false;
}
function slideElement(elementID, final_x, interval) {
	var element = document.getElementById(elementID);
	if(element.movement) {
		clearTimeout(element.movement);	
	}
	var xpos = parseInt(element.style.marginLeft);
	if(xpos == final_x) {
		return true;
	}
	if(xpos < final_x) {
		var dist = Math.ceil((final_x - xpos)/10);
		xpos = xpos + dist;
	}
	if(xpos > final_x) {
		var dist = Math.ceil((xpos - final_x)/10);
		xpos = xpos - dist;
	}
	element.style.marginLeft = xpos + "px";
	var repeat = "slideElement('"+elementID+"',"+final_x+","+interval+")";		
	element.movement = setTimeout(repeat, interval);
}

addLoadEvent(slider);

function flipImage() {
	if (!document.getElementsByTagName) return;
	if (!document.getElementById("product-pictures")) return;
	if (!document.getElementById("product-small")) return;
	
	var smallImage = document.getElementById("product-small");
	var howmany = smallImage.getElementsByTagName("a");
	
	for (var i = 0; i < howmany.length; i++) {
		howmany[i].id = i;
		howmany[i].onclick = imageFlipper;
	}
}

function imageFlipper() {
	var bigImage = document.getElementById("product-pictures");
	bigImage = bigImage.firstChild;
	bigImage.src = this.href;
	return false;
}


addLoadEvent(flipImage);


