https://edinburghartfestival.com/wp-content/themes/abe-edinburgh-art-festival/js/mobile-nav.js?ver=1790915343

1jQuery(function ($) {
2  var $hamburger = $("#mobile_nav_hamburger");
3  var $main = $("#mobile_nav_main");
4  var $close = $(".mobile-nav-close");
5  var $child_items = $(".mobile-nav-child-item");
6  var $all_panels = $(".mobile-nav-panel");
7  var $back_links = $(".mobile-nav-back");
8
9  $hamburger.click(onHamburgerClick);
10  $close.click(onCloseClick);
11  $child_items.click(onChildClick);
12  $back_links.click(onBackClick);
13
14  // show the main menu when we click the hamburger
15  function onHamburgerClick(e) {
16    e.preventDefault();
17
18    setVisibility($main, "visible");
19
20    disableBodyScroll();
21  }
22
23  // hide the main menu and all panels when we click the close icon
24  function onCloseClick(e) {
25    e.preventDefault();
26
27    setVisibility($main, "hidden");
28    setVisibility($all_panels, "hidden");
29
30    enableBodyScroll();
31  }
32
33  // reveal panels when we click on a child link
34  function onChildClick(e) {
35    e.preventDefault();
36
37    var panel_id = $(this).data("open-panel-id");
38
39    if (!panel_id) {
40      window.location = $(this).attr("href");
41      return;
42    }
43
44    // console.log(panel_id);
45
46    revealPanel(panel_id);
47  }
48
49  // hide panels when we click 'back
50  function onBackClick(e) {
51    e.preventDefault();
52
53    setVisibility($all_panels, "hidden");
54  }
55
56  function revealPanel(id) {
57    var $panel = $('[data-panel-id="' + id + '"]');
58
59    setVisibility($panel, "visible");
60  }
61
62  // set the Tailwind setVisibility classes to hide/reveal menu elements
63  function setVisibility($element, show_or_hide) {
64    if ($element.data("is-animating") == true) {
65      return;
66    }
67
68    if (show_or_hide == "visible") {
69      $element
70        .addClass("block")
71        .removeClass("hidden")
72        .data("is-animating", true);
73
74      setTimeout(function () {
75        $element
76          .addClass("translate-x-0 block")
77          .removeClass("translate-x-full")
78          .data("is-animating", false);
79      }, 100);
80    } else {
81      $element
82        .addClass("translate-x-full")
83        .removeClass("translate-x-0")
84        .data("is-animating", true);
85
86      setTimeout(function () {
87        $element
88          .addClass("hidden")
89          .removeClass("block")
90          .data("is-animating", false);
91      }, 600);
92    }
93  }
94
95  function enableBodyScroll() {
96    $("body, html").removeClass("no-scroll");
97  }
98
99  function disableBodyScroll() {
100    $("body, html").addClass("no-scroll");
101  }
102});