https://www.asiansinglesolution.com/blog/wp-content/plugins/jquery…/assets/js/jal.js?ver=6.1.4

1/* eslint-disable no-unused-expressions */
2const jalFunctions = {
3  supportsRequestAnimation: typeof window.requestAnimationFrame === "function",
4
5  fadeIn: (element, duration = 500) => {
6    element.style.removeProperty("display");
7    let display = window.getComputedStyle(element).display;
8
9    if (display === "none") display = "block";
10
11    element.style.display = display;
12    element.style.opacity = 0;
13    let last = +new Date();
14    const tick = function () {
15      element.style.opacity =
16        +element.style.opacity + (new Date() - last) / duration;
17      last = +new Date();
18      if (+element.style.opacity < 1) {
19        if (jalFunctions.supportsRequestAnimation)
20          window.requestAnimationFrame(tick);
21        else setTimeout(tick, 16);
22      }
23    };
24    tick();
25  },
26  fadeOut: (element, duration = 500) => {
27    element.style.display = "";
28    element.style.opacity = 1;
29    let last = +new Date();
30    const tick = function () {
31      element.style.opacity = Number(
32        +element.style.opacity - (new Date() - last) / duration,
33      ).toFixed(4);
34      last = +new Date();
35      if (-element.style.opacity <= 0) {
36        if (jalFunctions.supportsRequestAnimation)
37          window.requestAnimationFrame(tick);
38        else setTimeout(tick, 16);
39      } else {
40        element.style.display = "none";
41      }
42    };
43    tick();
44  },
45  fadeToggle: (target, duration = 500) => {
46    if (window.getComputedStyle(target).display === "none") {
47      return jalFunctions.fadeIn(target, duration);
48    }
49    return jalFunctions.fadeOut(target, duration);
50  },
51  slideUp: (target, duration = 500) => {
52    target.style.transitionProperty = "height, margin, padding";
53    target.style.transitionDuration = duration + "ms";
54    target.style.boxSizing = "border-box";
55    target.style.height = target.offsetHeight + "px";
56    target.offsetHeight;
57    target.style.overflow = "hidden";
58    target.style.height = 0;
59    target.style.paddingTop = 0;
60    target.style.paddingBottom = 0;
61    target.style.marginTop = 0;
62    target.style.marginBottom = 0;
63    window.setTimeout(() => {
64      target.style.display = "none";
65      target.style.removeProperty("height");
66      target.style.removeProperty("padding-top");
67      target.style.removeProperty("padding-bottom");
68      target.style.removeProperty("margin-top");
69      target.style.removeProperty("margin-bottom");
70      target.style.removeProperty("overflow");
71      target.style.removeProperty("transition-duration");
72      target.style.removeProperty("transition-property");
73    }, duration);
74  },
75  slideDown: (target, duration = 500) => {
76    target.style.removeProperty("display");
77    let display = window.getComputedStyle(target).display;
78
79    if (display === "none") display = "block";
80
81    target.style.display = display;
82    const height = target.offsetHeight;
83    target.style.overflow = "hidden";
84    target.style.height = 0;
85    target.style.paddingTop = 0;
86    target.style.paddingBottom = 0;
87    target.style.marginTop = 0;
88    target.style.marginBottom = 0;
89    target.offsetHeight;
90    target.style.boxSizing = "border-box";
91    target.style.transitionProperty = "height, margin, padding";
92    target.style.transitionDuration = duration + "ms";
93    target.style.height = height + "px";
94    target.style.removeProperty("padding-top");
95    target.style.removeProperty("padding-bottom");
96    target.style.removeProperty("margin-top");
97    target.style.removeProperty("margin-bottom");
98    window.setTimeout(() => {
99      target.style.removeProperty("height");
100      target.style.removeProperty("overflow");
101      target.style.removeProperty("transition-duration");
102      target.style.removeProperty("transition-property");
103    }, duration);
104  },
105  slideToggle: (target, duration = 500) => {
106    if (window.getComputedStyle(target).display === "none") {
107      return jalFunctions.slideDown(target, duration);
108    }
109    return jalFunctions.slideUp(target, duration);
110  },
111  showToggle: (target) => {
112    if (window.getComputedStyle(target).display === "none") {
113      target.style.removeProperty("display");
114    } else {
115      target.style.display = "none";
116    }
117  },
118  siblings(el, filterType) {
119    if (el.parentNode === null) {
120      return [];
121    }
122
123    return [...el.parentElement.children].filter((ch) => {
124      return (
125        el !== ch && ch.nodeName.toLowerCase() === filterType.toLowerCase()
126      );
127    });
128  },
129};
130
131function jsArchiveListAnimate(clickedObj, listElements, options) {
132  let toggleFunction;
133
134  switch (options.effect) {
135    case "fade":
136      toggleFunction = jalFunctions.fadeToggle;
137      break;
138    case "slide":
139      toggleFunction = jalFunctions.slideToggle;
140      break;
141    default:
142      toggleFunction = jalFunctions.showToggle;
143      break;
144  }
145

146  listElements.forEach((listElement) => {
147    if (listElement.classList.contains("jal-hide")) {
148      listElement.style.display = "none";
149      listElement.classList.remove("jal-hide");
150    }
151
152    toggleFunction(listElement);
153  });
154
155  if (clickedObj.parentNode.classList.contains("expanded")) {
156    clickedObj.parentNode.classList.remove("expanded");
157  } else {
158    clickedObj.parentNode.classList.add("expanded");
159  }
160}
161
162function jsArchiveHideOpenedLists(clickedElement) {
163  console.log("HIde opened Lists");
164  const listRoot = clickedElement.closest("ul");
165
166  if (listRoot === null) return;
167
168  listRoot
169    .querySelectorAll("li.expanded > .jaw_symbol_wrapper")
170    .forEach((expandedList) => {
171      if (expandedList !== clickedElement) expandedList.click();
172    });
173}
174
175function jsArchiveListClickEvent(options) {
176  return function (e) {
177    const target = ["jaw_symbol", "year", "month"].includes(e.target.className)
178      ? e.target.parentNode
179      : e.target;
180
181    const itemsToAnimate = jalFunctions.siblings(target, "ul");
182
183    // Item doesn't have something to expand to.
184    if (itemsToAnimate.length === 0) {
185      return true;
186    }
187
188    e.preventDefault();
189
190    if (options.accordion) {
191      jsArchiveHideOpenedLists(target);
192    }
193
194    if (target.parentNode.children[0].matches(".jaw_symbol_wrapper"))
195      target.children[0].innerHTML =
196        target.children[0].innerHTML.trim() === options.expSym
197          ? options.conSym
198          : options.expSym;
199
200    jsArchiveListAnimate(target, itemsToAnimate, options);
201    return true;
202  };
203}
204
205/**
206 * Assigns event listeners to the archive list.
207 */
208function jsArchiveListEvents() {
209  document.querySelectorAll(".jaw_widget.legacy.preload").forEach((widget) => {
210    widget.classList.remove("preload");
211
212    const options = {
213      accordion: parseInt(widget.dataset.accordion, 10) === 1,
214      effect: widget.dataset.effect,
215      expSym: widget.dataset.ex_sym,
216      conSym: widget.dataset.con_sym,
217    };
218
219    widget.querySelectorAll("a.jaw_symbol_wrapper").forEach((toggleLink) => {
220      toggleLink.addEventListener(
221        "click",
222        jsArchiveListClickEvent(options),
223        false,
224      );
225    });
226  });
227}
228
229/**
230 * Event listener for clicks, it will start applying animation and expanding items
231 * if clicked element belows to the widget.
232 */
233document.addEventListener("DOMContentLoaded", jsArchiveListEvents);