
/**
 * This class will make the folding of the left side menu
 * and it will also makes the arrow slide in
 */

var LeftMenu = Class.create({
	
	roots: null,
	
	initialize: function()
	{
		var left = $('leftMenu');
		if (!left) return;
		var menuItems = left.getElementsByClassName('menuItem');
		if (menuItems.length == 0) {
			left.remove();
		}
		
		for (var i = 0; i < menuItems.length; i++) {
			var item = $(menuItems[i]);
			this.addEvents(item);
		}
	},
	
	addEvents: function(item)
	{
		var subsCol = item.getElementsByClassName('subs');
		var subs = $(subsCol[0]);
		var subMenus = subs.getElementsByClassName('submenu');
		
		if (subMenus.length == 0) return;
		
		for (var i = 0; i < subMenus.length; i++) {
			var s = subMenus[i];
			//this.addSubEvents(s);
		}
		
		item.observe('mouseover', function(){
			//this.slideArrow($(item));
			subs.addClassName('show');
		}.bind(this));
		item.observe('mouseout', function(){
			subs.removeClassName('show');
		}.bind(this));
	},
	
	addSubEvents: function(item)
	{
		console.info(item);
		item.observe('mouseover', function(){
			this.slideArrow($(item));
			subs.addClassName('show');
		}.bind(this));
		item.observe('mouseout', function(){
			subs.removeClassName('show');
		}.bind(this));
	},
	
	startSlide: function(arrow, i, w)
	{
		var cS = $(arrow).getStyle('backgroundPosition');
		
		$(arrow).setStyle({
			'backgroundPosition': '-' + i + 'px'
		});
		
		if (i == 0 || cS == '0px 50%') {
			window.clearInterval(w);
		}
	},
	
	slideArrow: function(root)
	{
		var a = ( $(root).getElementsByClassName('menu') )[0];
		var arrow = ( $(a).getElementsByClassName('arrow') )[0];
		
		var w;
		
		var i = 9;
		
		w = window.setInterval(function(){
			i--;
			this.startSlide(arrow, i, w);
		}.bind(this), 20);
	},
	
	clearSlide: function(root)
	{
		var a = ( $(root).getElementsByClassName('menu') )[0];
		var arrow = ( $(a).getElementsByClassName('arrow') )[0];
		$(arrow).setStyle({
			'backgroundPosition': '-9px'
		});
	}
	
});

var lm;

Event.observe(window, 'load', function(){
	
	lm = new LeftMenu();
	
});