dekun
63 lines
2.0 KiB
JavaScript
63 lines
2.0 KiB
JavaScript
(function (global) {
|
|
var MQ = "(max-width: 720px)";
|
|
|
|
function isMobile() {
|
|
try {
|
|
return window.matchMedia(MQ).matches;
|
|
} catch (e) {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
function sync() {
|
|
var on = isMobile();
|
|
document.documentElement.classList.toggle("hub-phone-html", on);
|
|
if (document.body) document.body.classList.toggle("hub-phone", on);
|
|
if (!on) closeMore();
|
|
}
|
|
|
|
function closeMore() {
|
|
if (!document.body) return;
|
|
document.body.classList.remove("hub-phone-more-open");
|
|
var more = document.getElementById("hub-phone-more");
|
|
var btn = document.getElementById("hub-phone-more-btn");
|
|
if (more) more.setAttribute("aria-hidden", "true");
|
|
if (btn) btn.setAttribute("aria-expanded", "false");
|
|
}
|
|
|
|
function openMore() {
|
|
if (!isMobile()) return;
|
|
document.body.classList.add("hub-phone-more-open");
|
|
var more = document.getElementById("hub-phone-more");
|
|
var btn = document.getElementById("hub-phone-more-btn");
|
|
if (more) more.setAttribute("aria-hidden", "false");
|
|
if (btn) btn.setAttribute("aria-expanded", "true");
|
|
}
|
|
|
|
function boot() {
|
|
sync();
|
|
var moreBtn = document.getElementById("hub-phone-more-btn");
|
|
var backdrop = document.getElementById("hub-phone-more-backdrop");
|
|
var closeBtn = document.getElementById("hub-phone-more-close");
|
|
if (moreBtn) {
|
|
moreBtn.addEventListener("click", function (ev) {
|
|
ev.preventDefault();
|
|
if (document.body.classList.contains("hub-phone-more-open")) closeMore();
|
|
else openMore();
|
|
});
|
|
}
|
|
if (backdrop) backdrop.addEventListener("click", closeMore);
|
|
if (closeBtn) closeBtn.addEventListener("click", closeMore);
|
|
document.addEventListener("keydown", function (ev) {
|
|
if (ev.key === "Escape") closeMore();
|
|
});
|
|
var t = null;
|
|
window.addEventListener("resize", function () {
|
|
clearTimeout(t);
|
|
t = setTimeout(sync, 120);
|
|
});
|
|
}
|
|
|
|
global.HubPhone = { boot: boot, isMobile: isMobile, sync: sync };
|
|
})(window);
|