/**
 * Singleton class for manageing the submenu switching.
 *
 * @author Benedikt Schaller
 */
var Menu = new function () {

	/**
	 * Holds a time in microseconds, when the last mouseout event from the main menu div was called.
	 */
	this.resetTimeLimit = 0;

	/**
	 * The main div around the menu.
	 */
	this.mainNavDiv = 'navigation_sub';

	/**
	 * The current active menu.
	 */
	this.activeMenu = 'products';
	/**
	 * The menu from the page load.
	 */
	this.loadedMenu = 'products';

	/**
	 * List of all menus.
	 */
	this.submenus = new Array('products', 'services', 'discover', 'about');

	/**
	 * Path to the menu background image folder.
	 */
	this.imgFolder = 'http://www.telit.com/img/';
	//this.imgFolder = '/navi/';

	/**
	 * The background images for the menus.
	 */
	this.submenusImages = new Object();
	this.submenusImages['products'] = 'nav_blue.gif';
	this.submenusImages['services'] = 'blau_infinita.gif';
	this.submenusImages['discover'] = 'nav_red.gif';
	this.submenusImages['about'] = 'orange_new.gif';

	/**
	 * Changes the active menu to the given.
	 *
	 * @author Benedikt Schaller
	 * @param String newActiveMenu
	 */
	this.changeActiveMenu = function (newActiveMenu) {
		menuNameOld = 'submenu_' + this.activeMenu;
		$(menuNameOld).style.display = 'none';
		menuNameNew = 'submenu_' + newActiveMenu;
		$(menuNameNew).style.display = '';
		$(this.mainNavDiv).style.background = 'url(\'' + this.imgFolder + this.submenusImages[newActiveMenu] +
				'\') no-repeat scroll 0pt 0pt transparent';
		this.activeMenu = newActiveMenu;
	};

	/**
	 * Initializes the menu.
	 *
	 * @author Benedikt Schaller
	 * @param String loadedMenu The menu from the page load.
	 */
	this.init = function (loadedMenu) {
		this.activeMenu = loadedMenu;
		this.loadedMenu = loadedMenu;

		for (var i = 0; i < this.submenus.length; i++) {
			// Hide all submenues
			if (this.activeMenu != this.submenus[i]) {
				var menuName = 'submenu_' + this.submenus[i];
				$(menuName).style.display = 'none';
			}

			// set onhover
			mainMenuName = 'mainmenu_' + this.submenus[i];
			Event.observe(mainMenuName, 'mouseover', this.onMenuOver.bindAsEventListener('event', this.submenus[i]));
		}

		Event.observe(this.mainNavDiv, 'mouseover', this.onMainDivOver.bindAsEventListener('event'));
		Event.observe(this.mainNavDiv, 'mouseout', this.onMainDivOut.bindAsEventListener('event'));
	};

	/**
	 * Event that will be called on mouseover from a menu.
	 *
	 * @author Benedikt Schaller
	 * @param Event event The js event.
	 * @param String menuName The name of the called menu.
	 */
	this.onMenuOver = function (event, menuName) {
		var data = $A(arguments);
		data.shift();
		Menu.changeActiveMenu(data[0]);
	};

	/**
	 * Event that will be called on mouseover from the main menu div.
	 * Will just set the reset time limit to 0 so that no reset will happen while browsing menu.
	 *
	 * @author Benedikt Schaller
	 * @param Event event The js event.
	 */
	this.onMainDivOver = function (event) {
		Menu.resetTimeLimit = 0;
	};

	/**
	 * Event that will be called on mouseout from the main menu div.
	 * Will set the reset time limit to the current timestamp, so that there is a time range for the reset.
	 * Will also call the resetMenu function with 2 secs delay.
	 *
	 * @author Benedikt Schaller
	 * @param Event event The js event.
	 */
	this.onMainDivOut = function (event) {
		Menu.resetTimeLimit = new Date().getTime();
		setTimeout('Menu.resetMenu()', 2000);
	};

	/**
	 * Will reset the menu, if the current time lays in following time range: (resetTime + 2000ms) +- 500ms
	 *
	 * @author Benedikt Schaller
	 */
	this.resetMenu = function () {
		now = new Date();
		if (now.getTime() > this.resetTimeLimit + 1500 && now.getTime() < this.resetTimeLimit + 2500) {
			this.changeActiveMenu(this.loadedMenu);
		}
	}
}