/* == ai magazine...*/
Element.extend({
	fadeIn:function(delay) {
		f = new Fx.Style(this, 'opacity', {duration:400, fps:50});
		f.start.pass([0,1], f).delay(delay);
		return this;
	},
	fadeOut:function(delay) {

		f = new Fx.Style(this, 'opacity', {duration:400, fps:50});
		f.start.pass([1,0], f).delay(delay);
		
		return this;
	}
});


var loadLink = "";
var selector = '.homenavigation ul li a';

var menuEffects = new Class({
	initialize: function(){
		
		this.currTimer = 200;
		this.slideInDelay= 150;
		
		this.specialEffects = [];
	
		$$(selector).each(function(el,i){
			el.setStyle('top', "360px");
			this.specialEffects[i] = new Fx.Styles(el, {wait: false, transition: Fx.Transitions.backOut, duration: 600});
			this.addSpecialEffects(el,this.specialEffects[i]);
		}, this);

		this.active = $('h_magazine');		
	
		$$(selector).each(function(el){
			el.addEvent('click', function(){
				if(this.active.id != el.id) {
				
					this.changeContent(el);
					el.setStyle('top','300px');
					el.addClass('active');
					this.clearAll(el);
					this.active = el;
				}
			}.bind(this));
		}.bind(this));
		
		this.showMenu();
		
	},
	
	changeContent: function(el) {
		var slide = $('changer-'+this.active.id).effect('top', {wait:true,transition: Fx.Transitions.backOut, duration: 600, onComplete:function(){
			$('changer-'+this.active.id).style.display = 'none';
			$('changer-'+this.active.id).setStyle('top',0);
		
			$('changer-'+el.id).setStyle('top','350px');
			$('changer-'+el.id).style.display = 'block';

			var slidein = $('changer-'+el.id).effect('top', {wait:true,transition: Fx.Transitions.backOut, duration: 600});
			slidein.custom.delay(0, slidein, '0');
		}.bind(this)});
		slide.custom.delay(0, slide, '-300');
		
	},
	
	reset: function(el) {
		$('changer-'+this.active.id).style.display = 'none';
		$('changer-'+this.active.id).setStyle('top',0);
		
		$('changer-'+el.id).style.display = 'block';
		$('changer-'+el.id).fadeIn(0);	
	},
	
	showMenu: function() {
		$$(selector).each(function(el){
			if(el.hasClass('active')) {
				var effect = el.effect('top', {wait:true, transition: Fx.Transitions.backOut, duration: 500});
				effect.custom.delay(this.currTimer, effect, '300');
				this.currTimer += this.slideInDelay;
			} else {
				var effect = el.effect('top', {wait:true, transition: Fx.Transitions.backOut, duration: 500});
				effect.custom.delay(this.currTimer, effect, '320');
				this.currTimer += this.slideInDelay;
			}
		}.bind(this));
	},
	
	hideMenu: function() {
		$$(selector).each(function(el){
			var effect = el.effect('top', {transition: Fx.Transitions.backOut, duration: 400});
			effect.custom.delay(this.currTimer, effect, '340');
			this.currTimer += this.slideInDelay;
		}.bind(this));
	},
	
	clearAll: function(current) {
		$$(selector).each(function(el){
			if(el != current) {
				//el.setStyle('top','320px');
				el.effect('top', {wait:true, transition: Fx.Transitions.backOut, duration: 500}).start(320);
				el.removeClass('active');
			}

		});
	},
	
	addSpecialEffects: function(el,effect) {
		el.addEvents({
			'mouseover': function() {
				//var effect = el.effect('top', {wait: true, transition: Fx.Transitions.backOut, duration: 600}).start(300);
				effect.start({'top': '300'});
			},
			
			'mouseout': function() {
				if(!el.hasClass('active'))
					//var effect = el.effect('top', {wait: true, transition: Fx.Transitions.backOut, duration: 600}).start(320);
					effect.start({'top': '320'});
			}
		});
		
	}
		
});

function processMenuEffects (){
	var myMenus = new menuEffects();
}
window.onDomReady(processMenuEffects);