https://mdk-lancut.pl/js/zdzislowicz-menu-2.2.js?date=20260403203349

1/*
2         _       _       _                  _                       _
3 ____ __| | ____(_) ___ | |  ___ __      __(_)  ___  ____    _ __  | |
4|_  // _` ||_  /| |/ __|| | / _ \\ \ /\ / /| | / __||_  /   | '_ \ | |
5 / /| (_| | / / | |\__ \| || (_) |\ V  V / | || (__  / /  _ | |_) || |
6/___|\__,_|/___||_||___/|_| \___/  \_/\_/  |_| \___|/___|(_)| .__/ |_|
7                                                            |_|
8
9BURGER MENU ADVANCED
10www.zdzislowicz.pl
11[email protected]
12
13all rights reserved
14*/
15
16
17const burger = document.querySelector(".burgermenu");
18
19$(document).ready(function () {
20
21    /* HASH MENU */
22    var target = location.hash;
23    target = target.replace("#", "");
24    // window.location.hash = "";
25
26    // other url
27    $(document).ready(function () {
28        if (target) {
29            // todo
30            $("html,body").animate({ scrollTop: $("." + target).offset().top - zIsTopbarFixed() }, 500);
31        }
32    });
33
34    $(".quick-access a").on("click", function (e) {
35        var href = $(this).attr("href");
36        if (!href.includes("#")) return; // np. trzeci link normalnie
37
38        var targetId = href.split("#")[1];
39        var $target = $("#" + targetId);
40
41        if ($target.length) {
42            e.preventDefault();
43            e.stopPropagation();
44
45            var $focusable = $target.find('button, a, input:not([type="hidden"]), select, textarea').eq(0);
46
47            if ($focusable.length) {
48                $focusable.focus();
49            }
50
51            $("html, body").animate(
52                {
53                    scrollTop: $target.offset().top - zIsTopbarFixed(),
54                },
55                500
56            );
57        }
58    });
59
60    // same url
61    $(document).on("click", "a", function (e) {
62        var href = this.getAttribute("href");
63        if (!href) return;
64
65        var hash = this.hash.replace("#", "");
66        var adres = href
67            .replace(strona_adres_pelny, "")
68            .replace("/", "")
69            .replace("#" + hash, "");
70        var adresAktualny = window.location.href
71            .replace(strona_adres_pelny, "")
72            .replace("#" + hash, "")
73            .replace("#", "");
74
75        if (adres !== adresAktualny) {
76            return;
77        }
78
79        if (hash) {
80            var $target = $("." + hash);
81            if (!$target.length) return;
82
83            burgermenuHide();
84            e.preventDefault();
85            e.stopPropagation();
86
87            $("html,body").animate(
88                {
89                    scrollTop: $target.offset().top - zIsTopbarFixed(),
90                },
91                500
92            );
93        }
94    });
95
96    function zIsTopbarFixed() {
97        let height = 0;
98        if ($(".topbar").css("position") == "fixed") height = $(".topbar").height() - 1;
99        return height;
100    }
101
102    /* BURGER MENU */
103    // informacja o zmianie menu
104    function announceNavbarMobile() {
105        const status = document.getElementById("navbarMobile-status");
106        if (!status) return;
107
108        const currentSlide = document.querySelector(".navbarMobile");
109        if (!currentSlide) return;
110
111        const text = currentSlide.getAttribute("data-status") || "Menu";
112
113        status.textContent = "";
114        setTimeout(() => {
115            status.textContent = text + ".";
116        }, 30);
117    }
118
119    var burgermenuWindowWidth = $(window).width();
120
121    $(window).resize(function () {
122        if (burgermenuWindowWidth != $(window).width()) {
123            burgermenuHide();
124        }
125        burgermenuWindowWidth = $(window).width();
126    });
127
128    $(window).on("orientationchange", function () {
129        burgermenuHide();
130    });
131
132    $(".burgermenu").on("click", function () {
133        // if ($(window).width() < 1024) {
134        if (!$(this).hasClass("active")) {
135            // pokaz
136            burgermenuShow();
137            // $('.navbarMobile .top .close button').focus();
138        } else {
139            burgermenuHide();
140        }
141    });

142
143    $(document).on("click", ".navbarMobile .close button", function () {
144        burgermenuHide();
145    });
146
147    function burgermenuShow() {
148        let zamknij = "Zamknij menu";
149        if (jezyk === "en") {
150            zamknij = "Close menu";
151        }
152        let navbarMobileStatus = "Menu otwarte";
153        if (jezyk === "en") {
154            navbarMobileStatus = "Opened menu";
155        }
156
157        // Budowanie HTML krok po kroku
158        let menuHtml =
159            '<div class="navbarMobile zdzModal" id="navbarMobile" data-status="' +
160            navbarMobileStatus +
161            '">' +
162            '<div class="navbarMobile-top">' +
163            '<div class="right">' +
164            // $('.topbar__right').html() +
165            '<div class="close"><button type="button" title="' +
166            zamknij +
167            '" tabindex="1"></button></div>' +
168            "</div>" +
169            "</div>" +
170            '<div class="sectionTitle"><h2>Menu</h2></div>' +
171            '<div class="menu long">' +
172            '<div class="container">' +
173            '<ul class="show">' +
174            $(".navbar ul").html();
175
176        // Dodanie dodatkowej kolumny jeśli istnieje
177        // if ($(".navbar--plan ul").length) {
178        //     menuHtml += $(".navbar--plan ul").html();
179        // }
180
181        // Domknięcie listy i kontenerów
182        menuHtml += "</ul>" + "</div>" + "</div>" + "</div>";
183
184        // Wstawienie do body
185        $("body").append(menuHtml);
186
187        announceNavbarMobile();
188
189        // Animacje i style
190        $(".navbarMobile").animate({ opacity: "1" }, 250);
191        $(".navbarMobile .container").css("height", $(".navbarMobile .menu").find("ul").height() + 200 + "px");
192        $(".navbarMobile .menu ul").first().addClass("show");
193        $("body .navbarMobile .show li button").attr("tabindex", "1").addClass("button");
194
195        // Blokowanie scrolla body
196        $("body").removeClass("bodyscroll").addClass("bodynoscroll");
197
198        // Tabindexy — tylko linki bez tabindex dostają -1
199        $("body a:not([tabindex])").attr("tabindex", "-1").addClass("js-burger-tabindex");
200        $("body .navbarMobile a").attr("tabindex", "1");
201
202        // Po dodaniu navbarMobile do DOM:
203        const navbarModal = document.getElementById("navbarMobile");
204        if (navbarModal) {
205            zdzModal(navbarModal);
206        }
207
208        // Ustawienie focusa
209        // $('body .navbarMobile .top button:first-of-type, body .navbarMobile-top button:first-of-type').focus();
210        $("body .navbarMobile .menu .show li:first-of-type a").focus();
211    }
212
213    function burgermenuHide() {
214        $(".burgermenu").removeClass("active");
215        // $(".navbarMobile").animate({ left: "100vw" }, 500);
216        $(".navbarMobile").animate({ opacity: "0" }, 250);
217        setTimeout(() => {
218            $(".navbarMobile").remove();
219        }, 500);
220
221        $("body").removeClass("bodynoscroll");
222        $("body").addClass("bodyscroll");
223
224        $("body a.js-burger-tabindex").removeAttr("tabindex").removeClass("js-burger-tabindex");
225        $("body .burgermenu").focus();
226    }
227    let wroc = "Wróć";
228    if (jezyk === "en") {
229        wroc = "Go back";
230    }
231    $("body").on("click", ".navbarMobile .button", function (e) {
232        e.preventDefault();
233        e.stopPropagation();
234
235        $(this).parent().parent().removeClass("show");
236        $(this).next().addClass("show");
237        $(".navbarMobile .container").css("height", $(".navbarMobile ul.show").height() + 200 + "px");
238
239        back = $(this).prev().text();
240
241        $(this)
242            .next()
243            .prepend('<li class="back"><button title="' + wroc + '" type="button" class="button" tabindex="1">' + back + "</button></li>");
244    });
245
246    $("body").on("click", ".navbarMobile .back .button", function (e) {
247        back = $(this).parent().parent().parent().parent().prev().prev().text();
248
249        $(".navbarMobile ul").removeClass("show");
250        $(this).parent().parent().parent().parent().addClass("show");
251        $(".navbarMobile .back").remove();
252
253        if (back != "") {
254            $(".navbarMobile .container").css("height", $(".navbarMobile ul.show").height() + 200 + "px");
255            $(".navbarMobile ul.show").prepend('<li class="back"><button title="' + wroc + '" type="button" class="button">' + back + "</button></li>");
256        } else {
257            $(".navbarMobile .container").css("height", $(".navbarMobile ul.show").height() + 200 + "px");
258        }
259    });

260});
261
262/*
263         _       _       _                  _                       _
264 ____ __| | ____(_) ___ | |  ___ __      __(_)  ___  ____    _ __  | |
265|_  // _` ||_  /| |/ __|| | / _ \\ \ /\ / /| | / __||_  /   | '_ \ | |
266 / /| (_| | / / | |\__ \| || (_) |\ V  V / | || (__  / /  _ | |_) || |
267/___|\__,_|/___||_||___/|_| \___/  \_/\_/  |_| \___|/___|(_)| .__/ |_|
268                                                            |_|
269
270*/
271
272// HOVER/FOCUS MENU
273
274function zMenuClear(ul, li) {
275    let elList = document.querySelectorAll(ul);
276    elList.forEach(function (el) {
277        el.classList.remove("showsub");
278    });
279
280    elList = document.querySelectorAll(li);
281    elList.forEach(function (el) {
282        el.classList.remove("opensub");
283    });
284}
285
286function zMenuLoop(el) {
287    while (el.tagName == "UL") {
288        if (el.parentNode.tagName == "LI") {
289            el.classList.add("showsub");
290            el.parentNode.classList.add("opensub");
291        }
292        el = el.parentNode.parentNode;
293    }
294}
295
296function zMenu(navbar) {
297    var buttonList = document.querySelectorAll(navbar + " button");
298    buttonList.forEach(function (item, index) {
299        // Na start przypisz atrybuty ARIA
300        item.setAttribute("aria-haspopup", "true");
301
302        // Nadaj unikalne ID dla podmenu, jeśli nie ma
303        const ul = item.nextElementSibling;
304        // if (ul && !ul.id) {
305        if (ul && ul.tagName === "UL" && !ul.id) {
306            ul.id = navbar.replace(/\W/g, "") + "-submenu-" + index;
307        }
308        if (ul && ul.tagName === "UL") {
309            item.setAttribute("aria-controls", ul.id);
310            item.setAttribute("aria-expanded", "false");
311        }
312
313        item.addEventListener("click", function (e) {
314            const ul = this.nextElementSibling;
315            if (!ul || ul.tagName !== "UL") return;
316
317            const li = this.parentNode;
318            const isOpen = ul.classList.contains("showsub");
319
320            if (isOpen) {
321                ul.classList.remove("showsub");
322                li.classList.remove("opensub");
323                this.setAttribute("aria-expanded", "false");
324            } else {
325                ul.classList.add("showsub");
326                li.classList.add("opensub");
327                this.setAttribute("aria-expanded", "true");
328            }
329        });
330
331        // Obsługa klawiatury - Enter i Spacja wyzwalają kliknięcie
332        item.addEventListener("keydown", function (e) {
333            if (e.key === " " || e.key === "Enter") {
334                e.preventDefault();
335                this.click();
336            }
337        });
338    });
339
340    // OBSŁUGA BLUR/FOCUSOUT
341    var aItem = document.querySelectorAll(navbar + " a, " + navbar + " button");
342    aItem.forEach(function (item) {
343        item.addEventListener("blur", function (e) {
344            const relatedTarget = e.relatedTarget;
345            const currentSubmenu = e.target.closest("ul");
346
347            // Jeśli fokus wychodzi całkowicie poza navbar
348            if (!relatedTarget || !relatedTarget.closest(navbar)) {
349                // Zwijamy wszystkie submenu
350                zMenuClear(navbar + " ul.showsub", navbar + " li.active");
351
352                // Ustaw aria-expanded na false dla wszystkich buttonów
353                const allButtons = document.querySelectorAll(navbar + " button");
354                allButtons.forEach((btn) => {
355                    btn.setAttribute("aria-expanded", "false");
356                });
357                return;
358            }
359
360            // Jeśli fokus jest w tym samym submenu lub jego dzieciach - nic nie rób
361            if (currentSubmenu && currentSubmenu.contains(relatedTarget)) {
362                return;
363            }
364
365            // Fokus przesunął się do innego submenu
366            // Zwijamy submenu obecnego elementu
367            if (currentSubmenu) {
368                currentSubmenu.classList.remove("showsub");
369                const parentLi = currentSubmenu.parentNode;
370                if (parentLi) {
371                    parentLi.classList.remove("opensub");
372                    const button = parentLi.querySelector("button");
373                    if (button) {
374                        button.setAttribute("aria-expanded", "false");
375                    }
376                }
377            }
378        });
379    });

380
381    // SHOW ON FOCUS - dla linków w submenu
382    var aList = document.querySelectorAll(navbar + " li a, " + navbar + " li span");
383    aList.forEach(function (item) {
384        item.addEventListener("focus", function (e) {
385            // Jeśli link jest w submenu, pokaż to submenu
386            const parentLi = item.parentNode;
387            const submenu = parentLi.parentNode; // UL
388
389            if (submenu && submenu.tagName === "UL" && submenu !== document.querySelector(navbar + " > ul")) {
390                submenu.classList.add("showsub");
391                parentLi.classList.add("opensub");
392
393                // Ustaw aria-expanded na parent buttonie
394                const parentButton = submenu.previousElementSibling;
395                if (parentButton && parentButton.tagName === "BUTTON") {
396                    parentButton.setAttribute("aria-expanded", "true");
397                }
398            }
399            e.stopPropagation();
400        });
401    });
402
403    // HOVER + TIMEOUT HIDE
404    // opóźnienie chowania menu dla 2 i 3 poziomu
405    var liList = document.querySelectorAll(navbar + " li");
406
407    var hideTimeout = null;
408
409    liList.forEach(function (item) {
410        item.addEventListener("mouseenter", onEnter);
411        item.addEventListener("mouseleave", onLeave);
412
413        function onEnter(e) {
414            if (hideTimeout) {
415                clearTimeout(hideTimeout);
416                hideTimeout = null;
417            }
418
419            // Zwijamy poprzednie submenu na tym samym poziomie
420            const parentUl = item.parentNode;
421            if (parentUl) {
422                parentUl.querySelectorAll(":scope > li").forEach((sibling) => {
423                    const siblingSubmenu = sibling.querySelector("ul");
424                    if (siblingSubmenu && sibling !== item) {
425                        siblingSubmenu.classList.remove("showsub");
426                        sibling.classList.remove("opensub");
427                    }
428                });
429            }
430
431            // Otwórz submenu bieżącego elementu
432            const sub = item.querySelector("ul");
433            // var sub = item.querySelector('ul');
434            if (sub) {
435                sub.classList.add("showsub");
436            }
437
438            item.classList.add("opensub");
439
440            zMenuLoop(item.parentNode);
441            e.stopPropagation();
442        }
443
444        function onLeave(e) {
445            if (hideTimeout) {
446                clearTimeout(hideTimeout);
447            }
448
449            hideTimeout = setTimeout(function () {
450                const sub = item.querySelector('ul');
451                if (sub) {
452                sub.classList.remove('showsub');
453                // Wyczyść też wszystkie submenu w środku
454                sub.querySelectorAll('ul.showsub').forEach(nested => {
455                    nested.classList.remove('showsub');
456                });
457                // Wyczyść opensub dla wszystkich li w tym submenu
458                sub.querySelectorAll('li.opensub').forEach(li => {
459                    li.classList.remove('opensub');
460                });
461                }
462                item.classList.remove('opensub');
463            }, 300);
464        }
465    });
466}
467
468var startMenu = document.querySelectorAll(".zMenu");
469startMenu.forEach(function (el) {
470    el.classList.remove("zMenu");
471    el.className;
472    var navbar = el.className;
473    zMenu("." + navbar);
474});
475
476/*
477_       _       _                  _                       _
478____ __| | ____(_) ___ | |  ___ __      __(_)  ___  ____    _ __  | |
479|_  // _` ||_  /| |/ __|| | / _ \\ \ /\ / /| | / __||_  /   | '_ \ | |
480/ /| (_| | / / | |\__ \| || (_) |\ V  V / | || (__  / /  _ | |_) || |
481/___|\__,_|/___||_||___/|_| \___/  \_/\_/  |_| \___|/___|(_)| .__/ |_|
482                                                   |_|
483
484SET CURRENT TAB WHEN TOPBAR IS FIXED
485www.zdzislowicz.pl
486[email protected]
487
488all rights reserved
489*/
490
491function setCurrentTab() {
492    let widgetActive = "";
493    let allWidgets = document.querySelectorAll('[id^="widget"]');
494    let allMenuLinks = document.querySelectorAll(".navbar ul li a");
495    let topbarPageHeight = document.querySelector(".topbar").offsetHeight;
496

497    allWidgets.forEach(function (item) {
498        let widgetPositionTop = item.getBoundingClientRect().top;
499
500        if (widgetPositionTop < topbarPageHeight) {
501            allMenuLinks.forEach(function (link) {
502                if (link.getAttribute("data-widget-id") == item.id) {
503                    link.classList.add("current");
504                    widgetActive = item.id;
505                }
506            });
507        }
508        allMenuLinks.forEach(function (link) {
509            if (link.getAttribute("data-widget-id") != widgetActive) {
510                link.classList.remove("current");
511            }
512        });
513    });
514}
515
516window.addEventListener("DOMContentLoaded", (event) => {
517    let headerPage = document.getElementById("topbar");
518    if (headerPage != undefined && headerPage != null)
519        if (headerPage.classList.contains("fixed")) {
520            setCurrentTab();
521            window.addEventListener("scroll", function () {
522                setCurrentTab();
523            });
524
525            window.addEventListener("resize", function () {
526                setCurrentTab();
527            });
528        }
529});