var duration = .3;
var sDuration = .5;
var pEffects = [];
var menuIds = ["menuHome","menuVedugn","menuUtbildning","menuKafe","menuButik","menuPraktisk"];
var subMenuIds = [];

Event.observe(window, 'load', function() {

//Sub Menu
for(var i=0;i<subMenuIds.length;i++){
	var menu = $(subMenuIds[i]);
	Event.observe(menu, 'mouseover', function() {
		stopEffects(this);
		pEffects.push(new Effect.Tween(this, this.retrieve("pcnt",0), 1, { elemId: this.id, duration:sDuration }, function(p){ updateBg(this,p) }));		
	});
	Event.observe(menu, 'mouseout', function() {
		stopEffects(this);
		pEffects.push(new Effect.Tween(this, this.retrieve("pcnt",0), 0, { elemId: this.id, duration:sDuration }, function(p){ updateBg(this,p) }));		
	});
}


//Top Menu
for(var i=0;i<menuIds.length;i++){
	var menu = $(menuIds[i]);
	Event.observe(menu, 'mouseover', function() {
		stopEffects(this);
		pEffects.push(new Effect.Tween(this, this.getOpacity(), 0, { elemId: this.id, duration:duration }, function(p){ this.setOpacity(p) }));		
	});
	Event.observe(menu, 'mouseout', function() {
		stopEffects(this);
		pEffects.push(new Effect.Tween(this, this.getOpacity(), 1, { elemId: this.id, duration:duration }, function(p){ this.setOpacity(p) }));		
	});
}

});

//From FFFFFF
//To #ff8a00
var from = 	[parseInt("FF",16),parseInt("FF",16),parseInt("FF",16)];
var to = 	[parseInt("FF",16),parseInt("8a",16),parseInt("00",16)];
function updateBg(elem,p){
	elem.store("pcnt",p);
	var clr = "";
	for(var i=0;i<3;i++){
		clr += Math.round( from[i] + p*(to[i]-from[i]) ).toString(16);
	}
	
	elem.setStyle({"backgroundColor":"#"+clr});
}

function stopEffects(elem){
	for(var i=0;i<pEffects.length;i++){
		if(pEffects[i].options.elemId == elem.id){
			pEffects[i].cancel();
		}
	}
}