https://stadthotel-muenster.de/wp-content/themes/thecappa-child/lageplan_functions.js

1document.addEventListener('DOMContentLoaded', () => {
2
3  /* ---------------------------------------
4     ID-Gruppen
5  --------------------------------------- */
6
7  const terassen_ID = "terassen";
8
9  const CTA_GROUPS = {
10    "cta-tagung-t1-2": ["tagung-t1", "tagung-t2"],
11    "cta-tagung-t2-3": ["tagung-t2", "tagung-t3"],
12    "cta-tagung-t1-3": ["tagung-t1", "tagung-t2", "tagung-t3"]
13  };
14
15  const SINGLE_AREAS = [
16    "grosses-foyer",
17    "tagung-t1",
18    "tagung-t2",
19    "tagung-t3",
20    "kleines-foyer",
21    "konferenz-k1",
22    "konferenz-k2",
23    "konferenz-k3",
24    "konferenz-k4",
25    "konferenz-k5",
26    "konferenz-k6",
27    "konferenz-k7"
28  ];
29
30  /* ---------------------------------------
31     Helferfunktionen
32  --------------------------------------- */
33
34  function findPaths(root, id) {
35    return Array.from(root.querySelectorAll(`path[id="${id}"]`));
36  }
37
38  function addHover(el, onEnter, onLeave) {
39    el.addEventListener('pointerenter', onEnter);
40    el.addEventListener('pointerleave', onLeave);
41  }
42
43  /* ---------------------------------------
44     Hauptfunktion für ein SVG-Dokument
45  --------------------------------------- */
46
47  function setupSvg(svgRoot) {
48
49    /* ---- terassen (Gruppe) ---- */
50    const terassen = findPaths(svgRoot, terassen_ID);
51
52    if (terassen.length) {
53      const activate = () => terassen.forEach(t => t.classList.add("hover-active"));

54      const deactivate = () => terassen.forEach(t => t.classList.remove("hover-active"));
55
56      // Hover auf SVG selbst
57      terassen.forEach(t => addHover(t, activate, deactivate));
58
59      // Hover auf CTA
60      const cta = document.getElementById("cta-terassen");
61      if (cta) addHover(cta, activate, deactivate);
62    }
63
64    /* ---- Einzelbereiche ---- */
65    SINGLE_AREAS.forEach(id => {
66      const elems = findPaths(svgRoot, id);
67      if (!elems.length) return;
68
69      const activate = () => elems.forEach(e => e.classList.add("hover-active"));
70      const deactivate = () => elems.forEach(e => e.classList.remove("hover-active"));
71
72      // Hover auf SVG
73      elems.forEach(e => addHover(e, activate, deactivate));
74
75      // Hover auf CTA
76      const cta = document.getElementById(`cta-${id}`);
77      if (cta) addHover(cta, activate, deactivate);
78    });
79
80    /* ---- CTA-Gruppen (mehrere Bereiche auf einmal) ---- */
81        Object.entries(CTA_GROUPS).forEach(([ctaId, areaIds]) => {
82
83        const ctaEl = document.getElementById(ctaId);
84        if (!ctaEl) return;
85
86        // Sammle alle zugehörigen SVG-Elemente
87        const targetElems = areaIds
88            .map(id => findPaths(svgRoot, id))
89            .flat()
90            .filter(Boolean);
91
92        if (!targetElems.length) return;
93
94        const activate = () =>

94 targetElems.forEach(t => t.classList.add("hover-active"));
95        const deactivate = () => targetElems.forEach(t => t.classList.remove("hover-active"));
96
97        addHover(ctaEl, activate, deactivate);
98        });
99  }
100
101  /* ---------------------------------------
102     Inline-SVGs
103  --------------------------------------- */
104
105  setupSvg(document);
106
107  /* ---------------------------------------
108     object-eingebundene SVGs
109  --------------------------------------- */
110
111  document.querySelectorAll('object[type="image/svg+xml"]').forEach(obj => {
112    const init = () => {
113      if (!obj.contentDocument) return;
114      setupSvg(obj.contentDocument);
115    };
116    obj.contentDocument ? init() : obj.addEventListener("load", init);
117  });
118
119});
120
121  /* ---------------------------------------
122     Open PopUp on Klick
123  --------------------------------------- */
124
125document.addEventListener('DOMContentLoaded', () => {
126
127  if (typeof elementorProFrontend === 'undefined') return;
128
129  /* ---------------------------------------
130     Sprach-abhängige Popup-IDs
131  --------------------------------------- */
132
133  const POPUPS_DE = {
134    'konferenz-k1': 6726,
135    'konferenz-k2': 6951,
136    'konferenz-k3': 6955,
137    'konferenz-k4': 6954,
138    'konferenz-k5': 6959,
139    'konferenz-k6': 6960,
140    'konferenz-k7': 6962,
141    'tagung-t1': 6965,
142    'tagung-t2': 6967,
143    'tagung-t3': 6969,
144    'tagung-t1-3': 6966,
145    'tagung-t2-3': 6975,
146    'tagung-t1-2': 6971,
147    'grosses-foyer': 6978,
148    'kleines-foyer': 7487,
149    'terassen': 6976
150  };
151
152  const POPUPS_EN = {
153    'konferenz-k1': 9222,
154    'konferenz-k2': 9218,
155    'konferenz-k3': 9215,
156    'konferenz-k4': 9211,
157    'konferenz-k5': 9202,
158    'konferenz-k6': 9208,
159    'konferenz-k7': 9205,
160    'tagung-t1': 9185,
161    'tagung-t2': 9197,
162    'tagung-t3': 9194,
163    'tagung-t1-3': 9188,
164    'tagung-t2-3': 9176,
165    'tagung-t1-2': 9191,
166    'grosses-foyer': 9358,
167    'kleines-foyer': 9361,
168    'terassen': 9338
169  };
170
171  /* ---------------------------------------
172     Aktive Sprache ermitteln
173     Erkennt die Sprache anhand von:
174     1. <html lang="..."> (z. B. "de", "en", "en-US")
175     2. URL-Pfad (/en/ oder /de/)
176     3. Fallback: Deutsch
177  --------------------------------------- */
178
179  function getCurrentLanguage() {
180    const htmlLang = document.documentElement.lang || '';
181    if (htmlLang.toLowerCase().startsWith('en')) return 'en';
182
183    const path = window.location.pathname.toLowerCase();
184    if (path.includes('/en/') || path.startsWith('/en')) return 'en';
185    if (path.includes('/de/') || path.startsWith('/de')) return 'de';
186
187    return 'de'; // Fallback: Deutsch
188  }
189
190  const POPUPS = getCurrentLanguage() === 'en' ? POPUPS_EN : POPUPS_DE;
191
192  Object.entries(POPUPS).forEach(([key, popupId]) => {
193
194    const triggers = document.querySelectorAll(
195      `#cta-${key}, #${key}`
196    );
197
198    triggers.forEach(trigger => {
199      trigger.addEventListener('click', e => {
200        e.preventDefault();
201        elementorProFrontend.modules.popup.showPopup({ id: popupId });
202      });
203    });
204
205  });
206});