adssad

partials/landing/account/dashboard.php

@@ -4,7 +4,7 @@ if (!isset($_SESSION['user_id'])) {
 }
 
 $app = app();
-$pdo = $app->pdo();
+  $pdo = $app->pdo();
 $flash = $app->flash()->get();
 $userId = (int)$_SESSION['user_id'];
 $error = '';
@@ -92,7 +92,13 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
       $zip = trim((string)($_POST['zip'] ?? ''));
       $city = trim((string)($_POST['city'] ?? ''));
       $region = trim((string)($_POST['region'] ?? ''));
+      $lat = isset($_POST['lat']) && $_POST['lat'] !== '' ? (float)$_POST['lat'] : null;
+      $lng = isset($_POST['lng']) && $_POST['lng'] !== '' ? (float)$_POST['lng'] : null;
+      if ($lat === 0.0 && $lng === 0.0 && ($_POST['lat'] === '0' || $_POST['lng'] === '0')) {
+        // keep zero if explicitly set (unlikely)
+      } elseif ($lat === null || $lng === null) {
         [$lat, $lng] = geocode_address($street, $zip, $city, $region);
+      }
 
       $stmt = $pdo->prepare('INSERT INTO events (created_by, title, teaser_public, description, location_label, street, zip, city, region, lat, lng, starts_at, allow_kids, visibility, status, created_at, updated_at) VALUES (:uid, :title, :teaser, :descr, :loc, :street, :zip, :city, :region, :lat, :lng, :start, :allow, :vis, :status, NOW(), NOW())');
       $stmt->execute([
@@ -412,6 +418,22 @@ $events = $stmt->fetchAll(PDO::FETCH_ASSOC) ?: [];
             <input id="evRegion" name="region" class="input">
           </div>
         </div>
+        <input type="hidden" id="evLat" name="lat">
+        <input type="hidden" id="evLng" name="lng">
+        <div class="stack gap-6">
+          <button class="btn ghost" type="button" id="btnMap">Auf Karte suchen</button>
+          <div id="mapWrapper" class="map-wrapper" hidden>
+            <div class="form-row">
+              <label class="label" for="mapSearch">Adresse suchen (optional)</label>
+              <div class="flex gap-8">
+                <input id="mapSearch" class="input" placeholder="Straße, PLZ, Ort">
+                <button class="btn ghost" type="button" id="btnMapSearch">Suchen</button>
+              </div>
+              <p class="muted small">Klick auf die Karte setzt den Treffpunkt. Zoom/Scroll möglich.</p>
+            </div>
+            <div id="mapContainer" class="map-container"></div>
+          </div>
+        </div>
         <div class="form-grid">
           <div class="stack gap-6">
             <label class="label" for="evVis">Sichtbarkeit</label>
@@ -452,4 +474,95 @@ $events = $stmt->fetchAll(PDO::FETCH_ASSOC) ?: [];
       if (e.target === modal) modal.classList.remove('open');
     });
   });
+
+  // Map picker for events (Leaflet)
+  const btnMap = document.getElementById('btnMap');
+  const mapWrapper = document.getElementById('mapWrapper');
+  const mapContainer = document.getElementById('mapContainer');
+  const btnMapSearch = document.getElementById('btnMapSearch');
+  const mapSearch = document.getElementById('mapSearch');
+  const latInput = document.getElementById('evLat');
+  const lngInput = document.getElementById('evLng');
+  let map, marker;
+
+  function ensureLeaflet(callback) {
+    if (window.L) { callback(); return; }
+    const css = document.createElement('link');
+    css.rel = 'stylesheet';
+    css.href = 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css';
+    document.head.appendChild(css);
+    const script = document.createElement('script');
+    script.src = 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.js';
+    script.onload = callback;
+    document.body.appendChild(script);
+  }
+
+  function initMap() {
+    if (map) { map.invalidateSize(); return; }
+    map = L.map(mapContainer).setView([51.1657, 10.4515], 6);
+    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+      maxZoom: 19,
+      attribution: '&copy; OpenStreetMap',
+    }).addTo(map);
+
+    const setMarker = (latlng) => {
+      if (marker) {
+        marker.setLatLng(latlng);
+      } else {
+        marker = L.marker(latlng, { draggable: true }).addTo(map);
+        marker.on('dragend', () => {
+          const ll = marker.getLatLng();
+          latInput.value = ll.lat.toFixed(7);
+          lngInput.value = ll.lng.toFixed(7);
+        });
+      }
+      latInput.value = latlng.lat.toFixed(7);
+      lngInput.value = latlng.lng.toFixed(7);
+    };
+
+    map.on('click', (e) => setMarker(e.latlng));
+
+    const lat = parseFloat(latInput.value);
+    const lng = parseFloat(lngInput.value);
+    if (!Number.isNaN(lat) && !Number.isNaN(lng)) {
+      setMarker({ lat, lng });
+      map.setView({ lat, lng }, 14);
+    }
+  }
+
+  btnMap?.addEventListener('click', () => {
+    mapWrapper.hidden = false;
+    ensureLeaflet(() => {
+      setTimeout(() => initMap(), 50);
+    });
+  });
+
+  btnMapSearch?.addEventListener('click', () => {
+    const q = (mapSearch?.value || '').trim();
+    if (!q) return;
+    fetch('https://nominatim.openstreetmap.org/search?format=jsonv2&limit=1&q=' + encodeURIComponent(q), {
+      headers: { 'Accept-Language': 'de', 'User-Agent': 'papa-kind-treff/1.0' },
+    })
+      .then(r => r.json())
+      .then(data => {
+        if (Array.isArray(data) && data[0]) {
+          const lat = parseFloat(data[0].lat);
+          const lng = parseFloat(data[0].lon);
+          ensureLeaflet(() => {
+            mapWrapper.hidden = false;
+            initMap();
+            if (!Number.isNaN(lat) && !Number.isNaN(lng)) {
+              map.setView([lat, lng], 15);
+              if (window.L) {
+                if (!marker) marker = L.marker([lat, lng], { draggable: true }).addTo(map);
+                marker.setLatLng([lat, lng]);
+                latInput.value = lat.toFixed(7);
+                lngInput.value = lng.toFixed(7);
+              }
+            }
+          });
+        }
+      })
+      .catch(() => {});
+  });
 </script>

public/assets/css/app.css

@@ -109,6 +109,10 @@ body {
 .btn:hover { transform: translateY(-1px); transition: transform 120ms ease; }
 .btn.ghost { border:1px solid var(--color-border); color: var(--color-text); background: #fff; }
 
+.map-wrapper { border:1px solid var(--color-border); border-radius: var(--radius-sm); padding: 12px; background:#fff; }
+.map-container { width: 100%; height: 320px; border-radius: var(--radius-sm); overflow: hidden; border:1px solid var(--color-border); }
+.leaflet-container { font-family: inherit; }
+
 .chip.inline { padding: 6px 10px; }
 
 .results .card { padding: 0; }