function offset(el) { 
	var x = el.offsetLeft;
	var y = el.offsetTop;
	for (e = el.offsetParent; e; e = e.offsetParent) {
		x += e.offsetLeft;
		y += e.offsetTop;
	}
	return {'left':x , 'top':y};
} 

var menusHash = new Array();
function getMenu(id) {
	return menusHash[id];
}

function closeAll(cur) {
	for (var m in menusHash) {
		if (m != cur.id) {
			if (menusHash[m].items.length > 0) {
				var menub = document.getElementById(m);
				menub.style.display="none";
			}
		}
	}
}

function MenuItem(title,id,lien) {
	this.title = title;
	this.id = id;
	this.lien = lien?lien:"#";
	this.items = new Array();
	this.links = new Array();
	this.width = 100;
	this.canClose = false;
	this.timer = "";
	menusHash[id] = this;
}

MenuItem.prototype.addItem = function(name,link) {
	this.items[this.items.length] = name;
	this.links[this.links.length] = link;
}

MenuItem.prototype.setWidth = function(w) {
	this.width = w;
}

function tdOver(elem) {
	elem.className="over";
}

function tdOut(elem) {
	elem.className="out";
}

function tdClick(link) {
	open(link,"_self");
}

MenuItem.prototype.toString = function() {
	var str = '<a href="'+this.lien+'" onmouseover="getMenu(\''+this.id+'\').open(this)" onmouseout="getMenu(\''+this.id+'\').close(false)">'+this.title+'</a> ';
	return str;
}

MenuItem.prototype.buildDiv = function() {
	var str = '';
	if (this.items.length > 0) {
		str += '<div id="'+this.id+'" style="top:10px;left:0px;position:absolute;width:'+this.width+'px;display:none">';
		str += '<table class="menuHead" onmouseover="getMenu(\''+this.id+'\').canClose=false" onmouseout="getMenu(\''+this.id+'\').close(false)">';
		for (var i=0 ; i < this.items.length ; i++) {
			str += '<tr><td class="out" onmouseout="tdOut(this)" onmouseover="tdOver(this)" onclick="tdClick(\''+this.links[i]+'\')">'+this.items[i]+'</td></tr>';
		}
		str += '</table>';
		str += '</div>';
	}
	return str;
}

MenuItem.prototype.open = function(elem) {
	closeAll(this);
	clearTimeout(this.timer);
	if (this.items.length > 0) {
		this.canClose = false;
		var menu = document.getElementById(this.id);
		var off = offset(elem);
		menu.style.left=off['left'];
		menu.style.top=elem.offsetHeight+off['top']+7;
		menu.style.display="block";
	}
}

MenuItem.prototype.close = function(close) {
	if (this.items.length > 0) {
		if (close) {
			if (this.canClose) {
				var mm = document.getElementById(this.id);
				mm.style.display="none";
			}
		} else {
			this.canClose = true;
			this.timer = setTimeout('getMenu("'+this.id+'").close(true)',2000);
		}
	}
}

function Menu() {
	this.menus = new Array();
}

Menu.prototype.add = function(m) {
	this.menus[this.menus.length] = m;
}

Menu.prototype.toString = function() {
	var str = '';
	for (var i=0 ; i < this.menus.length ; i++) {
		if (i != 0)
			str += ' | ';
		str += this.menus[i].toString();
	}
	return str;
}

Menu.prototype.initDivs = function() {
	var str = '';
	for (var i=0 ; i < this.menus.length ; i++) {
		str += this.menus[i].buildDiv();
	}
	return str;
}


var leMenu = new Menu();

var sousMenu = new MenuItem("Home","home","/pages/home/home.php");
leMenu.add(sousMenu);

sousMenu = new MenuItem("Galerie","galerie","/pages/galerie/accueilGalerie.php");
sousMenu.setWidth(140);
sousMenu.addItem("3D","/pages/galerie/galerie.php?type=synthese");
sousMenu.addItem("Digital","/pages/galerie/galerie.php?type=photoshop");
sousMenu.addItem("Traditionnel","/pages/galerie/galerie.php?type=dessin");
leMenu.add(sousMenu);

sousMenu = new MenuItem("Tutorials","tutorials","/pages/tutorial/accueilTutorial.php");
leMenu.add(sousMenu);

sousMenu = new MenuItem("Making of","makingof","/pages/makingof/accueilMakingof.php");
leMenu.add(sousMenu);

sousMenu = new MenuItem("Liens","liens","/pages/liens/liens.php");
leMenu.add(sousMenu);

sousMenu = new MenuItem("Qui est qui ?","contact","/pages/contact/contact.php");
leMenu.add(sousMenu);