From 533d52a24e48da73219b294d7a7d38665a3f3bce Mon Sep 17 00:00:00 2001
From: Jean-Marie Favreau <j-marie.favreau@uca.fr>
Date: Sat, 6 Jul 2024 16:40:48 +0200
Subject: [PATCH] Interactions avec la carte

---
 src/agenda_culturel/static/style.scss             |  5 +++++
 .../templates/agenda_culturel/place_list.html     | 15 ++++++++-------
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/agenda_culturel/static/style.scss b/src/agenda_culturel/static/style.scss
index e5589e3..c8296b9 100644
--- a/src/agenda_culturel/static/style.scss
+++ b/src/agenda_culturel/static/style.scss
@@ -865,4 +865,9 @@ table .buttons {
 
 #filters #id_city {
     columns: 4;
+}
+
+.vertical-max {
+    height: 100vh;
+    overflow-y: scroll;
 }
\ No newline at end of file
diff --git a/src/agenda_culturel/templates/agenda_culturel/place_list.html b/src/agenda_culturel/templates/agenda_culturel/place_list.html
index 45b2237..a467184 100644
--- a/src/agenda_culturel/templates/agenda_culturel/place_list.html
+++ b/src/agenda_culturel/templates/agenda_culturel/place_list.html
@@ -8,7 +8,6 @@
 {% block entete_header %}
     {% css_categories %}
     <script src="/static/admin/js/vendor/jquery/jquery.js"></script>
-    <script src="/static/admin/js/jquery.init.js"></script>
     <script src="{% static 'location_field/leaflet/leaflet.js' %}"></script>
     <link href="{% static 'location_field/leaflet/leaflet.css' %}" type="text/css" media="all" rel="stylesheet">
 {% endblock %}
@@ -16,8 +15,6 @@
 {% block fluid %}{% endblock %}
 
 {% block content %}
-<article>{% include "agenda_culturel/static_content.html" with name="places" url_path="/places" %}</article>
-
 
 
 <article>
@@ -33,10 +30,10 @@
         <div id="map_location" style="width: 100%; aspect-ratio: 16/16"></div>
 
 
-        <div>
+        <div class="vertical-max">
         {% if object_list %}
         {% for place in object_list %}
-            <h3><a href="{% url 'view_place' place.pk %}">{{ place.name }}</a></h3>
+            <h3><a href="{% url 'view_place' place.pk %}">{{ place.name }}</a> — <a id="open-map-{{ place.id }}" href="#map_location" data-tooltip="afficher sur la carte">{% picto_from_name "map" %}</a></h3>
             <ul>
                 <li><strong>Adresse&nbsp;:</strong> {% if place.address %}{{ place.address }}, {% endif %}{{ place.city }}</li>
                 <li><strong>Coordonnée GPS&nbsp;:</strong> {{ place.location }}</li>
@@ -61,13 +58,17 @@
         maxZoom: 19,
         attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
     }).addTo(map);
-    var markerArray = [];
+    markerArray = [];
+    window.mMapping = {};
     {% if object_list %}
         {% for place in object_list %}
         markerArray.push(L.marker([{{ place.location }}]).bindPopup('<a href="{% url 'view_place' place.pk %}">{{ place.name }}</a><br />{% if place.address %}{{ place.address }}, {% endif %}{{ place.city }}'));
+        window.mMapping[{{ place.id }}] = markerArray[markerArray.length - 1];
+        window.jQuery('a#open-map-{{ place.id }}').click(function(){ window.mMapping[{{ place.id }}].openPopup();});
         {% endfor %}
     {% endif %}
-    var group = L.featureGroup(markerArray).addTo(map);
+    var group = L.featureGroup(window.markerArray).addTo(map);
     map.fitBounds(group.getBounds());
+
 </script>
 {% endblock %}
\ No newline at end of file