var WindowSize = Class.create({
    width: window.innerWidth || (window.document.documentElement.clientWidth || window.document.body.clientWidth),
    height: window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight)	
});



var KMegaMenu = Class.create({
	effectduration: 0.3, //duration of animation, in milliseconds
	delaytimer: 200, 	//delay after mouseout before menu should be hidden, in milliseconds
	
	//No need to edit beyond here
	megamenulabels: [],
	megamenus: 		[], //array to contain each block menu instances
	zIndexVal: 		1000, //starting z-index value for drop down menu
	shimobj: 		null,	
	
	initialize: function(){
		
		
	},
	addshim:function(){
	
		$(document.body).insert('<IFRAME id="outlineiframeshim" src="'+(location.protocol=="https:"? 'blank.htm' : 'about:blank')+'" style="display:none; left:0; top:0; z-index:999; position:absolute; filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)" frameBorder="0" scrolling="no"></IFRAME>');
		this.shimobj = $("outlineiframeshim");
	},	
	alignmenu:function(e, megamenu_pos){
		
		var ws = new WindowSize();
		var doc = document.viewport.getScrollOffsets();
		
		var megamenu = this.megamenus[megamenu_pos];
		var anchor   = megamenu.anchorobj;
		var menu	 = megamenu.menuobj;
		
		//alert(ws.width + ' ' + doc.left + ' ' +megamenu.offsetx   +  ' ' + megamenu.actualwidth);
		
		var menuleft = (ws.width -(megamenu.offsetx-doc.left)>megamenu.actualwidth)? megamenu.offsetx : megamenu.offsetx-megamenu.actualwidth+megamenu.anchorwidth; //get x coord of menu

		
		//var menutop=($(window).height()-(megamenu.offsety-$(document).scrollTop()+megamenu.anchorheight)>megamenu.actualheight)? megamenu.offsety+megamenu.anchorheight : megamenu.offsety-megamenu.actualheight
		var menutop	 = megamenu.offsety+megamenu.anchorheight ; //get y coord of menu
		menu.setStyle({left:menuleft+"px", top:menutop+"px"});
		this.shimobj.setStyle({width:megamenu.actualwidth+"px", height:megamenu.actualheight+"px", left:menuleft+"px", top:menutop+"px", display:"block"});
	},
	showmenu:function(e, megamenu_pos){
		
		var megamenu	= this.megamenus[megamenu_pos];
		var menu		= megamenu.menuobj;
		var menuinner	= megamenu.menuinner;
		

		if (!menu.visible()){
	
			this.alignmenu(e, megamenu_pos);
			menu.setStyle({"zIndex" : ++this.zIndexVal});
			
	
			new Effect.Grow(menu,{direction:'top-left', duration: this.effectduration, afterFinish: function(){
				menuinner.setStyle({
					'visibility': 'visible'
				});			
			}.bind(this) });
			
			/*menu.show(this.effectduration, function(){
				menuinner.setStyle({
					'visibility': 'visible'
				});
			})*/
		}
		else if (menu.getStyle("display")=="block" && e.type=="click"){ //if menu is hidden and this is a "click" event (versus "mouseout")
			this.hidemenu(e, megamenu_pos);
		}
		return false
	},
	
	hidemenu:function(e, megamenu_pos){
		var megamenu=this.megamenus[megamenu_pos];
		var menu=megamenu.menuobj;
		var menuinner=megamenu.menuinner;
		menuinner.setStyle({'visibility' : 'hidden'});
		this.shimobj.setStyle({display:"none", left:0, top:0});
		
		
		menu.hide();
		
		/*new Effect.Fold(menu,{direction:'top-left', duration: this.effectduration, afterFinish: function(){
			menuinner.setStyle({
				'visibility': 'hidden'
			});			
		}.bind(this) });*/


	},
	
	definemenu:function(anchorid, menuid, revealtype){
		this.megamenulabels.push([anchorid, menuid, revealtype]);
		
	},
	
	render:function(){
		
		for (var i=0, labels=this.megamenulabels[i]; i<this.megamenulabels.length; i++, labels=this.megamenulabels[i]){

			if (!$(labels[0]) || !$(labels[1])) //if one of the two elements are NOT defined, exist
				continue;
				
			this.megamenus.push({	anchorobj:$(labels[0]), 
									menuobj:$(labels[1]), 
									menuinner:$(labels[1]).select('ul').first() , 
									revealtype:labels[2], 
									hidetimer:null
								});
							
			var megamenu			= this.megamenus[i];
			var dimensions = megamenu.menuobj.getDimensions();		
				
			megamenu.anchorobj.insert(megamenu.menuobj).writeAttribute("_megamenupos", i+"pos"); //remember index of this drop down menu

			megamenu.actualwidth	= dimensions.width;
			megamenu.actualheight	= dimensions.height;

			megamenu.offsetx		= megamenu.anchorobj.cumulativeOffset().left;
			megamenu.offsety		= megamenu.anchorobj.cumulativeOffset().top;
			
			var anchor_dim = megamenu.anchorobj.getDimensions();
			
			megamenu.anchorwidth	= anchor_dim.width;
			megamenu.anchorheight	= anchor_dim.height;
			
			$(document.body).insert(megamenu.menuobj) //move drop down menu to end of document
			megamenu.menuobj.writeAttribute("_megamenupos", i+"pos");
			megamenu.menuobj.setStyle({"zIndex" : ++this.zIndexVal}).hide();
			megamenu.menuinner.setStyle({"visibility": "hidden"});
			
			
		
			
			var _this = this;
			

			megamenu.anchorobj.observe(megamenu.revealtype == "click" ? 'click' : 'mouseenter',function(e){
				var el = Event.element(e);
				var pos = parseInt(el.readAttribute("_megamenupos").replace("pos", ""));
				
				var menuinfo=_this.megamenus[pos];
				clearTimeout(menuinfo.hidetimer); //cancel hide menu timer
				return _this.showmenu(e, pos);					
			});
	

			megamenu.anchorobj.observe('mouseleave',function(e){
				
		
		
				var el 			= Event.element(e);
				var pos 		= parseInt(this.readAttribute("_megamenupos").replace("pos", ""));
				var menuinfo 	= _this.megamenus[pos];
				

				if (e.relatedTarget != menuinfo.menuobj && (!$(e.relatedTarget).up("#"+menuinfo.menuobj.id)) ){


					menuinfo.hidetimer = setTimeout(function(){ //add delay before hiding menu
						_this.hidemenu(e, pos)
					}, _this.delaytimer);
				}				
			},this);

			megamenu.menuobj.observe('mouseenter',function(e){
				var el = Event.element(e);
				
				if (el.tagName == "DIV") {
				
					var pos = parseInt(el.readAttribute("_megamenupos").replace("pos", ""));
					
					var menuinfo = _this.megamenus[pos];
					clearTimeout(menuinfo.hidetimer); //cancel hide menu timer
				}				
			});

			megamenu.menuobj.observe('click',function(e){
				var el = Event.element(e);
				
				if (el.tagName != "DIV") {
					var el = el.up('div.megamenu');	
				}

				if (el) {
				
					var pos = parseInt(el.readAttribute("_megamenupos").replace("pos", ""));
					
					var menuinfo = _this.megamenus[pos];
					menuinfo.hidetimer = setTimeout(function(){ //add delay before hiding menu
						_this.hidemenu(e, pos)
					}, _this.delaytimer);
				}		
			});
			
			megamenu.menuobj.observe('mouseleave',function(e){
				
				var el = Event.element(e);
				
				if (el.tagName != "DIV") {
					var el = el.up('div.megamenu');	
				}	
				
				if (el) {
	
					if(el.readAttribute("_megamenupos")){
						var pos = parseInt(el.readAttribute("_megamenupos").replace("pos", ""));
					
						var menuinfo = _this.megamenus[pos];
						menuinfo.hidetimer = setTimeout(function(){ //add delay before hiding menu
							_this.hidemenu(e, pos)
						}, _this.delaytimer);
					}
				}		
			});			


		} //end for loop
		

		
		if(/Safari/i.test(navigator.userAgent)){ //if Safari
		
			Event.observe(window,'load',function(){
				for (var i=0; i< this.megamenus.length; i++){
					var megamenu = this.megamenus[i];
					var anchorisimg=(megamenu.anchorobj.children().length==1 && megamenu.anchorobj.children().eq(0).is('img'))? megamenu.anchorobj.children().eq(0) : null;
					if (anchorisimg){ //if anchor is an image link, get offsets and dimensions of image itself, instead of parent A
						megamenu.offsetx	= anchorisimg.cumulativeOffset().left;
						megamenu.offsety	= anchorisimg.cumulativeOffset().top;
						megamenu.anchorwidth= anchorisimg.getWidth();
						megamenu.anchorheight=anchorisimg.getHeight();
					}
				}
			}.bind(this));
			
			Event.observe(window,'resize',function(){
				for (var i=0; i<this.megamenus.length; i++){
					var megamenu=this.megamenus[i];
					var anchorisimg=(megamenu.anchorobj.children().length==1 && megamenu.anchorobj.children().eq(0).is('img'))? megamenu.anchorobj.children().eq(0) : null;
					if (anchorisimg){ //if anchor is an image link, get offsets and dimensions of image itself, instead of parent A
						megamenu.offsetx=anchorisimg.offset().left;
						megamenu.offsety=anchorisimg.offset().top;
						megamenu.anchorwidth=anchorisimg.width();
						megamenu.anchorheight=anchorisimg.height();
					}
				}
			}.bind(this));					


		}
		else{
			
			Event.observe(window,'resize',function(){
			
				for (var i=0; i< this.megamenus.length; i++){
					var megamenu= this.megamenus[i];
					
					megamenu.offsetx		= megamenu.anchorobj.cumulativeOffset().left;
					megamenu.offsety		= megamenu.anchorobj.cumulativeOffset().top;

				}
			}.bind(this));

		}

		this.addshim();
	}	
	
	
});