https://society-a.com/wp-content/themes/societya/static/mega-menu.js?ver=1.5

1document.addEventListener("mouseover", e => {
2  if (e.target.matches(".menu-first-layer-item")) {
3    let firstLayerItem = e.target.dataset.firstLayer
4    let menuSecondLayers = document.querySelectorAll(".menu-second-layer")
5
6    menuSecondLayers.forEach(secondLayer => {
7      secondLayer.classList.remove("show")
8      secondLayer.classList.add("hide")
9      secondLayer.setAttribute("aria-hidden", "true")
10      if (secondLayer.dataset.secondLayer == firstLayerItem) {
11        secondLayer.classList.add("show")
12        secondLayer.classList.remove("hide")
13        secondLayer.setAttribute("aria-hidden", "false")
14      }
15    })
16  }
17})
18
19document.addEventListener("focusin", e => {
20  if (e.target.matches(".menu-first-layer-item")) {
21    let firstLayerItem = e.target.dataset.firstLayer
22    let menuSecondLayers = document.querySelectorAll(".menu-second-layer")
23
24    menuSecondLayers.forEach(secondLayer => {
25      secondLayer.classList.remove("show")
26      secondLayer.classList.add("hide")
27      secondLayer.setAttribute("aria-hidden", "true")
28      if (secondLayer.dataset.secondLayer == firstLayerItem) {
29        secondLayer.classList.add("show")
30        secondLayer.classList.remove("hide")
31        secondLayer.setAttribute("aria-hidden", "false")
32      }
33    })
34  }
35})
36
37let header = document.querySelector(".header")
38
39header.addEventListener("mouseleave", () => {
40  let menuSecondLayers = document.querySelectorAll(".menu-second-layer")
41
42  menuSecondLayers.forEach(secondLayer => {
43    secondLayer.classList.remove("show")
44    secondLayer.classList.add("hide")
45    secondLayer.setAttribute("aria-hidden", "true")
46  })
47})
48
49/* Mobile Menu */
50
51let mobileMenuFirstLayerItems = [
52  ...document.querySelectorAll("[data-mobile-first-layer-item]"),
53]
54
55let menuDrawerCloseBtn = [...document.querySelectorAll("[data-close-btn]")]
56
57mobileMenuFirstLayerItems.forEach(firstLayerItem => {
58  let selectedMenuName = firstLayerItem.dataset.mobileFirstLayerItem;
59  let menuDrawerSecondLayer = document.querySelector(
60    `[data-drawer='${selectedMenuName}']`
61  );
62
63  // Xử lý khi click Level 1
64  firstLayerItem.addEventListener("click", e => {
65    e.preventDefault();
66
67    let menuTitle = firstLayerItem.textContent.trim();
68    let backBtnTitle = menuDrawerSecondLayer.querySelector(
69      ".menu-drawer-close-btn-wrapper .back-menu-title"
70    );
71
72    if (backBtnTitle) {
73      // Nếu có style đỏ
74      if (firstLayerItem.getAttribute("style")?.includes("color:#dd1818")) {
75        backBtnTitle.innerHTML = `<span style="color:#dd1818">${menuTitle}</span>`;
76      } else {
77        backBtnTitle.textContent = menuTitle;
78      }
79    }
80
81    openDrawer(menuDrawerSecondLayer);
82  });
83});
84menuDrawerCloseBtn.forEach(btn => {
85  selectedCloseBtnName = btn.dataset.closeBtn;
86
87  let selectedDrawer = document.querySelector(
88    `[data-drawer='${selectedCloseBtnName}']`
89  );
90  let selectedOverlay = document.querySelector(
91    `[data-overlay='${selectedCloseBtnName}']`
92  );
93
94  btn.addEventListener("click", () => {
95    // Tìm và reset .back-menu-title bên trong drawer này
96    let backMenuTitle = selectedDrawer.querySelector(".back-menu-title");
97    if (backMenuTitle) {
98      backMenuTitle.textContent = ""; // Xóa chữ
99      backMenuTitle.removeAttribute("style"); // Xóa style inline nếu có
100    }
101
102    // Đóng drawer + ẩn overlay
103    closeDrawer(selectedDrawer);
104    hide(selectedOverlay);
105  });
106});
107
108/* Overlay Touch Close */
109
110document.addEventListener("click", e => {
111  if (e.target.matches("[data-overlay]")) {
112    clickedOverlay = e.target.dataset.overlay
113    let selectedDrawer = document.querySelector(
114      `[data-drawer='${clickedOverlay}']`
115    )
116    closeDrawer(selectedDrawer)
117    hide(e.target)
118  }
119})
120
121/* Overlay for Vertical Drawer Touch Close */
122
123document.addEventListener("click", e => {
124  if (e.target.matches("[data-overlay-vertical]")) {
125    clickedOverlay = e.target.dataset.overlayVertical
126    let selectedDrawer = document.querySelector(
127      `[data-drawer-vertical='${clickedOverlay}']`
128    )
129    closeDrawerVertical(selectedDrawer)
130    hide(e.target)
131  }
132})
133
134/* Drawer Horizontal Open Button */
135
136document.addEventListener("click", e => {
137  if (e.target.matches("[data-open-btn]")) {
138    selectedOpenBtnName = e.target.dataset.openBtn
139    let selectedDrawer = document.querySelector(
140      `[data-drawer='${selectedOpenBtnName}']`
141    )
142    let selectedOverlay = document.querySelector(
143      `[data-overlay='${selectedOpenBtnName}']`
144    )
145    openDrawer(selectedDrawer)
146    show(selectedOverlay)
147  }
148})
149
150/* Drawer Vertical Open Button */
151
152document.addEventListener("click", e => {
153  if (e.target.matches("[data-open-btn-vertical]")) {
154    selectedOpenBtnName = e.target.dataset.openBtnVertical
155    console.log(selectedOpenBtnName)
156    let selectedDrawer = document.querySelector(
157      `[data-drawer-vertical='${selectedOpenBtnName}']`
158    )
159    let selectedOverlay = document.querySelector(
160      `[data-overlay-vertical='${selectedOpenBtnName}']`
161    )
162    openDrawerVertical(selectedDrawer)
163    show(selectedOverlay)
164  }
165})
166
167let searchIcon = document.querySelector(".header-icon .search-icon")
168let searchIconMobile = document.querySelector(
169  ".mobile-menu-utility .search-icon"
170)
171let searchIconCloseBtn = document.querySelector(".search-form-close-btn")
172
173/* Drawer Vertical Open Btn Event Listener */
174
175function drawerVerticalOpenEventListener(element) {
176  /* Mouse Click */
177  element.addEventListener("click", () => {
178    selectedOpenBtnName = element.dataset.openBtnVertical
179    let selectedDrawer = document.querySelector(
180      `[data-drawer-vertical='${selectedOpenBtnName}']`
181    )
182    let selectedOverlay = document.querySelector(
183      `[data-overlay-vertical='${selectedOpenBtnName}']`
184    )
185    openDrawerVertical(selectedDrawer)
186    show(selectedOverlay)
187  })
188
189  /* Keyboard Enter */
190  element.addEventListener("keydown", e => {
191    if (e.keyCode === 13) {
192      selectedOpenBtnName = element.dataset.openBtnVertical
193      let selectedDrawer = document.querySelector(
194        `[data-drawer-vertical='${selectedOpenBtnName}']`
195      )
196      let selectedOverlay = document.querySelector(
197        `[data-overlay-vertical='${selectedOpenBtnName}']`
198      )
199      openDrawerVertical(selectedDrawer)
200      show(selectedOverlay)
201    }
202  })
203}
204
205function drawerVerticalCloseEventListener(element) {
206  /* Mouse Click */
207  element.addEventListener("click", e => {
208    selectedCloseBtnName = element.dataset.closeBtnVertical
209    let selectedDrawer = document.querySelector(
210      `[data-drawer-vertical='${selectedCloseBtnName}']`
211    )
212    let selectedOverlay = document.querySelector(
213      `[data-overlay-vertical='${selectedCloseBtnName}']`
214    )
215
216    closeDrawerVertical(selectedDrawer)
217    hide(selectedOverlay)
218  })
219
220  /* Enter Key */
221
222  element.addEventListener("keydown", e => {
223    if (e.keyCode === 13) {
224      selectedCloseBtnName = element.dataset.closeBtnVertical
225      let selectedDrawer = document.querySelector(
226        `[data-drawer-vertical='${selectedCloseBtnName}']`
227      )
228      let selectedOverlay = document.querySelector(
229        `[data-overlay-vertical='${selectedCloseBtnName}']`
230      )
231      closeDrawerVertical(selectedDrawer)
232      hide(selectedOverlay)
233    }
234  })
235}
236
237document.querySelectorAll(".mobile-menu-second-layer-item").forEach(secondLayerLink => {
238  secondLayerLink.addEventListener("click", function(e) {
239    let thirdLayer = this.parentElement.nextElementSibling;
240    
241    if (thirdLayer && thirdLayer.classList.contains("mobile-menu-third-layer")) {
242      e.preventDefault(); // ngăn không load trang
243      thirdLayer.classList.toggle("show");
244    }
245  });
246});
247/* Drawer Vertical Close Btn Event Listener */
248
249drawerVerticalOpenEventListener(searchIcon)
250drawerVerticalOpenEventListener(searchIconMobile)
251drawerVerticalCloseEventListener(searchIconCloseBtn)
252
253function openDrawer(element) {

254  element.classList.add("drawer-open")
255  element.classList.remove("drawer-close")
256  element.setAttribute("aria-expanded", "true")
257}
258
259function closeDrawer(element) {
260  element.classList.remove("drawer-open")
261  element.classList.add("drawer-close")
262  element.setAttribute("aria-expanded", "false")
263}
264
265function show(element) {
266  element.classList.add("show")
267  element.classList.remove("hide")
268}
269
270function hide(element) {
271  element.classList.add("hide")
272  element.classList.remove("show")
273}
274
275function openDrawerVertical(element) {
276  element.classList.add("drawer-open-vertical")
277  element.classList.remove("drawer-close-vertical")
278  element.setAttribute("aria-expanded", "true")
279}
280
281function closeDrawerVertical(element) {
282  element.classList.remove("drawer-open-vertical")
283  element.classList.add("drawer-close-vertical")
284  element.setAttribute("aria-expanded", "false")
285}
286
287
288
289/* Currency Switcher Cache Fix */
290
291function setCookie(name, value) {
292  document.cookie = `${encodeURIComponent(name)}=${encodeURIComponent(value)}; path=/`;
293}
294
295function getCookieValue(name) {
296  var cookies = document.cookie.split("; ");
297  for (var i = 0; i < cookies.length; i++) {
298    var cookie = cookies[i].split("=");
299    if (cookie[0] === name) {
300      return decodeURIComponent(cookie[1]);
301    }
302  }
303  return null;
304}
305
306function checkAndSetCookie() {
307  var cookieNameSession = "wcaiocc_user_currency_session";
308  var cookieNameCookie = "wcaiocc_user_currency_cookie";
309
310  var sessionValue = getCookieValue(cookieNameSession);
311  if (sessionValue) {
312    setCookie(cookieNameCookie, sessionValue);
313    console.log("Cookie set successfully.");
314  } else {
315    console.log("Cookie does not exist.");
316  }
317}
318
319checkAndSetCookie();