// ###################
// ###### MENU BUILDER
// ###################
//
// TODO: Improve IE compatibility.

/*
@source: http://www.cajaume.org/menuBuilder.js

@licstart  The following is the entire license notice for the 
    JavaScript code in this page.

    Copyright (C) 2011  www.cajaume.org

    The JavaScript code in this page is free software: you can
    redistribute it and/or modify it under the terms of the GNU
    General Public License (GNU GPL) as published by the Free Software
    Foundation, either version 3 of the License, or (at your option)
    any later version.  The code is distributed WITHOUT ANY WARRANTY;
    without even the implied warranty of MERCHANTABILITY or FITNESS
    FOR A PARTICULAR PURPOSE.  See the GNU GPL for more details.

    As additional permission under GNU GPL version 3 section 7, you
    may distribute non-source (e.g., minimized or compacted) forms of
    that code without the copy of the GNU GPL normally required by
    section 4, provided you include this license notice and a URL
    through which recipients can access the Corresponding Source.

@licend  The above is the entire license notice
    for the JavaScript code in this page.
*/

var menuBuilder = function()
{
	this.menu = undefined;
	this.list = undefined;
	this.options = new Array();
	this.prevOption = undefined;
	this.currentOption = undefined;
	this.sections = ['INTERV', 'INSTAL', 'TRIDI', 'BIDI', 'DIBUIX', 'PROJECTES', 'CURRICULUM'];
}

// Create new menu and set its id attribute to id.
menuBuilder.prototype.createMenu = function(id)
{
	this.menu = document.createElement("div")
	this.menu.setAttribute("id", id);
	this.menu.setAttribute("class", "context_menu");
	this.menu.style.padding = 0;
	this.menu.style.margin = 0;
	this.menu.style.backgroundColor = "white";

	this.list = document.createElement("ul");

	this.menu.appendChild(this.list);
	this.menu.style.listStyleType = "none";
	window.document.getElementById("menu").appendChild(this.menu);
}

// Create a menu option inside parent_id, set its id, make it a button, a menu or hr, and set its title (or inner HTML).
menuBuilder.prototype.createMenuOption = function(parent_id, id, type, title)
{
	var list_item = document.createElement("li");

	list_item.style.marginLeft = "auto";
	list_item.style.marginRight = "auto";
	list_item.style.marginTop = "4px";
	list_item.style.marginBottom = "4px";

	list_item.style.padding = "5px";
	list_item.style.backgroundColor = "#ebebeb";
	list_item.style.textAlign = "center";
	list_item.style.cursor = "pointer";
	list_item.style.color = "#2A2A2A";
	list_item.appendChild(document.createTextNode(title));

	this.list.style.width = "100%";
	this.list.style.fontSize = "8px";
	this.list.style.fontFamily = "'Verdana', 'Arial', sans-serif";
	this.list.style.listStyleType = "none";
	this.list.style.textAlign = "center";
	this.list.style.padding = 0;
	this.list.style.margin = 0;
	this.list.style.cursor = "pointer";
	this.list.appendChild(list_item);
}

// Execute a function when an event (click, mouseover, etc.) is triggered by the specified option.
menuBuilder.prototype.createEventHandler = function(menu_id, option, handler, funct)
{
	if (window.attachEvent)
	{
		this.list.getElementsByTagName("li")[option].attachEvent(handler, funct);
	}
	else if (window.addEventListener)
	{
		var subs = handler.substring(2, handler.length);
		this.list.getElementsByTagName("li")[option].addEventListener(subs, funct, false);
	}
}

menuBuilder.prototype.rollover = function(option, event)
{	
	this.currentOption = this.list.getElementsByTagName("li")[option];
	if (event == "mouseover")
	{
		this.currentOption.style.backgroundColor = "#c7f6fe";
	}
	else if (event == "mouseout")
	{
		if (this.selectedOption)
		{
			if (this.currentOption.innerHTML !== this.selectedOption.innerHTML)
			{
				this.currentOption.style.backgroundColor = "#ebebeb";
			}
		}
		else
		{
			this.currentOption.style.backgroundColor = "#ebebeb";
		}
	}
}

menuBuilder.prototype.highlight = function(option)
{
	if (this.selectedOption !== undefined)
	{
		this.prevOption = this.selectedOption;
		this.prevOption.style.backgroundColor = "#ebebeb";
	}
	this.selectedOption = this.menu.getElementsByTagName("ul")[0].getElementsByTagName("li")[option];
	this.selectedOption.style.backgroundColor = "#c7f6fe";

	for (var i = 0; i < this.sections.length; i++)
	{
		if (this.selectedOption.innerHTML.indexOf(this.sections[i]) != -1)
		{
			ajaxConnect("dbquery.php", "mode=DESC&tipo=" + this.sections[i] + "&lang=catocc");
			break;
		}
	}
}

// #############
// #### HANDLERS
// #############

var menu;

// CONTEXT MENU HANDLER

handleEvent(window, "load", function()
{
	menu = new menuBuilder();

	// AVAILABLE FUNCTIONS
	// createMenu(id) -> Create new menu and set its id attribute to id.
	// createMenuOption(parent_id, id, type, title) -> Create a menu option inside parent_id, set its id, make it a button, a menu or hr, and set its title (or inner HTML).
	// createEventHandler(menu_id, option, handler, funct) -> Execute a function when an event (click, mouseover, etc.) is triggered by the specified option.

	// MAIN MENU
	menu.createMenu("main_menu");
		menu.createMenuOption("main_menu", 0, "button", "INTERVENCIONS");
			menu.createEventHandler("main_menu", 0, "onclick", function()
			{
				menu.highlight(0);
			});
			menu.createEventHandler("main_menu", 0, "onmouseover", function()
			{
				menu.rollover(0, arguments[0].type);
			});
			menu.createEventHandler("main_menu", 0, "onmouseout", function()
			{
				menu.rollover(0, arguments[0].type);
			});
			menu.createEventHandler("main_menu", 0, "ondblclick", function()
			{
				if (arguments[0].preventDefault)
				{
					arguments[0].preventDefault();
				}
				if (window.event)
				{
					alert(arguments[0].type);
					window.event.returnValue = false;
				}
			});
		menu.createMenuOption("main_menu", 1, "button", "INSTAL.LACIONS");
			menu.createEventHandler("main_menu", 1, "onclick", function()
			{
				menu.highlight(1);
			});
			menu.createEventHandler("main_menu", 1, "onmouseover", function()
			{
				menu.rollover(1, arguments[0].type);
			});
			menu.createEventHandler("main_menu", 1, "onmouseout", function()
			{
				menu.rollover(1, arguments[0].type);
			});
		menu.createMenuOption("main_menu", 2, "button", "TRIDIMENSIONAL");
			menu.createEventHandler("main_menu", 2, "onclick", function()
			{
				menu.highlight(2);
			});
			menu.createEventHandler("main_menu", 2, "onmouseover", function()
			{
				menu.rollover(2, arguments[0].type)
			});
			menu.createEventHandler("main_menu", 2, "onmouseout", function()
			{
				menu.rollover(2, arguments[0].type)
			});
		menu.createMenuOption("main_menu", 3, "button", "BIDIMENSIONAL");
			menu.createEventHandler("main_menu", 3, "onclick", function()
			{
				menu.highlight(3);
			});
			menu.createEventHandler("main_menu", 3, "onmouseover", function()
			{
				menu.rollover(3, arguments[0].type)
			});
			menu.createEventHandler("main_menu", 3, "onmouseout", function()
			{
				menu.rollover(3, arguments[0].type)
			});
		menu.createMenuOption("main_menu", 4, "button", "DIBUIX");
			menu.createEventHandler("main_menu", 4, "onclick", function()
			{
				menu.highlight(4);
			});
			menu.createEventHandler("main_menu", 4, "onmouseover", function()
			{
				menu.rollover(4, arguments[0].type)
			});
			menu.createEventHandler("main_menu", 4, "onmouseout", function()
			{
				menu.rollover(4, arguments[0].type)
			});
		menu.createMenuOption("main_menu", 5, "button", "PROJECTES");
			menu.createEventHandler("main_menu", 5, "onclick", function()
			{
				menu.highlight(5);
			});
			menu.createEventHandler("main_menu", 5, "onmouseover", function()
			{
				menu.rollover(5, arguments[0].type);
			});
			menu.createEventHandler("main_menu", 5, "onmouseout", function()
			{
				menu.rollover(5, arguments[0].type);
			});
/*
		menu.createMenuOption("main_menu", 6, "button", "CURRICULUM");
			menu.createEventHandler("main_menu", 6, "onclick", function()
			{
				menu.highlight(6);
			});
			menu.createEventHandler("main_menu", 6, "onmouseover", function()
			{
				menu.rollover(6, arguments[0].type)
			});
			menu.createEventHandler("main_menu", 6, "onmouseout", function()
			{
				menu.rollover(6, arguments[0].type)
			});
*/
});