﻿var menu=function(){
	var t=15,z=50,s=6,a;
	function dd(n){this.n=n; this.h=[]; this.c=[]}
	dd.prototype.init=function(p,c){
		a=c; var w=document.getElementById(p), s=w.getElementsByTagName('ul'), l=s.length, i=0;
		for(i;i<l;i++){
			var h=s[i].parentNode; this.h[i]=h; this.c[i]=s[i];
			h.onmouseover=new Function(this.n+'.st('+i+',true)');
			h.onmouseout=new Function(this.n+'.st('+i+')');
		}
	}
	dd.prototype.st=function(x,f){
		var c=this.c[x], h=this.h[x], p=h.getElementsByTagName('a')[0], img=h.getElementsByTagName('img')[0];
		clearInterval(c.t); c.style.overflow='hidden';
		//menuPicChange(img, f);
		if(f){
			p.className+=' '+a;
			if(!c.mh){c.style.display='block'; c.style.height=''; c.mh=c.offsetHeight; c.style.height=0}
			if(c.mh==c.offsetHeight){c.style.overflow='visible'}
			else{c.style.zIndex=z; z++; c.t=setInterval(function(){sl(c,1)},t)}
		}else{p.className=p.className.replace(a,''); c.t=setInterval(function(){sl(c,-1)},t)}
	}
	function sl(c,f){
		var h=c.offsetHeight;
		if((h<=0&&f!=1)||(h>=c.mh&&f==1)){
			if(f==1){c.style.filter=''; c.style.opacity=1; c.style.overflow='visible'}
			clearInterval(c.t); return
		}
		var d=(f==1)?Math.ceil((c.mh-h)/s):Math.ceil(h/s), o=h/c.mh;
		c.style.opacity=o; c.style.filter='alpha(opacity='+(o*100)+')';
		c.style.height=h+(d*f)+'px'
	}
	return{dd:dd}
}();

function menuPicChange(element, isOver){
	if(element){
		var srcPath = element.src;
		if(element.className.indexOf('currentChannel')<0){
			if(isOver){
				srcPath = srcPath.substring(0, srcPath.lastIndexOf(".jpg"));
				element.src = srcPath + "_over.jpg";
			}else{
				srcPath = srcPath.substring(0, srcPath.lastIndexOf("_over.jpg"));
				element.src = srcPath + ".jpg";
			}
		}
	}
}

function showMenuBlock(selectedId){
	$$("div.blockContent").each(function(element){
		if(selectedId + 'Block' != element.id){
			$(element).hide();
		}else{
			$(element).show();
		}
	});
}

function showMenuItem(menuId, event){
	
	ofset = $('item_' + menuId).cumulativeOffset();
	//use px as default
	var width = $('item_' + menuId).getStyle('width');
	var height = $('item_' + menuId).getStyle('height');
	width = parseInt(width.substring(0, width.lastIndexOf("px")));
	height = parseInt(height.substring(0, height.lastIndexOf("px")))
	rightposition = ofset[0] + width;
	bottomposition = ofset[1] + height;

	x = Event.pointerX(event);
	y = Event.pointerY(event);

	if (x > ofset[0] && x < rightposition && y > ofset[1]
			&& y < bottomposition) {
		if($('opacityLayer_' + menuId).getStyle('height') == '0px'){
			new Effect.Morph('opacityLayer_' + menuId, {
				style: 'height: 220px;opacity: 0.5;', 
				duration: 0.3
			});
			new Effect.Appear('middleImg_' + menuId, {
				duration: 0.3,
				delay: 0.3
			});
			$('snapShot_' + menuId).hide();
		}
	}
}

function hideMenuItem(menuId, event) {
	ofset = $('opacityLayer_' + menuId).cumulativeOffset();
			// use px as default
	var width = $('opacityLayer_' + menuId).getStyle('width');
	var height = $('opacityLayer_' + menuId).getStyle('height');
	width = parseInt(width.substring(0, width.lastIndexOf("px")));
	height = parseInt(height.substring(0, height.lastIndexOf("px")))
	rightposition = ofset[0] + width;
	bottomposition = ofset[1] + height;

	x = Event.pointerX(event);
	y = Event.pointerY(event);
			
	if (x < ofset[0] || x > rightposition || y < ofset[1] || y > bottomposition) {
		if($('opacityLayer_' + menuId).getStyle('height') == '220px'){
			new Effect.Fade('middleImg_' + menuId,{
				duration: 0.3
			});
			new Effect.Morph('opacityLayer_' + menuId, {
				style: 'height: 0px;opacity: 0;', 
				duration: 0.3,
				delay: 0.3
			});
			$('snapShot_' + menuId).show();
		}
	}
}

