// Most code copyright designjunction.net
// but do what you like with it. 

function fold(row,ele) {
	if($(ele).down().classNames()=='closed'){
		$(ele).down().removeClassName('closed');
	}else{
		$(ele).down().className='closed'
	}
	var r = $('fold_'+row)
	r.toggle();
	new Ajax.Request('/shopper/setprefs', {asynchronous:true, method:'post', postBody:'row='+row+'&visible='+r.visible()});
}


function shop_message(m) {
	var w = show_message(m, message_delay(m));
	Event.observe(window, 'load', function() {fade_shop_message(w, message_delay(m));});
}

function shop_notification(m) {
	var w = show_message(m);
	fade_shop_message(w, message_delay(m));
}

function message_delay(m) {
	var base = 1.5;
	var words = m.split(/ /);
	words = Math.max(0, words.length - 4);
	return base + ((words / 6.0));
}

function fade_shop_message(w, d) {
	new Effect.Opacity(w,
    	{ duration: 0.5, 
      transition: Effect.Transitions.linear, 
      from: 1.0, to: 0.0, delay: d, afterFinish:function(){try { w.remove();} catch (e) {}} });
}

function show_message(m) {
	var home = $('shop_messages');
	var w = $(document.createElement('div'));
	w.id = "message_popup";
	w.className = "wrapper";
	w.hide();
	var a = $(document.createElement('div'));
	a.className = "top"
	var b = $(document.createElement('div'));
	b.className = "middle"
	b.innerHTML = '<h3>' + m + '</h3>';
	var c = $(document.createElement('div'));
	c.className = "bottom";
	w.appendChild(a)
	w.appendChild(b)
	w.appendChild(c)
	home.appendChild(w);
	w.onclick = function(event) {
		Event.stop(event);
		this.remove();
	}
	w.show();
	return w;
}

// individual product
function colour_flip(id) {
	// var id = select.value;
	selected_colour = id;
	set_default_product_image(id);
	
	$('stock_status').innerHTML = $('stock_status_'+id).innerHTML;
}
// product images

function show_image(id) {
	show_enlarge_button(id);
	if (id == default_product_image_id) {
		show_default_product_image();
	} else {
		set_product_image(id);
	}
	select_id(id);
}


function set_default_product_image(id) {
	current_product_image_id = id;
	show_default_product_image();
}
function show_default_product_image() {
	set_product_image(current_product_image_id);
	show_enlarge_button(current_product_image_id);
	select_id(default_product_image_id);
}

function set_product_image(id) {
	var c = $('image_canvas');
	c.innerHTML = $('product_image_'+id).innerHTML;
}
function reset_image_selector() { // sets the image selector back to '1'
	show_enlarge_button(default_product_image_id);
	select_id(default_product_image_id);
}

function show_enlarge_button(id) {
	var i = all_images[id];
	var e = $('enlarge');
	if (i.big) {
		e.show();
		e.image_id = i.id;
		e.onclick = function() {
			enlarge(this.image_id);
		}
	} else {
		e.hide();
	}
}
function generate_select(root) {
	return function(id) {
		if ($(root+active_ids[root])) $(root+active_ids[root]).removeClassName('active');
		if ($(root+id)) $(root+id).addClassName('active');
		active_ids[root] = id;
	}
}

var select_id = generate_select('show_');
var enlarged_select_id = generate_select('enlarged_');

function enlarge(id) {
	var body = document.getElementsByTagName("body").item(0);
	var o = $('overlay');
	if (!o) {
		o = document.createElement("div");
		o.setAttribute('id','overlay');
		o.style.display = 'none';
	}
	var arrayPageSize = getPageSize();
	Element.setWidth(o, arrayPageSize[0]);
	Element.setHeight(o, arrayPageSize[1]);
	body.appendChild(o);
	var l = $('lightbox')
	o.appendChild(l);
	hideFlash1();
	l.show();
	if (enlarged_image_count <= 1) $('enlarged_gallery_nav').hide();
// 	var i = document.createElement("iframe");
// 	var body = document.getElementsByTagName("body").item(0);
// 	i.setAttribute('id','blocking-frame');
// 	i.style.display = 'none';
// 	i.style.position = 'absolute';
// 	i.style.border = 'solid 1px red';
// 	i.style.zIndex = 9000;
// 	i.style.top = '0';
// 	i.style.left = '0';
// 	i.src = 'javascript:false';
// 	
// 	var arrayPageSize = getPageSize();
// 	Element.setWidth(i, arrayPageSize[0]);
// 	Element.setHeight(i, arrayPageSize[1]);
	
	// i.style.display = 'none';
	// body.appendChild(i);
	new Effect.Appear(o, { duration: 0.2, from: 0.0, to: 1, afterFinish: function() {
		hideSelectBoxes();
		hideFlash2();
			// i.style.display = 'block';

		show_enlarged(id);
	} });
}

function close_enlarge() {
	var l = $('lightbox');
	l.hide();
	new Effect.Fade('overlay', { duration: 0.2, afterFinish: function() {
		showFlash2();
		$('overlay').hide();
		var canvas = $('fullscreen_canvas');
		canvas.innerHTML = '';
	}});
	showSelectBoxes();
	showFlash1();	
}

function show_enlarged(id) {
	var canvas = $('fullscreen_canvas');
	if (id == default_product_image_id) {
		id = current_product_image_id;
	}
	var image = all_images[id];
	var img = document.createElement('img');
	img.src = image.big.src;
	img.width = image.big.width;
	img.height = image.big.height;
	img.style.paddingTop = (695 - image.big.height)/2 + 'px';
	/*img.style.paddingLeft = (695 - image.big.width)/2 + 'px';*/
	img.onclick = function() { close_enlarge(); };
	canvas.innerHTML = '';
	canvas.appendChild(img);
	if (id == current_product_image_id) {
		enlarged_select_id(default_product_image_id);
	} else {
		enlarged_select_id(id);
	}
}
// product icoh

function blow_bubbles(insert_id, swf, width, height, params) {
	var so = new SWFObject(swf, "mymovie", width, height, "7", "#ffffff");
	so.addParam("wmode", "transparent");
	so.addVariable("browser", '1');
	for (k in params) {
		so.addVariable(k, params[k]);
	}
	so.write(insert_id);

}

// some code below taken from:
// -----------------------------------------------------------------------------------
//
//	Lightbox v2.03.3
//	by Lokesh Dhakar - http://www.huddletogether.com
//	5/21/06
//
//	For more information on this script, visit:
//	http://huddletogether.com/projects/lightbox2/
//
//	Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/
//	
//	Credit also due to those who have helped, inspired, and made their code available to the public.
//	Including: Scott Upton(uptonic.com), Peter-Paul Koch(quirksmode.com), Thomas Fuchs(mir.aculo.us), and others.
//
//
// -----------------------------------------------------------------------------------

Object.extend(Element, {
	getWidth: function(element) {
	   	element = $(element);
	   	return element.offsetWidth; 
	},
	setWidth: function(element,w) {
	   	element = $(element);
    	element.style.width = w +"px";
	},
	setHeight: function(element,h) {
   		element = $(element);
    	element.style.height = h +"px";
	},
	setTop: function(element,t) {
	   	element = $(element);
    	element.style.top = t +"px";
	},
	setLeft: function(element,l) {
	   	element = $(element);
    	element.style.left = l +"px";
	},
	setSrc: function(element,src) {
    	element = $(element);
    	element.src = src; 
	},
	setHref: function(element,href) {
    	element = $(element);
    	element.href = href; 
	},
	setInnerHTML: function(element,content) {
		element = $(element);
		element.innerHTML = content;
	}
});
function getPageSize(){
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = window.innerWidth + window.scrollMaxX;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	
//	console.log(self.innerWidth);
//	console.log(document.documentElement.clientWidth);

	if (self.innerHeight) {	// all except Explorer
		if(document.documentElement.clientWidth){
			windowWidth = document.documentElement.clientWidth; 
		} else {
			windowWidth = self.innerWidth;
		}
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

//	console.log("xScroll " + xScroll)
//	console.log("windowWidth " + windowWidth)

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = xScroll;		
	} else {
		pageWidth = windowWidth;
	}
//	console.log("pageWidth " + pageWidth)

	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
	return arrayPageSize;
}

// ---------------------------------------------------

function showSelectBoxes(){
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "visible";
	}
}

// ---------------------------------------------------

function hideSelectBoxes(){
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "hidden";
	}
}

// ---------------------------------------------------

function showFlash1(){
	var ff = document.getElementsByTagName("object");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.display = "";
	}

	ff = document.getElementsByTagName("embed");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.display = "";
	}
	$('breadcrumb').style.visibility = "visible";
}
function showFlash2(){
	var ff = document.getElementsByTagName("object");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.visibility = "visible";
	}

	ff = document.getElementsByTagName("embed");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.visibility = "visible";
	}
}

// ---------------------------------------------------

function hideFlash1(){
	var ff = document.getElementsByTagName("object");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.visibility = "hidden";
		if (isWebKit()) ff[i].style.display = "none";
		
	}

	ff = document.getElementsByTagName("embed");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.visibility = "hidden";
		if (isWebKit()) ff[i].style.display = "none";
	}
	// $('breadcrumb').onmouseover = function(event) { Event.stop(event); }
}
function hideFlash2(){
	var ff = document.getElementsByTagName("object");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.display = "none";
	}

	ff = document.getElementsByTagName("embed");
	for (i = 0; i < ff.length; i++) {
		ff[i].style.display = "none";
	}
}


// ---------------------------------------------------

Object.extend(Object.extend(Effect.Opacity.prototype, Effect.Opacity.prototype), {
  finish: function(position) {
	if(Math.round(this.element.getOpacity()*10)==10){
		this.element.setStyle({
		  '-moz-opacity': 1
		});	
	}
  }
});


function isWebKit() {
	return RegExp(" AppleWebKit/").test(navigator.userAgent);
}

function attachButtonHover(){
	
	if(document.all){
		if ($('page')) {
			var buttons = $('page').getElementsBySelector('button');
			
			buttons.each(function (button){
				var tag_name = button.tagName.toUpperCase();
				if(tag_name!='SPAN'){
					var o = button;
					button=button.down();
					if (!button) button = o;
				}
				Event.observe(button, 'mouseover', function(event){
					button.setStyle({
					  backgroundPosition: 'bottom left'
					});
				 });
				Event.observe(button, 'mouseout', function(event){
					button.setStyle({
					  backgroundPosition: 'top left'
					});
				 });
			});
		}
	}
}


function attachDrag(){
	if ($('sorted')) {
		Sortable.create('sorted', {
			tag:'div',
			only:'sortme',
			handle:'move',
			onUpdate: function() {
				new Ajax.Request('/shopper/setprefs', {asynchronous:true, method:'post', postBody:Sortable.serialize('sorted')});
			}
		});
		if(document.all){
			//mw fix IE6
			if($('row_other')){
				new Effect.Opacity($('row_other'), {duration:0, from:1.0, to:1.0});
			}
			if($('row_related')){
				new Effect.Opacity($('row_related'), {duration:0, from:1.0, to:1.0});
			}
			if($('row_recent')){
				new Effect.Opacity($('row_recent'), {duration:0, from:1.0, to:1.0});
			}
		}
	}
	
}

function attachArrowHover(){
	
	if(document.all){
		if ($('nav')) {
			var links = $('nav').getElementsBySelector('a');
			links.each(function (a) {
			a.observe('mouseover', function(event){
				var li = a.up();
				var tag_name = li.tagName.toUpperCase();
				if(tag_name!='LI'){
					li=li.up();
				}
				
				tag_name = li.tagName.toUpperCase();
				if(tag_name=='LI'){
					if(li.hasClassName('active')){
						li.addClassName('stay_active');
					}else{
						li.addClassName('active');
					}
				}
				
			});
			a.observe('mouseout', function(event){
		  	var li = a.up();
				var tag_name = li.tagName.toUpperCase();
				if(tag_name!='LI'){
					li=li.up();
				}
				tag_name = li.tagName.toUpperCase();
				if(tag_name=='LI'&&li.hasClassName('active')){
					if(li.hasClassName('stay_active')){
						li.removeClassName('stay_active');
					}else{
						li.removeClassName('active');
					}
				}
			 });
		});
		
		/*
		less dom-walking, but does it work?
		var li_collection = $('nav').getElementsBySelector('li');
		li_collection.each(function (li){
			if(li.up().id='nav'){
				li.setStyle({
				  marginLeft: '19px'
				});
			}
			li.observe('mouseover', function(event){
				if(li.hasClassName('active')){
					li.addClassName('stay_active');
				}else{
					li.addClassName('active');
				}
			});
			li.observe('mouseout', function(event){
				if(li.hasClassName('stay_active')){
					li.removeClassName('stay_active');
				}else{
					li.removeClassName('active');
				}
			});
		});
		*/
		/*
		var li_collection = $('nav').getElementsBySelector('li');
		li_collection.each(function (li){
			li.observe('mouseover', function(event){
					li.addClassName('hover');
			});
			li.observe('mouseout', function(event){
				li.removeClassName('hover');
			});
		});*/
		}
	}
}

Event.observe(window, 'load', attachButtonHover);
Event.observe(window, 'load', attachDrag);
Event.observe(window, 'load', attachArrowHover);

function track_transactions() {
	// place holder for analytics tracking of orders
	// overwritten in receipt page
}

