nightTab/js/menu.js

108 lines
2.3 KiB
JavaScript
Raw Normal View History

var menu = (function() {
2019-01-04 17:24:05 +01:00
var _bind = function() {
var allMenuNavButton = helper.eA(".menu-nav-button");
2019-01-14 19:22:39 +01:00
var menuClose = helper.e(".menu-close");
2019-01-04 17:24:05 +01:00
allMenuNavButton.forEach(function(arrayItem, index) {
arrayItem.addEventListener("click", function() {
_tab(this);
}, false);
});
2019-01-14 19:22:39 +01:00
menuClose.addEventListener("click", function() {
close();
shade.destroy();
page.update();
2019-01-14 19:22:39 +01:00
}, false);
2019-01-04 17:24:05 +01:00
};
var _scrollToTop = function() {
if (window.innerWidth < 550) {
helper.e(".menu-area").scrollTop = 0;
} else {
helper.e(".menu-content").scrollTop = 0;
};
};
2019-01-04 17:24:05 +01:00
var _tab = function(button) {
var allMenuNavButton = helper.eA(".menu-nav-button");
2019-01-04 20:40:49 +01:00
var allMenuContentArea = helper.eA(".menu-content-area");
2019-01-04 17:24:05 +01:00
var target = helper.e(button.dataset.target);
allMenuNavButton.forEach(function(arrayItem, index) {
helper.removeClass(arrayItem, "active");
});
2019-01-04 20:40:49 +01:00
allMenuContentArea.forEach(function(arrayItem, index) {
helper.addClass(arrayItem, "is-hidden");
2019-01-04 17:24:05 +01:00
});
helper.addClass(button, "active");
2019-01-04 20:40:49 +01:00
helper.removeClass(target, "is-hidden");
_scrollToTop();
2019-01-04 17:24:05 +01:00
};
var close = function() {
2019-02-03 15:36:40 +01:00
helper.setObject({
object: state.get(),
path: "menu",
newValue: false
});
render();
};
var open = function() {
_scrollToTop();
2019-02-03 15:36:40 +01:00
helper.setObject({
object: state.get(),
path: "menu",
newValue: true
});
render();
};
var toggle = function() {
if (state.get().menu) {
2019-02-03 15:36:40 +01:00
helper.setObject({
object: state.get(),
path: "menu",
newValue: false
});
} else {
_scrollToTop();
2019-02-03 15:36:40 +01:00
helper.setObject({
object: state.get(),
path: "menu",
newValue: true
});
};
render();
};
var render = function() {
var html = helper.e("html");
if (state.get().menu) {
helper.addClass(html, "is-menu-open");
2019-01-15 13:33:15 +01:00
helper.e(".menu").focus();
shade.render({
action: function() {
close();
page.update();
}
});
} else {
helper.removeClass(html, "is-menu-open");
};
};
var init = function() {
2019-01-04 17:24:05 +01:00
_bind();
close();
};
return {
init: init,
close: close,
open: open,
toggle: toggle,
render: render
};
})();