From 5372a8421fd61deea27b98ff996b3e9fe986c61d Mon Sep 17 00:00:00 2001 From: Fred Heusschen Date: Fri, 23 Dec 2022 16:32:53 +0100 Subject: [PATCH] backbutton fix --- dist/addons/backbutton/mmenu.backbutton.js | 12 ++++++------ dist/mmenu.js | 2 +- package-lock.json | 2 +- package.json | 2 +- src/addons/backbutton/mmenu.backbutton.ts | 12 ++++++------ 5 files changed, 15 insertions(+), 15 deletions(-) diff --git a/dist/addons/backbutton/mmenu.backbutton.js b/dist/addons/backbutton/mmenu.backbutton.js index 7b7ad029..86ae270f 100644 --- a/dist/addons/backbutton/mmenu.backbutton.js +++ b/dist/addons/backbutton/mmenu.backbutton.js @@ -11,7 +11,7 @@ export default function () { const _menu = `#${this.node.menu.id}`; // Close menu if (options.close) { - var states = []; + let states = []; const setStates = () => { states = [_menu]; DOM.children(this.node.pnls, '.mm-panel--opened, .mm-panel--parent').forEach((panel) => { @@ -19,26 +19,26 @@ export default function () { }); }; this.bind('open:after', () => { - history.pushState(null, document.title, _menu); + history.pushState(null, '', location.pathname + location.search + _menu); }); this.bind('open:after', setStates); this.bind('openPanel:after', setStates); this.bind('close:after', () => { states = []; history.back(); - history.pushState(null, document.title, location.pathname + location.search); + history.pushState(null, '', location.pathname + location.search); }); - window.addEventListener('popstate', (evnt) => { + window.addEventListener('popstate', () => { if (this.node.menu.matches('.mm-menu--opened')) { if (states.length) { states = states.slice(0, -1); - var hash = states[states.length - 1]; + const hash = states[states.length - 1]; if (hash == _menu) { this.close(); } else { this.openPanel(this.node.menu.querySelector(hash)); - history.pushState(null, document.title, _menu); + history.pushState(null, '', location.pathname + location.search + _menu); } } } diff --git a/dist/mmenu.js b/dist/mmenu.js index 65410b3f..e4f1674b 100644 --- a/dist/mmenu.js +++ b/dist/mmenu.js @@ -6,4 +6,4 @@ * Copyright (c) Fred Heusschen * frebsite.nl */ -j.addons={offcanvas:function(){this.opts.offCanvas=this.opts.offCanvas||{},this.conf.offCanvas=this.conf.offCanvas||{};const e=a(this.opts.offCanvas,H),t=a(this.conf.offCanvas,q);e.use&&(I.includes(e.position)||(e.position=I[0]),this._api.push("open","close","setPage","position"),this.bind("initMenu:before",()=>{t.clone&&(this.node.menu=this.node.menu.cloneNode(!0),this.node.menu.id&&(this.node.menu.id=m(this.node.menu.id)),_(this.node.menu,"[id]").forEach(e=>{e.id=m(e.id)})),this.node.wrpr=document.querySelector(t.menu.insertSelector),this.node.wrpr[t.menu.insertMethod](this.node.menu)}),j.node.blck||this.bind("initMenu:before",()=>{const e=L("a.mm-wrapper__blocker.mm-blocker.mm-slideout");e.id=r(),e.setAttribute("aria-label",this.i18n(t.screenReader.closeMenu)),e.setAttribute("inert","true"),document.querySelector(t.menu.insertSelector).append(e),j.node.blck=e}),this.bind("initMenu:after",()=>{this.setPage(j.node.page),this.node.menu.classList.add("mm-menu--offcanvas"),this.node.menu.setAttribute("inert","true"),I.includes(e.position)&&(this.node.wrpr.classList.add("mm-wrapper--position-"+e.position),this.node.menu.classList.add("mm-menu--position-"+e.position));let t=window.location.hash;if(t){let e=c(this.node.menu.id);e&&e==t.slice(1)&&setTimeout(()=>{this.open()},1e3)}}),document.addEventListener("click",e=>{var t;switch(null===(t=e.target.closest("a"))||void 0===t?void 0:t.getAttribute("href")){case"#"+c(this.node.menu.id):e.preventDefault(),this.open();break;case"#"+c(j.node.page.id):e.preventDefault(),this.close()}}),document.addEventListener("keyup",e=>{"Escape"==e.key&&this.close()}))},scrollBugFix:function(){if(!R||!this.opts.offCanvas.use)return;this.opts.scrollBugFix=this.opts.scrollBugFix||{};if(!a(this.opts.scrollBugFix,B).fix)return;const e=(e=>{let t="",n=null;return e.addEventListener("touchstart",e=>{1===e.touches.length&&(t="",n=e.touches[0].pageY)}),e.addEventListener("touchend",e=>{0===e.touches.length&&(t="",n=null)}),e.addEventListener("touchmove",e=>{if(t="",n&&1===e.touches.length){const s=e.changedTouches[0].pageY;s>n?t="down":st}})(this.node.menu);this.node.menu.addEventListener("scroll",e=>{e.preventDefault(),e.stopPropagation()},{passive:!1}),this.node.menu.addEventListener("touchmove",t=>{let n=t.target.closest(".mm-panel, .mm-iconbar__top, .mm-iconbar__bottom");n&&n.closest(".mm-listitem--vertical")&&(n=E(n,".mm-panel").pop()),n?(n.scrollHeight===n.offsetHeight||0==n.scrollTop&&"down"==e.get()||n.scrollHeight==n.scrollTop+n.offsetHeight&&"up"==e.get())&&t.stopPropagation():t.stopPropagation()},{passive:!1}),this.bind("open:after",()=>{var e=w(this.node.pnls,".mm-panel--opened")[0];e&&(e.scrollTop=0)}),window.addEventListener("orientationchange",e=>{var t=w(this.node.pnls,".mm-panel--opened")[0];t&&(t.scrollTop=0,t.style["-webkit-overflow-scrolling"]="auto",t.style["-webkit-overflow-scrolling"]="touch")})},theme:function(){this.opts.theme=this.opts.theme||"light";const e=this.opts.theme;D.includes(e)||(this.opts.theme=D[0]),this._api.push("theme"),this.bind("initMenu:after",()=>{this.theme(this.opts.theme)})},backButton:function(){if(this.opts.backButton=this.opts.backButton||{},!this.opts.offCanvas.use)return;const e=a(this.opts.backButton,$),t="#"+this.node.menu.id;if(e.close){var n=[];const e=()=>{n=[t],w(this.node.pnls,".mm-panel--opened, .mm-panel--parent").forEach(e=>{n.push("#"+e.id)})};this.bind("open:after",()=>{history.pushState(null,document.title,t)}),this.bind("open:after",e),this.bind("openPanel:after",e),this.bind("close:after",()=>{n=[],history.back(),history.pushState(null,document.title,location.pathname+location.search)}),window.addEventListener("popstate",e=>{if(this.node.menu.matches(".mm-menu--opened")&&n.length){var s=(n=n.slice(0,-1))[n.length-1];s==t?this.close():(this.openPanel(this.node.menu.querySelector(s)),history.pushState(null,document.title,t))}})}e.open&&window.addEventListener("popstate",e=>{this.node.menu.matches(".mm-menu--opened")||location.hash!=t||this.open()})},counters:function(){this.opts.counters=this.opts.counters||{};if(!a(this.opts.counters,F).add)return;const e=e=>{const t=this.node.pnls.querySelector("#"+e.dataset.mmParent);if(!t)return;const n=t.querySelector(".mm-counter");if(!n)return;const s=[];w(e,".mm-listview").forEach(e=>{s.push(...w(e,".mm-listitem"))}),n.innerHTML=y(s).length.toString()},t=new MutationObserver(t=>{t.forEach(t=>{"class"==t.attributeName&&e(t.target.closest(".mm-panel"))})});this.bind("initListview:after",t=>{const n=t.closest(".mm-panel"),s=this.node.pnls.querySelector("#"+n.dataset.mmParent);if(!s)return;const i=w(s,".mm-btn")[0];if(i){if(!w(i,".mm-counter").length){const e=L("span.mm-counter");e.setAttribute("aria-hidden","true"),i.prepend(e)}e(n)}}),this.bind("initListitem:after",e=>{const n=e.closest(".mm-panel");if(!n)return;this.node.pnls.querySelector("#"+n.dataset.mmParent)&&t.observe(e,{attributes:!0})})},iconbar:function(){this.opts.iconbar=this.opts.iconbar||{};const e=a(this.opts.iconbar,Z);if(!e.use)return;let t;if(["top","bottom"].forEach((n,s)=>{let i=e[n];"array"!=o(i)&&(i=[i]);const a=L("div.mm-iconbar__"+n);for(let e=0,t=i.length;e{this.node.menu.prepend(t)});let n="mm-menu--iconbar-"+e.position,s=()=>{this.node.menu.classList.add(n)},i=()=>{this.node.menu.classList.remove(n)};if("boolean"==typeof e.use?this.bind("initMenu:after",s):k(e.use,s,i),"tabs"==e.type){t.classList.add("mm-iconbar--tabs"),t.addEventListener("click",e=>{const t=e.target.closest(".mm-iconbar__tab");if(t)if(t.matches(".mm-iconbar__tab--selected"))e.stopImmediatePropagation();else try{const n=_(this.node.menu,t.getAttribute("href")+".mm-panel")[0];n&&(e.preventDefault(),e.stopImmediatePropagation(),this.openPanel(n,!1))}catch(e){}});const e=n=>{_(t,"a").forEach(e=>{e.classList.remove("mm-iconbar__tab--selected")});const s=_(t,'[href="#'+n.id+'"]')[0];if(s)s.classList.add("mm-iconbar__tab--selected");else{const t=_(this.node.pnls,"#"+n.dataset.mmParent)[0];t&&e(t.closest(".mm-panel"))}};this.bind("openPanel:before",e)}}},iconPanels:function(){this.opts.iconPanels=this.opts.iconPanels||{};const e=a(this.opts.iconPanels,W);let t=!1;if("first"==e.visible&&(t=!0,e.visible=1),e.visible=Math.min(3,Math.max(1,e.visible)),e.visible++,e.add){this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--iconpanel")});const n=["mm-panel--iconpanel-0","mm-panel--iconpanel-1","mm-panel--iconpanel-2","mm-panel--iconpanel-3"];t?this.bind("initMenu:after",()=>{var e;null===(e=w(this.node.pnls,".mm-panel")[0])||void 0===e||e.classList.add("mm-panel--iconpanel-first")}):this.bind("openPanel:after",t=>{if(t.closest(".mm-listitem--vertical"))return;let s=w(this.node.pnls,".mm-panel");s=s.filter(e=>e.matches(".mm-panel--parent")),s.push(t),s=s.slice(-e.visible),s.forEach((e,t)=>{e.classList.remove("mm-panel--iconpanel-first",...n),e.classList.add("mm-panel--iconpanel-"+t)})})}},navbars:V,pageScroll:function(){this.opts.pageScroll=this.opts.pageScroll||{},this.conf.pageScroll=this.conf.pageScroll||{};const e=a(this.opts.pageScroll,U),t=a(this.conf.pageScroll,Y);var n;function s(){n&&window.scrollTo({top:n.getBoundingClientRect().top+document.scrollingElement.scrollTop-t.scrollOffset,behavior:"smooth"}),n=null}function i(e){try{if("#"==e.slice(0,1))return _(j.node.page,e)[0]}catch(e){}return null}if(this.opts.offCanvas.use&&e.scroll&&(this.bind("close:after",()=>{s()}),this.node.menu.addEventListener("click",e=>{var t,a;const o=(null===(a=null===(t=e.target)||void 0===t?void 0:t.closest("a[href]"))||void 0===a?void 0:a.getAttribute("href"))||"";(n=i(o))&&(e.preventDefault(),this.node.menu.matches(".mm-menu--sidebar-expanded")&&this.node.wrpr.matches(".mm-wrapper--sidebar-expanded")?s():this.close())})),e.update){let e=[];this.bind("initListview:after",t=>{const n=w(t,".mm-listitem");P(n).forEach(t=>{const n=i(t.getAttribute("href"));n&&e.unshift(n)})});let n=-1;window.addEventListener("scroll",s=>{const i=window.scrollY;for(var a=0;at.matches('[href="#'+e[a].id+'"]')),i.length&&this.setSelected(i[0].parentElement)}break}},{passive:!0})}},searchfield:function(){this.opts.searchfield=this.opts.searchfield||{},this.conf.searchfield=this.conf.searchfield||{};const e=a(this.opts.searchfield,G);a(this.conf.searchfield,K);if(e.add){switch(e.addTo){case"panels":e.addTo=".mm-panel";break;case"searchpanel":e.addTo=".mm-panel--search"}switch(e.searchIn){case"panels":e.searchIn=".mm-panel"}this.bind("initPanel:after",t=>{t.matches(e.addTo)&&!t.closest(".mm-listitem--vertical")&&ie.call(this,t)}),this.bind("initMenu:after",()=>{const t=se.call(this);ie.call(this,t),_(this.node.menu,e.addTo).forEach(n=>{if(!n.matches(".mm-panel")){const s=ae.call(this,!0);n.append(s);const i=_(s,"input")[0];e.splash.length?(i.addEventListener("focusin",()=>{this.openPanel(t,!1,!1)}),this.bind("openPanel:after",e=>{e.matches(".mm-panel--search")?s.classList.add("mm-searchfield--cancelable"):s.classList.remove("mm-searchfield--cancelable")})):(this.bind("search:after",()=>{this.openPanel(t,!1,!1)}),i.addEventListener("focusout",()=>{i.value.length||this.closePanel(t,!1)})),oe.call(this,s)}})}),this.bind("close:before",()=>{_(this.node.menu,".mm-searchfield input").forEach(e=>{e.blur()})})}},sectionIndexer:function(){this.opts.sectionIndexer=this.opts.sectionIndexer||{};a(this.opts.sectionIndexer,he).add&&this.bind("initPanels:after",()=>{if(!this.node.indx){let e="";"abcdefghijklmnopqrstuvwxyz".split("").forEach(t=>{e+=''+t+""});let t=L("div.mm-sectionindexer");t.innerHTML=e,this.node.pnls.prepend(t),this.node.indx=t,this.node.indx.addEventListener("click",e=>{e.target.matches("a")&&e.preventDefault()});let n=e=>{if(!e.target.matches("a"))return;const t=e.target.textContent,n=w(this.node.pnls,".mm-panel--opened")[0];let s=-1,i=n.scrollTop;n.scrollTop=0,_(n,".mm-divider").filter(e=>!e.matches(".mm-hidden")).forEach(e=>{s<0&&t==e.textContent.trim().slice(0,1).toLowerCase()&&(s=e.offsetTop)}),n.scrollTop=s>-1?s:i};R?(this.node.indx.addEventListener("touchstart",n),this.node.indx.addEventListener("touchmove",n)):this.node.indx.addEventListener("mouseover",n)}this.bind("openPanel:before",e=>{const t=_(e,".mm-divider").filter(e=>!e.matches(".mm-hidden")).length;this.node.indx.classList[t?"add":"remove"]("mm-sectionindexer--active")})})},setSelected:function(){this.opts.setSelected=this.opts.setSelected||{};const e=a(this.opts.setSelected,pe);if("detect"==e.current){const e=t=>{t=t.split("?")[0].split("#")[0];const n=this.node.menu.querySelector('a[href="'+t+'"], a[href="'+t+'/"]');if(n)this.setSelected(n.parentElement);else{const n=t.split("/").slice(0,-1);n.length&&e(n.join("/"))}};this.bind("initMenu:after",()=>{e.call(this,window.location.href)})}else e.current||this.bind("initListview:after",e=>{w(e,".mm-listitem--selected").forEach(e=>{e.classList.remove("mm-listitem--selected")})});e.hover&&this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--selected-hover")}),e.parent&&(this.bind("openPanel:after",e=>{_(this.node.pnls,".mm-listitem--selected-parent").forEach(e=>{e.classList.remove("mm-listitem--selected-parent")});let t=e;for(;t;){let e=_(this.node.pnls,"#"+t.dataset.mmParent)[0];t=null==e?void 0:e.closest(".mm-panel"),e&&!e.matches(".mm-listitem--vertical")&&e.classList.add("mm-listitem--selected-parent")}}),this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--selected-parent")}))},sidebar:function(){if(!this.opts.offCanvas.use)return;this.opts.sidebar=this.opts.sidebar||{};const e=a(this.opts.sidebar,ue);if(e.collapsed.use){this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--sidebar-collapsed")});let t=()=>{this.node.wrpr.classList.add("mm-wrapper--sidebar-collapsed")},n=()=>{this.node.wrpr.classList.remove("mm-wrapper--sidebar-collapsed")};"boolean"==typeof e.collapsed.use?this.bind("initMenu:after",t):k(e.collapsed.use,t,n)}if(e.expanded.use){this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--sidebar-expanded")});let t=!1,n=()=>{t=!0,this.node.wrpr.classList.add("mm-wrapper--sidebar-expanded"),this.node.menu.removeAttribute("aria-modal"),this.open(),j.node.page.removeAttribute("inert")},s=()=>{t=!1,this.node.wrpr.classList.remove("mm-wrapper--sidebar-expanded"),this.node.menu.setAttribute("aria-modal","true"),this.close()};"boolean"==typeof e.expanded.use?this.bind("initMenu:after",n):k(e.expanded.use,n,s),this.bind("close:after",()=>{t&&window.sessionStorage.setItem("mmenuExpandedState","closed")}),this.bind("open:after",()=>{t&&(window.sessionStorage.setItem("mmenuExpandedState","open"),j.node.page.removeAttribute("inert"))});let i=e.expanded.initial;const a=window.sessionStorage.getItem("mmenuExpandedState");switch(a){case"open":case"closed":i=a}"closed"===i&&this.bind("init:after",()=>{this.close()})}}};t.default=j;window&&(window.Mmenu=j)}]); \ No newline at end of file +j.addons={offcanvas:function(){this.opts.offCanvas=this.opts.offCanvas||{},this.conf.offCanvas=this.conf.offCanvas||{};const e=a(this.opts.offCanvas,H),t=a(this.conf.offCanvas,q);e.use&&(I.includes(e.position)||(e.position=I[0]),this._api.push("open","close","setPage","position"),this.bind("initMenu:before",()=>{t.clone&&(this.node.menu=this.node.menu.cloneNode(!0),this.node.menu.id&&(this.node.menu.id=m(this.node.menu.id)),_(this.node.menu,"[id]").forEach(e=>{e.id=m(e.id)})),this.node.wrpr=document.querySelector(t.menu.insertSelector),this.node.wrpr[t.menu.insertMethod](this.node.menu)}),j.node.blck||this.bind("initMenu:before",()=>{const e=L("a.mm-wrapper__blocker.mm-blocker.mm-slideout");e.id=r(),e.setAttribute("aria-label",this.i18n(t.screenReader.closeMenu)),e.setAttribute("inert","true"),document.querySelector(t.menu.insertSelector).append(e),j.node.blck=e}),this.bind("initMenu:after",()=>{this.setPage(j.node.page),this.node.menu.classList.add("mm-menu--offcanvas"),this.node.menu.setAttribute("inert","true"),I.includes(e.position)&&(this.node.wrpr.classList.add("mm-wrapper--position-"+e.position),this.node.menu.classList.add("mm-menu--position-"+e.position));let t=window.location.hash;if(t){let e=c(this.node.menu.id);e&&e==t.slice(1)&&setTimeout(()=>{this.open()},1e3)}}),document.addEventListener("click",e=>{var t;switch(null===(t=e.target.closest("a"))||void 0===t?void 0:t.getAttribute("href")){case"#"+c(this.node.menu.id):e.preventDefault(),this.open();break;case"#"+c(j.node.page.id):e.preventDefault(),this.close()}}),document.addEventListener("keyup",e=>{"Escape"==e.key&&this.close()}))},scrollBugFix:function(){if(!R||!this.opts.offCanvas.use)return;this.opts.scrollBugFix=this.opts.scrollBugFix||{};if(!a(this.opts.scrollBugFix,B).fix)return;const e=(e=>{let t="",n=null;return e.addEventListener("touchstart",e=>{1===e.touches.length&&(t="",n=e.touches[0].pageY)}),e.addEventListener("touchend",e=>{0===e.touches.length&&(t="",n=null)}),e.addEventListener("touchmove",e=>{if(t="",n&&1===e.touches.length){const s=e.changedTouches[0].pageY;s>n?t="down":st}})(this.node.menu);this.node.menu.addEventListener("scroll",e=>{e.preventDefault(),e.stopPropagation()},{passive:!1}),this.node.menu.addEventListener("touchmove",t=>{let n=t.target.closest(".mm-panel, .mm-iconbar__top, .mm-iconbar__bottom");n&&n.closest(".mm-listitem--vertical")&&(n=E(n,".mm-panel").pop()),n?(n.scrollHeight===n.offsetHeight||0==n.scrollTop&&"down"==e.get()||n.scrollHeight==n.scrollTop+n.offsetHeight&&"up"==e.get())&&t.stopPropagation():t.stopPropagation()},{passive:!1}),this.bind("open:after",()=>{var e=w(this.node.pnls,".mm-panel--opened")[0];e&&(e.scrollTop=0)}),window.addEventListener("orientationchange",e=>{var t=w(this.node.pnls,".mm-panel--opened")[0];t&&(t.scrollTop=0,t.style["-webkit-overflow-scrolling"]="auto",t.style["-webkit-overflow-scrolling"]="touch")})},theme:function(){this.opts.theme=this.opts.theme||"light";const e=this.opts.theme;D.includes(e)||(this.opts.theme=D[0]),this._api.push("theme"),this.bind("initMenu:after",()=>{this.theme(this.opts.theme)})},backButton:function(){if(this.opts.backButton=this.opts.backButton||{},!this.opts.offCanvas.use)return;const e=a(this.opts.backButton,$),t="#"+this.node.menu.id;if(e.close){let e=[];const n=()=>{e=[t],w(this.node.pnls,".mm-panel--opened, .mm-panel--parent").forEach(t=>{e.push("#"+t.id)})};this.bind("open:after",()=>{history.pushState(null,"",location.pathname+location.search+t)}),this.bind("open:after",n),this.bind("openPanel:after",n),this.bind("close:after",()=>{e=[],history.back(),history.pushState(null,"",location.pathname+location.search)}),window.addEventListener("popstate",()=>{if(this.node.menu.matches(".mm-menu--opened")&&e.length){e=e.slice(0,-1);const n=e[e.length-1];n==t?this.close():(this.openPanel(this.node.menu.querySelector(n)),history.pushState(null,"",location.pathname+location.search+t))}})}e.open&&window.addEventListener("popstate",e=>{this.node.menu.matches(".mm-menu--opened")||location.hash!=t||this.open()})},counters:function(){this.opts.counters=this.opts.counters||{};if(!a(this.opts.counters,F).add)return;const e=e=>{const t=this.node.pnls.querySelector("#"+e.dataset.mmParent);if(!t)return;const n=t.querySelector(".mm-counter");if(!n)return;const s=[];w(e,".mm-listview").forEach(e=>{s.push(...w(e,".mm-listitem"))}),n.innerHTML=y(s).length.toString()},t=new MutationObserver(t=>{t.forEach(t=>{"class"==t.attributeName&&e(t.target.closest(".mm-panel"))})});this.bind("initListview:after",t=>{const n=t.closest(".mm-panel"),s=this.node.pnls.querySelector("#"+n.dataset.mmParent);if(!s)return;const i=w(s,".mm-btn")[0];if(i){if(!w(i,".mm-counter").length){const e=L("span.mm-counter");e.setAttribute("aria-hidden","true"),i.prepend(e)}e(n)}}),this.bind("initListitem:after",e=>{const n=e.closest(".mm-panel");if(!n)return;this.node.pnls.querySelector("#"+n.dataset.mmParent)&&t.observe(e,{attributes:!0})})},iconbar:function(){this.opts.iconbar=this.opts.iconbar||{};const e=a(this.opts.iconbar,Z);if(!e.use)return;let t;if(["top","bottom"].forEach((n,s)=>{let i=e[n];"array"!=o(i)&&(i=[i]);const a=L("div.mm-iconbar__"+n);for(let e=0,t=i.length;e{this.node.menu.prepend(t)});let n="mm-menu--iconbar-"+e.position,s=()=>{this.node.menu.classList.add(n)},i=()=>{this.node.menu.classList.remove(n)};if("boolean"==typeof e.use?this.bind("initMenu:after",s):k(e.use,s,i),"tabs"==e.type){t.classList.add("mm-iconbar--tabs"),t.addEventListener("click",e=>{const t=e.target.closest(".mm-iconbar__tab");if(t)if(t.matches(".mm-iconbar__tab--selected"))e.stopImmediatePropagation();else try{const n=_(this.node.menu,t.getAttribute("href")+".mm-panel")[0];n&&(e.preventDefault(),e.stopImmediatePropagation(),this.openPanel(n,!1))}catch(e){}});const e=n=>{_(t,"a").forEach(e=>{e.classList.remove("mm-iconbar__tab--selected")});const s=_(t,'[href="#'+n.id+'"]')[0];if(s)s.classList.add("mm-iconbar__tab--selected");else{const t=_(this.node.pnls,"#"+n.dataset.mmParent)[0];t&&e(t.closest(".mm-panel"))}};this.bind("openPanel:before",e)}}},iconPanels:function(){this.opts.iconPanels=this.opts.iconPanels||{};const e=a(this.opts.iconPanels,W);let t=!1;if("first"==e.visible&&(t=!0,e.visible=1),e.visible=Math.min(3,Math.max(1,e.visible)),e.visible++,e.add){this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--iconpanel")});const n=["mm-panel--iconpanel-0","mm-panel--iconpanel-1","mm-panel--iconpanel-2","mm-panel--iconpanel-3"];t?this.bind("initMenu:after",()=>{var e;null===(e=w(this.node.pnls,".mm-panel")[0])||void 0===e||e.classList.add("mm-panel--iconpanel-first")}):this.bind("openPanel:after",t=>{if(t.closest(".mm-listitem--vertical"))return;let s=w(this.node.pnls,".mm-panel");s=s.filter(e=>e.matches(".mm-panel--parent")),s.push(t),s=s.slice(-e.visible),s.forEach((e,t)=>{e.classList.remove("mm-panel--iconpanel-first",...n),e.classList.add("mm-panel--iconpanel-"+t)})})}},navbars:V,pageScroll:function(){this.opts.pageScroll=this.opts.pageScroll||{},this.conf.pageScroll=this.conf.pageScroll||{};const e=a(this.opts.pageScroll,U),t=a(this.conf.pageScroll,Y);var n;function s(){n&&window.scrollTo({top:n.getBoundingClientRect().top+document.scrollingElement.scrollTop-t.scrollOffset,behavior:"smooth"}),n=null}function i(e){try{if("#"==e.slice(0,1))return _(j.node.page,e)[0]}catch(e){}return null}if(this.opts.offCanvas.use&&e.scroll&&(this.bind("close:after",()=>{s()}),this.node.menu.addEventListener("click",e=>{var t,a;const o=(null===(a=null===(t=e.target)||void 0===t?void 0:t.closest("a[href]"))||void 0===a?void 0:a.getAttribute("href"))||"";(n=i(o))&&(e.preventDefault(),this.node.menu.matches(".mm-menu--sidebar-expanded")&&this.node.wrpr.matches(".mm-wrapper--sidebar-expanded")?s():this.close())})),e.update){let e=[];this.bind("initListview:after",t=>{const n=w(t,".mm-listitem");P(n).forEach(t=>{const n=i(t.getAttribute("href"));n&&e.unshift(n)})});let n=-1;window.addEventListener("scroll",s=>{const i=window.scrollY;for(var a=0;at.matches('[href="#'+e[a].id+'"]')),i.length&&this.setSelected(i[0].parentElement)}break}},{passive:!0})}},searchfield:function(){this.opts.searchfield=this.opts.searchfield||{},this.conf.searchfield=this.conf.searchfield||{};const e=a(this.opts.searchfield,G);a(this.conf.searchfield,K);if(e.add){switch(e.addTo){case"panels":e.addTo=".mm-panel";break;case"searchpanel":e.addTo=".mm-panel--search"}switch(e.searchIn){case"panels":e.searchIn=".mm-panel"}this.bind("initPanel:after",t=>{t.matches(e.addTo)&&!t.closest(".mm-listitem--vertical")&&ie.call(this,t)}),this.bind("initMenu:after",()=>{const t=se.call(this);ie.call(this,t),_(this.node.menu,e.addTo).forEach(n=>{if(!n.matches(".mm-panel")){const s=ae.call(this,!0);n.append(s);const i=_(s,"input")[0];e.splash.length?(i.addEventListener("focusin",()=>{this.openPanel(t,!1,!1)}),this.bind("openPanel:after",e=>{e.matches(".mm-panel--search")?s.classList.add("mm-searchfield--cancelable"):s.classList.remove("mm-searchfield--cancelable")})):(this.bind("search:after",()=>{this.openPanel(t,!1,!1)}),i.addEventListener("focusout",()=>{i.value.length||this.closePanel(t,!1)})),oe.call(this,s)}})}),this.bind("close:before",()=>{_(this.node.menu,".mm-searchfield input").forEach(e=>{e.blur()})})}},sectionIndexer:function(){this.opts.sectionIndexer=this.opts.sectionIndexer||{};a(this.opts.sectionIndexer,he).add&&this.bind("initPanels:after",()=>{if(!this.node.indx){let e="";"abcdefghijklmnopqrstuvwxyz".split("").forEach(t=>{e+=''+t+""});let t=L("div.mm-sectionindexer");t.innerHTML=e,this.node.pnls.prepend(t),this.node.indx=t,this.node.indx.addEventListener("click",e=>{e.target.matches("a")&&e.preventDefault()});let n=e=>{if(!e.target.matches("a"))return;const t=e.target.textContent,n=w(this.node.pnls,".mm-panel--opened")[0];let s=-1,i=n.scrollTop;n.scrollTop=0,_(n,".mm-divider").filter(e=>!e.matches(".mm-hidden")).forEach(e=>{s<0&&t==e.textContent.trim().slice(0,1).toLowerCase()&&(s=e.offsetTop)}),n.scrollTop=s>-1?s:i};R?(this.node.indx.addEventListener("touchstart",n),this.node.indx.addEventListener("touchmove",n)):this.node.indx.addEventListener("mouseover",n)}this.bind("openPanel:before",e=>{const t=_(e,".mm-divider").filter(e=>!e.matches(".mm-hidden")).length;this.node.indx.classList[t?"add":"remove"]("mm-sectionindexer--active")})})},setSelected:function(){this.opts.setSelected=this.opts.setSelected||{};const e=a(this.opts.setSelected,pe);if("detect"==e.current){const e=t=>{t=t.split("?")[0].split("#")[0];const n=this.node.menu.querySelector('a[href="'+t+'"], a[href="'+t+'/"]');if(n)this.setSelected(n.parentElement);else{const n=t.split("/").slice(0,-1);n.length&&e(n.join("/"))}};this.bind("initMenu:after",()=>{e.call(this,window.location.href)})}else e.current||this.bind("initListview:after",e=>{w(e,".mm-listitem--selected").forEach(e=>{e.classList.remove("mm-listitem--selected")})});e.hover&&this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--selected-hover")}),e.parent&&(this.bind("openPanel:after",e=>{_(this.node.pnls,".mm-listitem--selected-parent").forEach(e=>{e.classList.remove("mm-listitem--selected-parent")});let t=e;for(;t;){let e=_(this.node.pnls,"#"+t.dataset.mmParent)[0];t=null==e?void 0:e.closest(".mm-panel"),e&&!e.matches(".mm-listitem--vertical")&&e.classList.add("mm-listitem--selected-parent")}}),this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--selected-parent")}))},sidebar:function(){if(!this.opts.offCanvas.use)return;this.opts.sidebar=this.opts.sidebar||{};const e=a(this.opts.sidebar,ue);if(e.collapsed.use){this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--sidebar-collapsed")});let t=()=>{this.node.wrpr.classList.add("mm-wrapper--sidebar-collapsed")},n=()=>{this.node.wrpr.classList.remove("mm-wrapper--sidebar-collapsed")};"boolean"==typeof e.collapsed.use?this.bind("initMenu:after",t):k(e.collapsed.use,t,n)}if(e.expanded.use){this.bind("initMenu:after",()=>{this.node.menu.classList.add("mm-menu--sidebar-expanded")});let t=!1,n=()=>{t=!0,this.node.wrpr.classList.add("mm-wrapper--sidebar-expanded"),this.node.menu.removeAttribute("aria-modal"),this.open(),j.node.page.removeAttribute("inert")},s=()=>{t=!1,this.node.wrpr.classList.remove("mm-wrapper--sidebar-expanded"),this.node.menu.setAttribute("aria-modal","true"),this.close()};"boolean"==typeof e.expanded.use?this.bind("initMenu:after",n):k(e.expanded.use,n,s),this.bind("close:after",()=>{t&&window.sessionStorage.setItem("mmenuExpandedState","closed")}),this.bind("open:after",()=>{t&&(window.sessionStorage.setItem("mmenuExpandedState","open"),j.node.page.removeAttribute("inert"))});let i=e.expanded.initial;const a=window.sessionStorage.getItem("mmenuExpandedState");switch(a){case"open":case"closed":i=a}"closed"===i&&this.bind("init:after",()=>{this.close()})}}};t.default=j;window&&(window.Mmenu=j)}]); \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 2f9556fe..e6a3a8b9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "mmenu-js", - "version": "9.2.2", + "version": "9.2.3", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index cf4716b7..faedba2f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "mmenu-js", - "version": "9.2.2", + "version": "9.2.3", "main": "dist/mmenu.js", "module": "src/mmenu.js", "author": "Fred Heusschen ", diff --git a/src/addons/backbutton/mmenu.backbutton.ts b/src/addons/backbutton/mmenu.backbutton.ts index 3013a229..3a4555b9 100644 --- a/src/addons/backbutton/mmenu.backbutton.ts +++ b/src/addons/backbutton/mmenu.backbutton.ts @@ -18,7 +18,7 @@ export default function (this: Mmenu) { // Close menu if (options.close) { - var states = []; + let states = []; const setStates = () => { states = [_menu]; @@ -31,7 +31,7 @@ export default function (this: Mmenu) { }; this.bind('open:after', () => { - history.pushState(null, document.title, _menu); + history.pushState(null, '', location.pathname + location.search + _menu); }); this.bind('open:after', setStates); this.bind('openPanel:after', setStates); @@ -40,22 +40,22 @@ export default function (this: Mmenu) { history.back(); history.pushState( null, - document.title, + '', location.pathname + location.search ); }); - window.addEventListener('popstate', (evnt) => { + window.addEventListener('popstate', () => { if (this.node.menu.matches('.mm-menu--opened')) { if (states.length) { states = states.slice(0, -1); - var hash = states[states.length - 1]; + const hash = states[states.length - 1]; if (hash == _menu) { this.close(); } else { this.openPanel(this.node.menu.querySelector(hash)); - history.pushState(null, document.title, _menu); + history.pushState(null, '', location.pathname + location.search + _menu); } } }