var animMenu = Class.create({

	
	openedSub: false,

	initialize: function() {

		var Menu = $$(".cw_topitem");
	
		for (var i=0; i<Menu.length; i++) {
			var MenuLink = Menu[i].select('span a img'); 
			for (var j=0; j<MenuLink.length; j++) {
				MenuLink[j].addClassName('cw_itemLink');
				//MenuLink[j].id ='cw_itemLink_'+i;
			}

			
			Event.observe(Menu[i], 'mouseover', function(event) {
				var el = event.element();
				if (el.hasClassName('cw_itemLink')) {
					ob.openSub(el);
				}
			});
		};
	},


	openSub: function(el) {
		if (ob.openedSub != el.id) {
			ob.openedSub = el.id;
			var parents = el.ancestors();
			ob.closeSubs(parents[2]);
			var cols = parents[2].select(".cw_menucol");
			for (var i=0; i<cols.length; i++) {
				var time = 0.3*(i+1);
				new Effect.Move(cols[i], { x: 10 , mode: 'absolute', duration: time});
				cols[i].appear({ duration: time });
			}
		}
		
	},
	
	closeSubs: function(parent) {
		var cols = $$(".cw_menucol");
		for (var i=0; i<cols.length; i++) {
			if (!cols[i].descendantOf(parent)) {
				cols[i].style.display = 'none';
				cols[i].style.left = '-10px';
			}
		}
	}

});


var ob = false;
document.observe("dom:loaded", function() {
	ob = new animMenu();
});