var Sidemenu = {
  menuItemHeight: 20,
  menuItemsPadding: 20,
  padding: 0,
  speed: 5,
  delay: 20,
  expanded: null,
  images: [],
  
  click: function(event) {
  		var element = event.data.obj;
		var parent = event.data.parent;
		var subitemDiv = event.data.subitems; 
		
		if((subitemDiv.style.height == '0px' || subitemDiv.style.height == 0) && !$(subitemDiv).hasClass("menuOpen")) {
			Sidemenu.showMenu(subitemDiv);
		}  else {
			Sidemenu.hideMenu(subitemDiv);
			$(subitemDiv).removeClass("menuOpen");
		}
		
		
	},
	
	mouseover: function(event) {
	$(event.data.obj).css("backgroundImage", "url('/images/menu/" + event.data.number + "b.png')");
	},
	
	mouseout: function(event) {
	$(event.data.obj).css("backgroundImage", "url('/images/menu/" + event.data.number + "a.png')");
	},

	hideMenu: function(element) {
	$(element).parent().find("div.triangle").hide();
		 $(element).animate({ height: 0, paddingTop: 0, paddingBottom: 0}, 'slow');
		 if(Sidemenu.expanded == element) 
		 	Sidemenu.expanded = null;
	},
	
	showMenu: function(element) {
	$(element).parent().find("div.triangle").show();
	var limit = Sidemenu.menuItemHeight * $(element).find('div.menuSubitem').size() + Sidemenu.menuItemsPadding * 2;

		 $(element).animate({ height: limit, paddingTop: Sidemenu.padding, paddingBottom: Sidemenu.padding }, 'slow');
		 
		 if(Sidemenu.expanded != null)
		 	Sidemenu.hideMenu(Sidemenu.expanded);
		 Sidemenu.expanded = element;
	}
}

$(document).ready(function() {
		
		tmp = $('div.menuTab');
		
		for(i = 0; i < $(tmp).size(); i++) {
			var obj = tmp[i];
			$(obj).css("backgroundImage", "url('/images/menu/do" + (i + 1) + "a.png')");
			Sidemenu.images[i] = $("<img>", {
	  		"src": "/images/menu/" + (i + 1) + "b.png"
	  		})[0];
		}
		
		var tmpp = $('div.menuTitle');
		for(i = 0; i < $(tmpp).size(); i++) {
			var obj = tmpp[i];
			$(obj).css("backgroundImage", "url('/images/menu/" + (i + 1) + "a.png')");
			
			var tmp = {number: (i + 1), obj: obj, parent: $(obj).parent(), subitems: $(obj).parent().find("div.menuSubitems").get(0)}
			
			$(obj).bind("mouseover", tmp, Sidemenu.mouseover);
			$(obj).bind("mouseout", tmp, Sidemenu.mouseout);
			$(obj).bind("click", tmp, Sidemenu.click);
		}
		
		
		if($('div.menuOpen').size() > 0) Sidemenu.expanded = $('div.menuOpen').get(0);
	});