PCv5/app/static/scripts/trigger_menu.js

/* Trigger actions for the menu */

/* Initialization */
var b = document.querySelectorAll('#light-menu a');
for(var i = 1; i < b.length; i++) {
	b[i].setAttribute('onfocus', "this.setAttribute('f', 'true');");
	b[i].setAttribute('onblur', "this.setAttribute('f', 'false');");
	b[i].removeAttribute('href');
	console.log("Removed");
}

var trigger_menu = function(active) {
	var display = function(element) {
		element.classList.add('opened');
	}
	var hide = function(element) {
		element.classList.remove('opened');
	}

	var menu = document.querySelector('#menu');
	var buttons = document.querySelectorAll('#light-menu li');
	var menus = document.querySelectorAll('#menu > div');

	if(active == -1 || buttons[active].classList.contains('opened')) {
		hide(menu);
		for(i = 0; i < buttons.length; i++) {
			hide(buttons[i]);
		}
	}
	else {
		for(i = 0; i < buttons.length; i++) {
			if(i != active) {
				hide(buttons[i]);
				hide(menus[i]);
			}
		}
		display(buttons[active]);
		display(menus[active]);
		display(menu);
	}
}

var mouse_trigger = function(event) {
	var menu = document.querySelector('#menu');
	var buttons = document.querySelectorAll('#light-menu li');

	if(!menu.contains(event.target)) {
		var active = -1;

		for(i = 0; i < buttons.length; i++) {
			if(buttons[i].contains(event.target))
				active = i;
			buttons[i].querySelector('a').blur();
		}

		trigger_menu(active);
	}
}

var keyboard_trigger = function(event) {
	var menu = document.getElementById('menu');
	var buttons = document.querySelectorAll('#light-menu li');

	if(event.keyCode == 13) {
		for(var i = 0; i < buttons.length; i++) {
			if(buttons[i].querySelector('a').getAttribute('f') == 'true') {
				trigger_menu(i);
			}
		}
	}
}

document.onclick = mouse_trigger;
document.onkeypress = keyboard_trigger;