$(document).ready(function(){	
	// Change the image of hoverable images
    $(".imgHoverable").hover( function() {
       var hoverImg = HoverImgOf($(this).attr("src"));
       $(this).attr("src", hoverImg);
    }, function() {
       var normalImg = NormalImgOf($(this).attr("src"));
       $(this).attr("src", normalImg);
    }
   );

});

function HoverImgOf(filename)
{
   var re = new RegExp("(.+)\\.(gif|png|jpg)", "g");
   return filename.replace(re, "$1_2.$2");
}
function NormalImgOf(filename)
{
   var re = new RegExp("(.+)_2\\.(gif|png|jpg)", "g");
   return filename.replace(re, "$1.$2");
}

//preload menu img
var IMAGE_PATHS = [];
IMAGE_PATHS[0] = "images/menu_about_2.jpg";
IMAGE_PATHS[1] = "images/menu_products_2.jpg";
IMAGE_PATHS[2] = "images/menu_qna_2.jpg";
IMAGE_PATHS[3] = "images/menu_articles_2.jpg";
IMAGE_PATHS[4] = "images/menu_cart_2.jpg";
IMAGE_PATHS[5] = "images/menu_contact_2.jpg";

var IMAGE_CACHE = [];

for (var i=0; i<IMAGE_PATHS.length; i++) {
 IMAGE_CACHE[i] = new Image();
 IMAGE_CACHE[i].src = IMAGE_PATHS[i];
}

//main menu
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];
		clearInterval(c.t); c.style.overflow='hidden';
		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}
}();
