2020-04-27 17:42:40 +00:00
|
|
|
(function (window, document) {
|
|
|
|
|
|
|
|
var layout = document.getElementById('layout'),
|
|
|
|
menu = document.getElementById('menu'),
|
2020-05-16 18:09:14 +00:00
|
|
|
menuLink = document.getElementById('menuLink');
|
2020-04-27 17:42:40 +00:00
|
|
|
|
|
|
|
function toggleClass(element, className) {
|
|
|
|
var classes = element.className.split(/\s+/),
|
|
|
|
length = classes.length,
|
|
|
|
i = 0;
|
|
|
|
|
2020-05-16 03:53:27 +00:00
|
|
|
for (; i < length; i++) {
|
2020-05-16 18:09:14 +00:00
|
|
|
if (classes[i] === className) {
|
|
|
|
classes.splice(i, 1);
|
|
|
|
break;
|
|
|
|
}
|
2020-04-27 17:42:40 +00:00
|
|
|
}
|
|
|
|
// The className is not found
|
|
|
|
if (length === classes.length) {
|
|
|
|
classes.push(className);
|
|
|
|
}
|
|
|
|
|
|
|
|
element.className = classes.join(' ');
|
|
|
|
}
|
|
|
|
|
|
|
|
function toggleAll(e) {
|
|
|
|
var active = 'active';
|
|
|
|
|
|
|
|
e.preventDefault();
|
|
|
|
toggleClass(layout, active);
|
|
|
|
toggleClass(menu, active);
|
|
|
|
toggleClass(menuLink, active);
|
|
|
|
}
|
2020-05-16 03:53:27 +00:00
|
|
|
|
|
|
|
function handleEvent(e) {
|
|
|
|
if (e.target.id === menuLink.id) {
|
|
|
|
return toggleAll(e);
|
|
|
|
}
|
|
|
|
|
2020-04-27 17:42:40 +00:00
|
|
|
if (menu.className.indexOf('active') !== -1) {
|
2020-05-16 03:53:27 +00:00
|
|
|
return toggleAll(e);
|
2020-04-27 17:42:40 +00:00
|
|
|
}
|
2020-05-16 03:53:27 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
document.addEventListener('click', handleEvent);
|
2020-04-27 17:42:40 +00:00
|
|
|
|
|
|
|
}(this, this.document));
|