`; }, }, m = Object.entries(r) .map(([h, { title: T, tooltipText: E }]) => p.categoryItem(h, T, E || "") ) .join(""); (n.categoryList.innerHTML = m), (n.categoryTooltips = Array.from( e.querySelectorAll(".compare-category-tooltip") )); }, M = (p) => { if (!n.swiperWrapper) return; const m = p.map(w).join(""); n.swiperWrapper.innerHTML = m; }, w = (p) => { const m = (I) => !Array.isArray(I) || I.length === 0 ? "" : `^{${I.map( (R) => `${R}` ).join("")}}`, h = { specItem: (I, R, V) => { const G = r[I].title || "", _ = m(V); return `

${G} ${R}${_}

`; }, thumbnail: ({ name: I, code: R, imgPath: V, link: G }) => ` `, learnMore: ({ name: I, learnMoreLabel: R, link: V, code: G, }) => ` `, }, { name: T, code: E, imgPath: B, link: $, learnMoreLabel: D, spec: z, } = p, q = h.thumbnail({ name: T, code: E, imgPath: B, link: $ }), N = z && Object.entries(z) .map(([I, { text: R, sup: V }]) => h.specItem(I, R, V)) .join(""), j = h.learnMore({ name: T, link: $, learnMoreLabel: D, code: E }); return ` `; }, y = () => { if (!n.dropdownInner || !n.dropdownInner.length) return; const p = { dropdownItem: (m, h, T) => m ? T ? `

${m}

` : `${m}` : "", dropdownList: (m, h, T) => { m.forEach((E, B) => { const $ = s[B], D = i .map((z) => p.dropdownItem(z.name, z.name === $, T)) .join(""); (h[B].innerText = $), (E.innerHTML = D); }); }, }; p.dropdownList(n.dropdownInner, n.dropdownTexts, !0), p.dropdownList(n.mobileDropdowns, n.dropdownTexts, !1); }, C = () => { var T; const p = a.activePanelType === "compare"; n.selectPanel.classList.toggle("is-active", p), n.tabButtons.forEach((E) => { const B = a.activePanelType === E.getAttribute("data-tab"); E.classList.toggle("is-active", B), E.setAttribute("aria-selected", B.toString()); }); const m = (T = n.tabButtons.find( (E) => E.getAttribute("data-tab") === a.activePanelType )) == null ? void 0 : T.innerText; n.containerTitle.innerText = m || ""; let h = []; a.currentOption && (a.currentOption.panelType === "lineup" ? (h = i) : a.currentOption.panelType === "compare" && (h = i .filter((E) => s.length > 0 ? E.name && s.includes(E.name) : E ) .slice(0, a.currentOption.maxSlideLength)), h.length > 0 && (M(h), S())); }, S = () => { n.compareSection && Object.keys(r).forEach((p) => { const m = n.compareSection.querySelectorAll( `[data-category="${p}"]` ); m.forEach((T) => { T && (T.style.height = ""); }); const h = Math.max( ...Array.from(m).map((T) => T.clientHeight || 0) ); m.forEach((T) => { T && (T.style.height = `${h}px`); }); }); }, k = () => { const p = f .filter((m) => m.panelType === a.activePanelType) .find((m) => m.device === a.deviceType); a.currentOption = p; }, O = (p, m) => { const h = { optionItem: ".select-list-option" }, T = { dropdown: p, comparePanel: e.querySelector(".vd-compare-list-inner"), dropdownList: p.querySelector(".vd-compare-select-list"), dropdownInnerList: p.querySelector(".select-list-inner"), toggleButton: p.querySelector(".select-button"), optionButtons: Array.from( p.querySelectorAll(".select-option-button") ), moSelectbox: p.querySelector(".hidden-list"), titleText: p.querySelector(".select-text"), }; let E = !1; const B = m, $ = (I) => { T.optionButtons.forEach((R) => { var G; const V = I === R.getAttribute("data-role-model"); R.setAttribute("aria-selected", V.toString()), (G = R.closest(h.optionItem)) == null || G.classList.toggle("is-selected", V); }), q(I), S(), a.deviceType === "pc" && D(); }, D = () => { (E = !E), T.toggleButton.focus(), z(E); }, z = (I) => { T.dropdown.classList.toggle("is-open", I), T.toggleButton.setAttribute("aria-expanded", I.toString()), T.dropdownList.setAttribute("aria-hidden", (!I).toString()); }, q = (I) => { T.titleText.innerText = I; const R = i.find(({ name: _ }) => _ === I), V = n.compareSection.querySelector(".swiper-wrapper"), G = V ? V.children[B] : null; if (G && R) { const _ = w(R), de = document.createElement("div"); de.innerHTML = _.trim(); const ue = de.firstChild; ue && (V == null || V.replaceChild(ue, G)); } }, N = () => { (E = !1), z(E); const I = s[B]; (T.titleText.innerText = I), T.optionButtons.forEach((R) => { var _; const G = R.getAttribute("data-role-model") === I; R.setAttribute("aria-selected", G.toString()), (_ = R.closest(h.optionItem)) == null || _.classList.toggle("is-selected", G); }), (T.moSelectbox.value = I); }, j = () => { T.dropdownInnerList && (T.toggleButton.addEventListener("click", D), T.optionButtons.forEach((I) => { const R = I.getAttribute("data-role-model"); R && I.addEventListener("click", () => $(R)); }), T.moSelectbox.addEventListener("change", (I) => { const R = I.target.value; $(R); })); }; return j(), { init: j, reset: N }; }, H = (p) => { const m = { openButton: ".compare-tooltip-btn", closeButton: ".compare-tooltip-close", layer: ".compare-tooltip-layer", }, h = { tooltip: p, openButton: p.querySelector(m.openButton), closeButton: p.querySelector(m.closeButton), layer: p.querySelector(m.layer), }, T = () => { h.layer && (D(!0), h.closeButton.focus()); }, E = () => { D(!1), h.openButton.focus(); }, B = (q) => { const N = q.target; !h.layer.contains(N) && !h.openButton.contains(N) && D(!1); }, $ = (q) => { const N = q.relatedTarget; h.layer.contains(N) || D(!1); }, D = (q) => { let N = null; N && clearTimeout(N), (N = setTimeout(() => { h.layer.setAttribute("aria-hidden", q ? "false" : "true"), h.closeButton.setAttribute("tabindex", q ? "0" : "-1"); }, 100)), h.openButton.classList.toggle("tooltip-active", q), h.layer.toggleAttribute("hidden", !q), q ? (h.layer.addEventListener("focusout", $), h.closeButton.addEventListener("click", E, { once: !0 }), document.addEventListener("click", B)) : (h.layer.removeEventListener("focusout", $), document.removeEventListener("click", B)); }; (() => { h.openButton.addEventListener("click", T); })(); }, v = { event: { bind: () => { const { prev: p, next: m } = v.handle.click; n.swiperPrevButton && n.swiperNextButton && (n.swiperPrevButton.addEventListener("click", p), n.swiperNextButton.addEventListener("click", m)); }, unbind: () => { const { prev: p, next: m } = v.handle.click; n.swiperPrevButton && n.swiperNextButton && (n.swiperPrevButton.removeEventListener("click", p), n.swiperNextButton.removeEventListener("click", m)); }, }, handle: { init: () => { if (!l) return; const { slides: p } = l; (u.slides = Array.from(p)), v.a11y.update(), v.a11y.navigattion(), l.update(); }, click: { prev: () => { l && (l.slidePrev(), n.swiperNextButton && u.isBeginning && n.swiperNextButton.focus()); }, next: () => { l && (l.slideNext(), n.swiperPrevButton && l.isEnd && n.swiperPrevButton.focus()); }, }, }, a11y: { update: () => { const p = u.slides; if (!l || (p && p.length === 0)) return; const { translate: m, width: h } = l; p.forEach((T, E) => { if (!l) return; const B = p ? l.slidesGrid[E] : 0, $ = B + T.offsetWidth; let D = B >= -m && $ <= -m + h; ((u.isBeginning && E === 0) || (u.isEnd && E === p.length - 1)) && (D = !0), T.setAttribute("aria-hidden", D ? "false" : "true"); const z = T.querySelectorAll( "a, button, input, select, iframe" ); Array.from(z).forEach((q) => v.a11y.toggle(q, !D)); }); }, reset: () => { (n.swiperSlides = e.querySelectorAll(".swiper-slide")), n.swiperSlides.forEach((p) => { p.removeAttribute("aria-hidden"); const m = p.querySelectorAll( "a, button, input, select, iframe" ); Array.from(m).forEach((h) => v.a11y.toggle(h, !1)); }); }, toggle: (p, m) => { p.setAttribute("aria-hidden", m.toString()), p.setAttribute("tabIndex", m ? "-1" : "0"); }, navigattion: () => { const { swiperPrevButton: p, swiperNextButton: m, compareProduct: h, } = n; if (!p || !m) return; const T = u.isBeginning, E = u.isEnd; (p.disabled = T), (m.disabled = E), h.classList.toggle("prev-item", !T), h.classList.toggle("next-item", !E), v.a11y.toggle(p, T), v.a11y.toggle(m, E); }, }, }, b = () => { const p = () => { l || !n.swiperContainer || ((l = new ne(n.swiperContainer, c)), l && (l.on("snapIndexChange", h), l.on("init", v.handle.init), l.init(), v.event.bind())); }, m = () => { l && (v.event.unbind(), l.destroy(!0), (l = null), (u.snapIndex = 0), v.a11y.reset()); }, h = () => { if (!l) return; const { snapIndex: T, isBeginning: E, isEnd: B } = l; (u.snapIndex = T), (u.isBeginning = E), (u.isEnd = B), v.a11y.update(), v.a11y.navigattion(); }; return { init: p, destroy: m }; }; (() => { var p; A(), y(), C(), (p = n.container) == null || p.classList.add(a.currentOption.panelType), a.currentOption.panelType === "lineup" && a.minSlideLength < i.length && b().init(), d(); })(); }), Q(() => { const t = { disclaimerList: ".mkt-disclaimer-list", disclaimerItem: ".mkt-disclaimer-list-item", supTopBtn: ".mkt-disclaimer-button", }, e = { supHref: "data-sup-href", supClass: "data-sup-class", supTag: "data-sup-tag", sup: "data-sup", buttonCopy: "data-button-copy", taggingLogo: "data-tagging", }, r = { isActive: "is-active", blind: "blind" }, i = { clickedSup: null }, s = Array.from(document.querySelectorAll("sup")).filter( (w) => w.hasAttribute(e.supHref) && w.hasAttribute(e.supClass) ), n = { supList: s, supClicker: s.reduce( (w, y) => [...w, ...Array.from(y.querySelectorAll("a"))], [] ), disclaimerList: document.querySelector(t.disclaimerList), disclaimerItem: Array.from( document.querySelectorAll(t.disclaimerItem) ), }, o = { antr: "disclaimer-vd marketing page-back to top-content_click", anca: "content click", anac: "feature", anla: ":disclaimer:back to top", }, a = () => { l(), n.supList.forEach((w) => { u(w), c(w); }), f(); }, l = () => { var C, S; const w = ((C = n.disclaimerList) == null ? void 0 : C.getAttribute(e.buttonCopy)) ?? "", y = ((S = n.disclaimerList) == null ? void 0 : S.getAttribute(e.taggingLogo)) ?? ""; n.disclaimerItem.forEach((k) => { const O = document.createElement("button"); (O.type = "button"), (O.className = "mkt-disclaimer-button"), O.setAttribute("an-tr", o.antr), O.setAttribute("an-ca", o.anca), O.setAttribute("an-ac", o.anac), O.setAttribute("an-la", o.anla.replace("", y)); const H = document.createElement("span"); (H.className = "blind"), (H.innerText = w), O.appendChild(H), k.appendChild(O); }); }, u = (w) => { const y = w.getAttribute(e.supHref), C = w.getAttribute(e.supClass), { supTitle: S } = window.__MKT_GLOBAL_VARS__.disclaimer; Array.from(w.querySelectorAll("a")).forEach((O) => { (O.href = y), O.classList.add(C), (O.title = S); }); }, c = (w) => { const S = Array.from(w.querySelectorAll("a")) .filter((H) => { const v = H.getAttribute(e.supTag); return ( n.disclaimerItem.find( (b) => b.getAttribute(e.sup) === v ) !== void 0 ); }) .sort((H, v) => { const b = H.getAttribute(e.supTag), x = v.getAttribute(e.supTag), p = n.disclaimerItem.find( (E) => E.getAttribute(e.sup) === b ), m = n.disclaimerItem.find( (E) => E.getAttribute(e.sup) === x ), h = n.disclaimerItem.indexOf(p), T = n.disclaimerItem.indexOf(m); return h - T; }), k = document.createDocumentFragment(); S.forEach((H) => { k.appendChild(H); }), (w.innerHTML = ""), w.appendChild(k); let O = !0; Array.from(w.querySelectorAll("a")).forEach((H) => { const v = H.getAttribute(e.supTag), b = n.disclaimerItem.find((x) => x.getAttribute(e.sup) === v); (H.textContent = (n.disclaimerItem.indexOf(b) + 1).toString()), O ? (O = !1) : H.insertAdjacentText("beforebegin", ", "); }); }, f = () => { n.supClicker.forEach((y) => { y.addEventListener("click", d); }), Array.from(document.querySelectorAll(t.supTopBtn)).forEach((y) => y.addEventListener("click", g) ); }, d = (w) => { if ((w.preventDefault(), !w.target)) return; const y = w.target; i.clickedSup = y; const C = y.getAttribute(e.supTag), S = n.disclaimerItem.find((k) => k.getAttribute(e.sup) === C); S && L(S); }, g = (w) => { if ((w.preventDefault(), !w.target)) return; w.target.closest(t.disclaimerItem).classList.remove(r.isActive); const S = i.clickedSup; if (!S) return; const k = () => { A(S), S.removeEventListener("focusin", k); }; M(S) || S.addEventListener("focusin", k), setTimeout(() => { S.focus(); }, 0); }, L = (w) => { const y = w.querySelector("span"); if (!y) return; const C = y.textContent; y.textContent = ""; const S = document.createElement("a"); (S.textContent = C), S.setAttribute("tabindex", "0"), y.appendChild(S); const k = () => { A(y), y.removeEventListener("focusin", k); }, O = () => { (y.textContent = C), y.removeEventListener("focusout", O); }; M(y) || y.addEventListener("focusin", k), y.addEventListener("focusout", O), setTimeout(() => { const H = w.querySelector("a"); H && H.focus(); }, 0), n.disclaimerItem.forEach((H) => H.classList.remove(r.isActive)), w.classList.add(r.isActive); }, A = (w) => { const y = w.getBoundingClientRect(), C = window.innerHeight || document.documentElement.clientHeight, S = window.scrollY || document.documentElement.scrollTop, k = y.top + S - C / 2 + y.height / 2; window.scrollTo({ top: k, behavior: "auto" }); }, M = (w) => { const y = w.getBoundingClientRect(), C = window.innerHeight || document.documentElement.clientHeight; return y.top >= 0 && y.bottom <= C; }; a(); }); });