test2025

`).join(''); acList.style.display = matches.length ? 'block' : 'none'; }); acList.addEventListener('click', (e) => { const item = e.target.closest('.mpu-ac-item'); if (!item) return; const city = item.getAttribute('data-city'); focusCity(city); acList.style.display = 'none'; searchInput.value = city; }); document.addEventListener('click', (e) => { if (!e.target.closest('#mpu-ac-list') && e.target !== searchInput) { acList.style.display = 'none'; } }); // Provider-Filter-Logik providerSelect.addEventListener('change', () => { applyProviderFilter(providerSelect.value); }); // Reset document.getElementById('mpu-reset').addEventListener('click', () => { providerSelect.value = ''; searchInput.value = ''; applyProviderFilter(''); map.setView([51.163375, 10.447683], 6); updateShareLink(''); }); // Deeplink (?city=Berlin) const params = new URLSearchParams(location.search); const deeplinkCity = params.get('city'); if (deeplinkCity && byCity[deeplinkCity]) { focusCity(deeplinkCity); searchInput.value = deeplinkCity; } /* ======= FUNKTIONEN ======= */ function renderPopup(cityObj) { // Optional: nach Provider filtern, wenn Filter gesetzt const currentProvider = providerSelect?.value || ''; const list = cityObj.items .filter(x => !currentProvider || x.provider === currentProvider) .sort((a,b)=>a.provider.localeCompare(b.provider,'de')); if (!list.length) { return ` `; } const itemsHtml = list.map(x => `

${escapeHtml(x.provider)}

${escapeHtml(x.name)}

${escapeHtml(x.street)}, ${escapeHtml(x.zip)} ${escapeHtml(cityObj.city)}

${x.phone ? `☎ ${escapeHtml(x.phone)}` : ''} ${x.email ? `  •  ✉ E-Mail` : ''} ${x.website ? `  •  🌐 Website` : ''}

`).join(''); return ` `; } function focusCity(city) { const marker = cityMarkers[city]; if (!marker) return; map.setView(marker.getLatLng(), 11, { animate: true }); marker.openPopup(); updateShareLink(city); } function applyProviderFilter(provider) { // Popup neu binden, damit der Filter greift Object.values(byCity).forEach(cityObj => { const marker = cityMarkers[cityObj.city]; marker.bindPopup(renderPopup(cityObj), { minWidth: 320, maxWidth: 460, className: 'mpu-popup' }); }); // Offenes Popup (falls vorhanden) aktualisieren const opened = document.querySelector('.leaflet-popup'); if (opened) { // popup erneut öffnen const openCity = Object.keys(cityMarkers).find(c => cityMarkers[c].isPopupOpen()); if (openCity) { cityMarkers[openCity].openPopup(); } } } function updateShareLink(city) { const link = document.getElementById('mpu-sharelink'); const url = new URL(location.href); if (city) url.searchParams.set('city', city); else url.searchParams.delete('city'); link.href = url.toString(); link.onclick = (e) => { e.preventDefault(); copyToClipboard(url.toString()); link.textContent = 'Link kopiert ✓'; setTimeout(()=> link.textContent = 'Link kopieren', 1500); }; } // Hilfsfunktionen function escapeHtml(s=''){ return s.replace(/[&"']/g, m=>({ '&':'&', '':'>', '"':'"', "'":''' }[m])); } function escapeAttr(s=''){ return s.replace(/"/g, '"'); } function copyToClipboard(text) { if (navigator.clipboard && window.isSecureContext) { navigator.clipboard.writeText(text); } else { const ta = document.createElement('textarea'); ta.value = text; document.body.appendChild(ta); ta.select(); document.execCommand('copy'); document.body.removeChild(ta); } }