123 lines
3.4 KiB
JavaScript
123 lines
3.4 KiB
JavaScript
/* Trigger actions for the menu */
|
|
|
|
/* Initialization */
|
|
var b = document.getElementById('light-menu').getElementsByTagName('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');");
|
|
// Patch for javascript users
|
|
if(b[i].getAttribute('role') != "link") {
|
|
b[i].removeAttribute('href');
|
|
b[i].setAttribute('tabindex', "0");
|
|
}
|
|
}
|
|
|
|
var overlay_active = true;
|
|
|
|
var trigger_menu = function(active) {
|
|
var display = function(element) {
|
|
element.classList.add('opened');
|
|
}
|
|
var hide = function(element) {
|
|
element.classList.remove('opened');
|
|
}
|
|
|
|
var light_menu = document.getElementById('menu');
|
|
var buttons = document.getElementById('light-menu').getElementsByTagName('li');
|
|
var menu = document.getElementById('menu').getElementsByTagName('div');
|
|
var overlay = document.getElementById('overlay');
|
|
|
|
if(active == -1 || buttons[active].classList.contains('opened')) {
|
|
hide(light_menu);
|
|
if(overlay_active) hide(overlay);
|
|
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(menu[i]);
|
|
}
|
|
}
|
|
display(buttons[active]);
|
|
display(menu[active]);
|
|
display(light_menu);
|
|
if(overlay_active) display(overlay);
|
|
}
|
|
}
|
|
|
|
var mouse_trigger = function(event) {
|
|
var menu = document.getElementById('menu');
|
|
var buttons = document.getElementById('light-menu').getElementsByTagName('li');
|
|
|
|
if(!menu.contains(event.target)) {
|
|
var active = -1;
|
|
|
|
for(i = 0; i < buttons.length; i++) {
|
|
if(buttons[i].contains(event.target)) {
|
|
if(buttons[i].getElementsByTagName('a')[0].getAttribute('role') == "button") {
|
|
active = i;
|
|
buttons[i].getElementsByTagName('a')[0].blur();
|
|
}
|
|
else {
|
|
location.assign(buttons[i].getElementsByTagName('a')[0].getAttribute('href'));
|
|
}
|
|
}
|
|
}
|
|
|
|
//alert(active);
|
|
trigger_menu(active);
|
|
}
|
|
}
|
|
|
|
var keyboard_trigger = function(event) {
|
|
var menu = document.getElementById('menu');
|
|
var buttons = document.getElementById('light-menu').getElementsByTagName('li');
|
|
|
|
if(event.keyCode == 13) {
|
|
for(var i = 0; i < buttons.length; i++) {
|
|
if(buttons[i].getElementsByTagName('a')[0].getAttribute('f') == 'true') {
|
|
trigger_menu(i);
|
|
}
|
|
}
|
|
}
|
|
|
|
if(event.keyCode == 27) {
|
|
trigger_menu(-1);
|
|
}
|
|
}
|
|
|
|
document.onclick = mouse_trigger;
|
|
document.onkeypress = keyboard_trigger;
|
|
|
|
|
|
|
|
function xTend() {
|
|
var extend = function(element) {
|
|
element.classList.add('extended');
|
|
}
|
|
var shrink = function(element) {
|
|
element.classList.remove('extended');
|
|
}
|
|
|
|
var light_menu = document.getElementById('light-menu');
|
|
var container = document.getElementById('container');
|
|
var menu = document.getElementById('menu');
|
|
var button = document.getElementById('extend-menu');
|
|
|
|
if(light_menu.classList.contains('extended')) {
|
|
shrink(light_menu);
|
|
shrink(container);
|
|
shrink(menu);
|
|
button.innerHTML = '<svg viewBox="0 0 24 24"><path fill="#ffffff" d="M10,21V19H6.41L10.91,14.5L9.5,13.09L5,17.59V14H3V21H10M14.5,10.91L19,6.41V10H21V3H14V5H17.59L13.09,9.5L14.5,10.91Z"></path></svg> \
|
|
Étendre le menu';
|
|
} else {
|
|
extend(light_menu);
|
|
extend(container);
|
|
extend(menu);
|
|
button.innerHTML = '<svg viewBox="0 0 24 24"><path fill="#ffffff" d="M19.5,3.09L15,7.59V4H13V11H20V9H16.41L20.91,4.5L19.5,3.09M4,13V15H7.59L3.09,19.5L4.5,20.91L9,16.41V20H11V13H4Z"></path></svg> \
|
|
Réduire le menu';
|
|
}
|
|
} |