//hMenu controller
var hMenu = new Class({
	
	initialize: function(where, controller)
	{
		
		this.where = where;
		this.c = controller;
		
		this.panels = [];
		this.activeButton = false;
		this.activePanel = false;
	
		this.m = {duration:'normal', transition:'cubic:out', onComplete: function() {this.c.callChain();}.bind(this) };
		
		$$('#' + where + ' .hMenuHandle').each
		(
			function(e)
			{
				this.panels.include(new hMenuHandle(e, this.c));
			}.bind(this)
		);	
		
		$$('.hMenuDefault').each
		(
			function(e)
			{
				new hMenuDefault(e, this.c);
			}.bind(this)
		);
		
	},
	
	setPanel: function(ap)
	{		
		if (this.activePanel)
		{
			this.activePanel.active = false;
			this.activePanel.imgElement.set('src', this.activePanel.vo.out);
		}
		//set the new clicked section
		this.activePanel = ap;
		this.activePanel.active = true;
		this.activePanel.imgElement.set('src', this.activePanel.vo.over);
		
		//close the one(s) which are open
		this.panels.each
		(
			function(p)
			{
				var width = p.panel.getSize().x;
				if(width > p.sizeClosed & this.activePanel != p)
				{
					
					this.c.chain
					(	
						function()
						{ 
							new Fx.Morph(p.panel, this.m ).start({'width': [p.sizeClosed]});
						}.bind(this)
					);		
				}
			}.bind(this)
		);
		
		//open the one which is pressed (if it is not opened already)
		this.panels.each
		(
			function(p)
			{
				var width = p.panel.getSize().x;
				if(width < p.sizeOpened & this.activePanel == p)
				{
					this.c.chain
					(	
						function()
						{ 
							new Fx.Morph(p.panel, this.m ).start({'width': [p.sizeOpened]});
						}.bind(this)
					);		
				}
			}.bind(this)
		);
		
	},
	
	expandAllPanels: function()
	{		
		
		this.activePanel.active = false;
		this.activePanel.imgElement.set('src', this.activePanel.vo.out);
			
		this.activePanel = false;
		//open open all the panels (if it is not opened already)
		this.panels.each
		(
			function(p)
			{
				var width = p.panel.getSize().x;
				if(width < p.sizeOpened)
				{
					this.c.chain
					(	
						function()
						{ 
							new Fx.Morph(p.panel, this.m ).start({'width': [p.sizeOpened]});
						}.bind(this)
					);		
				}
			}.bind(this)
		);
		
	},
	
	setButtonState: function(b)
	{
		this.c.chain
		(	
			function()
			{ 			
				if(this.activeButton)
				{
					this.activeButton.active = false;
					this.activeButton.e.setStyle('color', '#3f3f3f');			
				}
				if (b) 
				{
					this.activeButton = b;
					b.active = true;
					b.e.setStyle('color', '#00b8dc');
				}
				this.c.callChain();
			}.bind(this)
		);	
	}

});


//helper class for hMenu
var hMenuHandle = new Class({	
	
	Extends: Button,
	
	initialize: function(element, controller)
	{
		
		this.setElement(element);
		this.setController(controller, 'hMenuHandleClicked');
		
		this.vo = eval("(" + this.e.get('id') + ")");
		
		this.panel = $('hMenuPanel_' + this.vo.id);
		//this.panel = this.e.getParent().getParent().getParent().getParent().getParent();;
		//alert(this.panel);
	
		this.content = $$("#hMenuPanel_"+this.vo.id+" .hMenuContent")[0];
		//this.content = this.e.getNext();
		
		this.sizeClosed = this.e.getSize().x;
		this.sizeOpened = 200;//this.content.getSize().x;
		//alert(this.content);
		
		this.e.setStyle('min-height', '100px');
		var h = this.content.getSize().y;
		//this.e.setStyle('height', h + 180);
		//this.panel.setStyle('height', h + 180);
		
		this.imgElement =  new Element('img',{'src': this.vo.out}); 	
		this.imgElement.inject(this.e);
			
		this.active = false; 	
		
		//init panel buttons
		this.content.getElements('li').each
		(
			function(e)
			{
				new hMenuButton(e, this.c, this);
			}.bind(this)
		);	
		
	},
	
	doMouseover: function()
	{
		if (!this.active)
		{
			this.e.style.cursor = 'pointer';
			this.imgElement.set('src', this.vo.over);
		}
	},
	
	doMouseout: function()
	{
		if (!this.active)
		{
			this.e.style.cursor = 'default';
			this.imgElement.set('src', this.vo.out);
		}
	}
		
});


//helper class for hMenu
var hMenuButton = new Class({	
	
	Extends: Button,
	
	initialize: function(element, controller, handle)
	{
		this.setElement(element);
		this.setController(controller,'hMenuButtonClicked');
		this.handle = handle;
		this.vo = eval("(" + this.e.get('id') + ")");
		this.active = false; 	
	},
	
	doMouseover: function()
	{
		if (!this.active)
		{
			this.e.style.cursor = 'pointer';
			this.e.setStyle('color','#00b8dc')
		}
	},
	
	doMouseout: function()
	{
		if (!this.active)
		{
			this.e.style.cursor = 'default';
			this.e.setStyle('color','#3f3f3f')
		}
	}
});

//helper class for hMenu
var hMenuDefault = new Class({	
	
	Extends: Button,
	
	initialize: function(element, controller)
	{
		this.setElement(element);
		this.setController(controller, 'hMenuDefaultClicked');
	}
	
	
});