/* Script - MGC */

document.observe("dom:loaded", function() {
	
	// Log layer
	$$(".account .layer").each(function(o){
		var a = $(o.parentNode).select("a")[0];
		var l = $(o.parentNode).select(".layer")[0];
		a.l = l;
		a.removeAttribute("href");
		Element.observe(a,"click",function(){
			$(this.l).toggle();
		});
	});
	
	// Log layer newsletter
	$$(".news .layer").each(function(o){
		var a = $(o.parentNode).select("a")[0];
		var l = $(o.parentNode).select(".layer")[0];
		a.l = l;
		a.removeAttribute("href");
		Element.observe(a,"click",function(){
			$(this.l).toggle();
		});
	});
	
	// uiFieldcleaner
	$$(".fieldcleaner").each(function(o){
		// Style
		Element.addClassName(o,"tobefilled");
		// Default
		document.fieldtocheck = o;
		checkField();
		o.timer = null;
		// Event
		o.label = Element.previous(o);
		o.onfocus = function(){
			clearInterval(this.timer);
			document.fieldtocheck = this;
			this.timer = setInterval(checkField,50);
			Element.addClassName(this.label,"filling");
		}
		o.onblur = function(){
			clearInterval(this.timer);
			document.fieldtocheck = null;
			Element.removeClassName(this.label,"filling");
		}
	});
	
	// Accordion navigation
	var hasActiveItem = $$(".left .subnavigation > ul > li.on");
	// Store active
	document.openednavigation = hasActiveItem[0];
	var items = $$(".left .subnavigation > ul > li").each(function(o){
		// Store references
		o.head = o.getElementsByTagName("a")[0];
		o.head.parent = o;
		var ul = o.getElementsByTagName("ul")[0];
		o.head.content = ul;
		// If has child nodes
		if(o.head && ul){
			// Set sub height
			var count = 0;
			var min = 0;
			var max = 0;
			var sub = $(ul).select("li").each(function(oo){
				if(oo.parentNode == ul){
					count ++;
					if(count <= 3){
						min = min+oo.offsetHeight;
					}
					max = max+oo.offsetHeight;
				}
			});
			// Has more than 4 entries
			if(min != max){
				// Set min height
				Element.setStyle(ul,{overflow:"hidden",paddingBottom:"22px",height:min+"px"});
				ul.max = max;
				// Add opener
				var opener = document.createElement("div");
				Element.addClassName(opener,"seeall");
				Element.setStyle(opener,{cursor:"pointer",height:"22px",lineHeight:"22px",top:(o.head.offsetHeight+min+2)+"px"});
				var link = document.createElement("a");
				var text = document.createTextNode("Voir toutes les catégories");
				link.appendChild(text);
				opener.appendChild(link);
				ul.parentNode.appendChild(opener);
				// Event
				opener.ul = ul;
				opener.parent = o;
				opener.head = o.head;
				Event.observe(opener,"click",foldNavigation);
			}
			// Event
			Event.observe(o.head,"click",openNavigation);
			// Default state
			if(hasActiveItem.length > 0){
				o.head.url = o.head.href;
				Element.setStyle(o.head,{cursor:"pointer"});
				o.head.removeAttribute("href");
				Element.setStyle(o,{overflow:"hidden"});
				if(o != document.openednavigation){
					Element.setStyle(o,{height:(o.offsetHeight-o.head.content.offsetHeight)+"px"});
				}
			}
		}
	});
	
	// Quantity field
	var qties = $$("input.qty").each(function(o){
		// Resize field
		Element.setStyle(o,{width:"20px"});
		// Plus
		o.plus = document.createElement("div");
		Element.addClassName(o.plus,"plus");
		o.plus.field = o;
		o.plus.delta = 1;
		o.parentNode.appendChild(o.plus);
		// Minus
		o.minus = document.createElement("div");
		Element.addClassName(o.minus,"minus");
		o.minus.field = o;
		o.minus.delta = -1;
		o.parentNode.appendChild(o.minus);
		// Events
		Event.observe(o.plus,"click",setQuantity);
		Event.observe(o.minus,"click",setQuantity);
	});
	
	// Zoom
	$$("a.popit").each(function(o){
		zoom.build.apply(o);
	});
	
});

// uiFieldcleaner
document.fieldtocheck = null;
function checkField(){
	var _field = document.fieldtocheck;
	if(_field.value == ""){
		Element.removeClassName(document.fieldtocheck,"filled");
	} else {
		Element.addClassName(document.fieldtocheck,"filled");
	}
}

/* Zoom */
var zoom = {
	created:0,
	loading:false,
	build:function(){
		// Store params
		this._zoom = this.href;
		this.removeAttribute("href");
		this._popin = null;
		// Events
		Event.observe(this,"click",zoom.open);
	},
	open:function(){
		// Prevent from launching multiple zoom
		if(!zoom.loading){
			if(!this._popin){
				zoom.loading = true;
				var _this = this;
					_random = Math.round(Math.random()*100000);
				// Create popin block
				Element.insert(document.body,"<div id=\"zoom"+zoom.created+"\" class=\"popin\"><img src=\""+this._zoom+"?r="+_random+"\" />");
				this._popin = "zoom"+zoom.created;
				// Events
				var img = $$("#zoom"+zoom.created+" img")[0];
				Event.observe(img,"load",function(){
					zoom.loading = false;
					popin.open(_this._popin,this.offsetWidth,this.offsetHeight);
				});
				zoom.created ++;
			} else {
				popin.open(this._popin);
			}
		}
		// Prevent bubbling
		return false;
	}
},
popin = {
	opened:null,
	bg:null,
	closer:null,
	over:null,
	from:null,
	open:function(idlayer,width,height){

        var layer = $(idlayer);
		// Move node
		if(layer.parentNode){
			// Add mark
			Insertion.After(layer,"<div id=\"popinfrom\"></div>");
			popin.from = $("popinfrom");
			Element.insert(document.body,layer);
		}
		// Background & closer
		if(popin.bg == null){
			Element.insert(document.body,"<div class=\"popinbg\"></div><div class=\"popincloser\">Fermer X</div><div class=\"popinover\"></div>");
			popin.bg = $$(".popinbg")[0];
			popin.closer = $$(".popincloser")[0];
			Event.observe(popin.closer,"click",popin.close)
			popin.over = $$(".popinover")[0];
		}
		// Animation
		var w = (width)? width : layer.offsetWidth,
			h = (height)? height : layer.offsetHeight;
		Element.setStyle(popin.over,{ display:"block", opacity:0 });
		Effect.Fade(popin.over, { duration:0.15, from:0, to:0.5 });
		Element.setStyle(popin.bg,{ display:"block", opacity:0, width:w+"px", height:h+"px", marginTop:(-(h/2)-5)+"px", marginLeft:(-(w/2)-5)+"px" });
		new Effect.Morph(popin.bg, { duration:0.25, style:"opacity:1;"});
		Element.setStyle(layer, { opacity:0, width:w+"px", height:h+"px", marginTop:(-h/2)+"px", marginLeft:(-w/2)+"px" });
		Element.addClassName(layer,"visible");
		new Effect.Morph(layer,{ duration:0.25, style:"opacity:1;", delay:0.5, afterFinish:function(){
			layer.style.filter = "";
		}});
		Element.setStyle(popin.closer, { display:"block", opacity:0, marginTop:((h/2)-20)+"px", marginLeft:((w/2)-75)+"px" });
		new Effect.Morph(popin.closer,{ duration:0.15, style:"opacity:1;", delay:0.5, afterFinish:function(){
			popin.closer.style.filter = "";
		}});
		// Settings
		popin.opened = layer;
		Element.addClassName(document.body,"poped");
		
		// Event
		Event.observe(document,"keyup",popin.keyclose);
	},
	close:function(callback){
		new Effect.Morph(popin.closer,{ duration:0.15, style:"opacity:0;" });
		new Effect.Morph(popin.opened,{ duration:0.25, style:"opacity:0;", afterFinish:function(){
			if(popin.from != null){
				Insertion.Before(popin.from,popin.opened);
				Element.remove(popin.from);
			}
			Element.removeClassName(popin.opened,"visible");
			// Settings
			Element.removeClassName(document.body,"poped");
			popin.opened = null;
		}});
		new Effect.Morph(popin.bg, { duration:0.25, style:"opacity:0;", delay:0.3, afterFinish:function(){
			Element.setStyle(popin.bg,{ display:"none" });
		}});
		new Effect.Morph(popin.over, { duration:0.15, style:"opacity:0;", delay:0.5, afterFinish:function(){
			Element.setStyle(popin.over, { display:"none" });
		}});
		// Event
		Event.stopObserving(document,"keyup",popin.keyclose);
	},
	keyclose:function(e){
		var key = e.charCode || e.keyCode || 0;
		if(key == 27){
			popin.close();
		}
	}
}


// Accordion navigation
document.openednavigation = null;
function openNavigation(){
	var current = document.openednavigation;
	// Link
	if(this.parent == current){
		document.location = this.url;
	// Or open
	} else {
		// Hide old
		new Effect.Morph(current,{style:"height:"+(current.offsetHeight-current.head.content.offsetHeight)+"px;",duration:0.3});
		// Show new
		console.log(this.parent.offsetHeight+" : "+this.content.offsetHeight);
		new Effect.Morph(this.parent,{style:"height:"+(this.parent.offsetHeight+this.content.offsetHeight)+"px;",duration:0.3});
		// Set current
		document.openednavigation = this.parent;
	}
}
function foldNavigation(){
	// Set new height
	new Effect.Morph(this.ul,{style:{height:this.ul.max+"px",paddingBottom:"2px"},duration:0.3});
	new Effect.Morph(this.parent,{style:"height:"+(this.head.offsetHeight+this.ul.max+4)+"px;",duration:0.3});
	new Effect.Morph(this,{style:{top:(this.head.offsetHeight+this.ul.max)+"px"},duration:0.3});
}

// Quantity field
function setQuantity(){
	var value = parseInt(this.field.value);
	if(typeof(value) == "number"){
		if(value+this.delta > 0){
			this.field.value = value+this.delta;
		}
	}
}