// iFramework edition layer class

var liquidBox = new Class({			  
	initialize: function(){
		var t = this;
		this.fixMenu();
		this.boxes = $$('.liquid');
		this.boxes.each(function(el){
			var sizeFx = new Fx.Tween(el,  {
				duration: 1700, 
				transition: Fx.Transitions.Elastic.easeOut,
				//transition: Fx.Transitions.Expo.easeOut,
				wait: false,
				fps: 50
			});
			var oSize = el.getCoordinates().height.toInt() - 20; //Add -20 because ifBox add 20px to design the box
			var dSize = 200;
			if(el.getAttribute('alt')){
				var dSize = el.getAttribute('alt');
			}
			el.addEvents({
				mouseenter: function(){
					sizeFx.start('height',dSize);
					t.closeAll(el);
				},
				mouseleave: function(){
					sizeFx.start('height',oSize);
				}
			});
		}.bind(this));
		//(function(){this.closeAll()}.bind(this)).periodical(1000);
	},
	
	closeAll: function(le){
		this.boxes.each(function(el){
			if(le != el){
				el.fireEvent('mouseout');
			}
		}.bind(this));
	},
	fixMenu: function(){
		if($('navi') && $('wrapper')){
			this.keepSpace();
			window.addEvent('resize', function(){this.keepSpace();}.bind(this));
		}
	},
	
	keepSpace: function(){
		if($('wrapper').getCoordinates().left.toInt() <= 200){
			$('wrapper').setStyle('margin-left', '201px');
		} else{
			if(window.getWidth() > 1000){
				$('wrapper').setStyle('margin', 'auto');
			}
			if($('wrapper').getCoordinates().left.toInt() <= 200){
				$('wrapper').setStyle('margin-left', '201px');
				return 0;
			}
		}
	}
}); 
	
	
window.addEvent('domready', function() {
 	var liquido = new liquidBox();
});