https://www.zm-online.de/typo3conf/ext/lns_gadgets/Resources/Public/JavaScript/click.js

1/*! data-type: toggle, toogle-group, highcontrastmode */
2(function() {
3  'use strict';
4
5  /* toggle */
6  // data-dest: toggle element querySelector
7  // data-classname: toggle classname
8  function toggle(event) {
9    function findClosest(el, s) {
10      var dest = null;
11      do {
12        dest = el.querySelector(s);
13        if (dest) return dest;
14        el = el.parentElement || el.parentNode;
15      } while (el !== null && el.nodeType === 1);
16      return null;
17    }
18    let el = this;
19    if (this.dataset.dest) {
20      el = findClosest(el, this.dataset.dest);
21    }
22    if (!el) {
23      el = this;
24    }
25    let className = (this.dataset.classname ? this.dataset.classname : 'hidden');
26    el.classList.toggle(className);
27  }
28
29  // add event listener to all toggle elements
30  let els = document.querySelectorAll("[data-type='toggle']");
31  for (let i = 0; i < els.length; i++) {
32    els[i].addEventListener('click', toggle);
33  }
34
35  /* togglegroup */
36  // data-classname: toogle classname
37  function tooglegroup (group) {
38    var current = -1;
39    var items = group.querySelectorAll("[data-type='toggle-item']");
40    var trigger = group.querySelectorAll("[data-type='toggle-trigger']");
41    function toggle(event) {
42      trigger[current].classList.remove("active");
43      items[current].classList.remove("active");
44      current = this.itemid;
45      trigger[current].classList.add("active");
46      items[current].classList.add("active");
47      event.stopPropagation();
48    }
49    for (var i=0; i<items.length; i++) {
50      if (items[i].classList.contains("active")) {
51        if (current > -1) {
52          items[i].classList.remove("active");
53        } else {
54          current = i;
55        }
56      };
57      trigger[i].setAttribute('tabindex', '0');
58      if (i == current) {
59        trigger[i].classList.add("active");
60      } else {
61        trigger[i].classList.remove("active");
62      }
63      trigger[i].itemid = i;
64      trigger[i].addEventListener('click', toggle);
65    }
66  }
67  // add event listener to all toggle elements
68  els = document.querySelectorAll("[data-type='toggle-group']");
69  for (let i = 0; i < els.length; i++) {
70    new tooglegroup(els[i]);
71  }
72
73  /* highcontrastmode */
74  function highcontrastMode(event) {
75    if (document.body.classList.contains('highcontrast-mode')) {
76      document.body.classList.remove('highcontrast-mode');
77      localStorage.setItem('highcontrast-mode', 'false');
78    } else {
79      document.body.classList.add('highcontrast-mode');
80      localStorage.setItem('highcontrast-mode', 'true');
81    }
82  }
83
84  // add event listener to all highcontrastmode buttons
85  var hcm = document.querySelectorAll("[data-type='highcontrastmode']");
86  if (hcm) {
87    for (let i = 0; i < hcm.length; i++) {
88      hcm[i].addEventListener('click', highcontrastMode);
89    }
90    if (localStorage.getItem('highcontrast-mode') &&
91      (localStorage.getItem('highcontrast-mode') == 'true')) {
92      document.body.classList.add('highcontrast-mode');
93    }
94  }
95
96})();