var responseLogoutData = '';
var logoutVisibility = '';
var menuTimeout = '';

document.observe ("dom:loaded", function() {

	if ($('nav') && $('nav-main')) {
		/* Change label of mode selector */
		if ($('nav-main').select('.active span')[0]) {
			var currentModeTextElem = $('nav-main').select('.active span')[0].cloneNode(true);
		}

		if (currentModeTextElem && $('context-button-lbl')) {
			var currentModeText = currentModeTextElem.innerHTML;

			if (currentModeText.length > 18) {
				currentModeTextElem.setAttribute('title', currentModeText);
				currentModeTextElem.update(currentModeText.truncate(18, '...'));
				$('context-button-lbl').update(currentModeTextElem);
			} else {
				$('context-button-lbl').update(currentModeTextElem);
			}
		}

		/* Hide main menu if there are no main menu items */
		if ($('nav-main').down('ul') === undefined) {
			$('nav-main-trigger').remove();
		}
	}

	/* Open mode selector */
	openCloseMenu($('nav-main-trigger'));

	/* Funky form higlighting */
	var searchField = $('searchfield');
	if (searchField) {
		searchField.observe('focus', function() {
			$('quick-search').addClassName('hasfocus');
		});
		searchField.observe('blur', function() {
			$('quick-search').removeClassName('hasfocus');
		});
	}

	/* Logout snippet */
	if($('logout-link')) {

		document.observe('click', function(e){
			// stop the default action of the logout-link
			if (e.element() == $('logout-link')) {
				Event.stop(e);
			}

			// create logoutpanel if it doesnt exist and load content
			if (responseLogoutData == '') {
				if (!$('logout-panel') && e.element() == $('logout-link')) {
					getLogoutData();
					logoutVisibility = 'visible';
				}
			} else {
				// show the panel if data is loaded
				if (e.element() == $('logout-link') && logoutVisibility == 'hidden') {
					$('logout-panel').show();
					logoutVisibility = 'visible';
				} else if (((!e.element().descendantOf('logout-panel') && e.element() != $('logout-panel')) || e.element() == $('logout-link') || e.element() == $('cancel-logout')) && logoutVisibility == 'visible') {
					// hide the panel if the user clicks outside the area of the logoutpanel
					$('logout-panel').hide();
					logoutVisibility = 'hidden';
				}
			}
		});

		Event.observe(document, 'keypress', function(event){
			if ($('logout-panel') && logoutVisibility == 'visible') {
				if (event.keyCode == Event.KEY_ESC) {
					$('logout-panel').hide();
					logoutVisibility = 'hidden';
				}
			}
		});
	}
});

function getLogoutData() {
	new Ajax.Request(PbLib.getNewURI('c/pageByAlias/logout'), {
		method: 'get',
		onComplete: function(resp){
			var span = new Element('span', {'id': 'cancel-logout'});
			var spanText = document.createTextNode('Cancel');
			span.appendChild(spanText);

			responseLogoutData = resp.responseText;
			$('container').insert('<div id="logout-panel" style="display: none;"><div id="logout-panel-content"></div></div>');
			$('logout-panel-content').update(responseLogoutData);

			if ($('logout-panel-content').select('button.cancel')) {
				$('logout-panel-content').select('button.cancel').invoke('remove');
				$('logout-panel-content').select('div.fieldinput')[1].appendChild(span);
			}
			if ($('cancel')) {
				$('cancel').remove();
				$('logout-panel-content').select('div.fieldinput')[2].appendChild(span);
			}
			$('logout-panel').show();
		},
		onFailure: function(resp){
			alert("Oops, there's been an error. (Eg. no logout-page mounted or server is down)");
		}
	});
}

function openCloseMenu (element) {
	if (!element) {
		return;
	}
	element.removeClassName('no-js');
	element.observe('mouseenter', function(e) {
		if (typeof menuTimeout == "number") {
			window.clearTimeout(menuTimeout);
			delete menuTimeout;
		}
		menuTimeout = Element.addClassName.delay(0.2, this, 'open');
	});
	element.observe('mouseleave', function(e) {
		if (typeof menuTimeout == "number") {
			window.clearTimeout(menuTimeout);
			delete menuTimeout;
		}
		menuTimeout = Element.removeClassName.delay(0.4, this, 'open');
	});
}