dapelza/eventmap
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Phase 4: Filter- und Suchfunktion

Browse Source 
Neues Modul js/filters/ mit reiner Filterlogik (filterEngine.js:
applyFilters(), getDistanceKm()) und UI (filterPanel.js) fuer alle Filter
aus anforderung.md Abschnitt 3: Kategorie, Entfernung (mit "Standort
verwenden"-Button), Alter der Kinder, Kosten, Indoor/Outdoor, 5
Ausstattungsmerkmale, Aufenthaltsdauer, Mindestbewertung sowie
Freitextsuche ueber Name/Ort/Region/Adresse. Trefferzaehler, "Filter
zuruecksetzen" und "Auf Ergebnisse zoomen" ergaenzt.

Store erweitert um updateFilters()/getFilteredPlaces() (Selector).
Karte und Liste rendern jetzt die gefilterte statt die volle
Ausflugsziel-Liste; die Karten-Rerender-Optimierung vergleicht dafuer
die Trefferliste per Id-Schluessel statt nur state.places, damit reine
Filter-/Standortaenderungen ohne Places-Aenderung erkannt werden.

Layout: Filter-Panel als aufklappbares <details> auf Mobile, eigener
Grid-Bereich neben der Karte auf Desktop. docs/plan.md entsprechend
fortgeschrieben (Phase 2-5 als umgesetzt markiert, Phase 5
Navigation war bereits Teil von Phase 2).
This commit is contained in:
dapelza
2026-07-24 12:21:07 +02:00
parent 10f9170d61
commit dac952fbf9
12 changed files with 843 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+5
View File
@@ -15,6 +15,7 @@
<link rel="stylesheet" href="css/components.css" />
<link rel="stylesheet" href="css/detail.css" />
<link rel="stylesheet" href="css/form.css" />
<link rel="stylesheet" href="css/filters.css" />
<link rel="stylesheet" href="css/responsive.css" />
</head>
<body>
@@ -40,6 +41,8 @@
</div>
</section>
<div id="filter-panel" class="filter-panel" aria-label="Filter und Suche"></div>
<aside class="list-panel" aria-label="Ergebnisliste">
<h2 class="list-panel__title">Ausflugsziele</h2>
<div id="place-list" class="list-panel__content">
@@ -61,6 +64,7 @@
<script src="js/utils/dom.js"></script>
<script src="js/utils/geo.js"></script>
<script src="js/utils/id.js"></script>
<script src="js/filters/filterEngine.js"></script>
<script src="data/seed.js"></script>
<script src="js/config/constants.js"></script>
<script src="js/config/categories.js"></script>
@@ -75,6 +79,7 @@
<script src="js/ui/list.js"></script>
<script src="js/ui/detail.js"></script>
<script src="js/ui/form.js"></script>
<script src="js/filters/filterPanel.js"></script>
<script src="js/main.js"></script>
</body>
</html>