Premier jet de la carte des POIs

controllers/d.poi.php

@@ -99,6 +99,28 @@ switch ($controller->splitted_url[1]) {
 		}
 		break;
 
+	case "api_list":
+	    header("Content-Type: application/json; charset=utf-8");
+
+	    $pois = new Kabano\Pois();
+	    $pois->listPois();
+
+	    $out = [];
+
+	    foreach ($pois->objs as $poi) {
+	        $out[] = [
+	            "id"        => $poi->content_id,
+	            "name"      => $poi->name,
+	            "lat"       => floatval($poi->lat),
+	            "lon"       => floatval($poi->lon),
+	            "type"      => $poi->poi_type,
+	            "permalink" => $poi->permalink
+	        ];
+	    }
+
+	    echo json_encode($out, JSON_UNESCAPED_UNICODE);
+		break;
+
 	default:
 		// Affichage / édition / suppression d’un POI
 		if ($poi->checkPermalink($controller->splitted_url[1], $user->rankIsHigher("premium"))) {

models/d.poi.php

@@ -325,7 +325,7 @@ class Pois
 	public $objs = [];
 	public $number = 0;
 
-	public function listPois($first, $count, $archive=0) {
+	public function listPois($archive=0) {
 		global $config;
 
 		$con = pg_connect("host=".$config['SQL_host']." dbname=".$config['SQL_db']." user=".$config['SQL_user']." password=".$config['SQL_pass'])
@@ -375,10 +375,10 @@ class Pois
 		if ($archive != 1)
 			$query .= " AND contents.is_public=TRUE ";
 
-		$query .= " ORDER BY content_versions.update_date DESC LIMIT $1 OFFSET $2";
+		$query .= " ORDER BY content_versions.update_date DESC";
 
 		pg_prepare($con, "pois_list", $query);
-		$result = pg_execute($con, "pois_list", array($count, $first));
+		$result = pg_execute($con, "pois_list", []);
 
 		pg_close($con);
 

views/d.map.html

@@ -7,8 +7,8 @@
 
 		<? include('blocks/d.nav.html'); ?>
 
-		<div id="advert">En cours de création<span class="dots"><span>.</span><span>.</span><span>.</span></span><br>En attendant je vous recommande <a href="https://www.refuges.info/" target="_blank">refuges.info</a></div>
+<!-- 		<div id="advert">En cours de création<span class="dots"><span>.</span><span>.</span><span>.</span></span><br>En attendant je vous recommande <a href="https://www.refuges.info/" target="_blank">refuges.info</a></div>
-
+ -->
 		<div id="mapid" style="height: 100%;"></div>
 
 		<div id="footer-credits" style="display: none;">
@@ -25,5 +25,17 @@
 
 		<? include('blocks/d.footer.html'); ?>
 
+		<script>
+		    var root = "<?=$config['rel_root_folder']?>";
+
+		    // Icônes des POIs (déjà présentes dans ton système)
+		    window.poi_icons = {
+		        <? foreach($poi_types as $type) { ?>
+		            "<?=$type[3]?>": "<?=$config['views_url']?>img/<?=$type[3]?>.svg",
+		        <? } ?>
+		        "default": "<?=$config['views_url']?>img/default.svg"
+		    };
+		</script>
+
 	</body>
 </html>

views/js/d.map.js

@@ -1,4 +1,5 @@
 var mymap;
+var markers = [];
 
 $( document ).ready(function() {
 	// Differents layers for the map
@@ -61,4 +62,69 @@ $( document ).ready(function() {
 	mymap.on('baselayerchange', function(e) {
 		$("#map-credits").html(e.layer.getAttribution());
 	});
+
+	mymap.on("zoomend", function () {
+	    var z = mymap.getZoom();
+
+	    var size = 32;
+	    if (z < 8) size = 20;
+	    if (z < 6) size = 16;
+	    if (z < 4) size = 12;
+
+	    markers.forEach(function(marker) {
+	        var icon = marker.options.icon;
+	        icon.options.iconSize = [size, size];
+	        icon.options.iconAnchor = [size/2, size];
+	        marker.setIcon(icon);
+	    });
+	});
+
+    // ---------------------------------------------------------
+    //  CHARGEMENT DES POIs
+    // ---------------------------------------------------------
+
+    $.getJSON(root + "poi/api_list", function(pois) {
+
+        var icons = {};
+
+        // Préparer les icônes
+        for (const type in window.poi_icons) {
+            icons[type] = L.icon({
+                iconUrl: window.poi_icons[type],
+                iconSize: [32, 32],
+                iconAnchor: [16, 32],
+                popupAnchor: [0, -32]
+            });
+        }
+
+        // Ajouter les POIs
+		pois.forEach(function(poi) {
+
+		    var icon = icons[poi.type] || icons["default"];
+
+		    var marker = L.marker([poi.lat, poi.lon], { icon: icon })
+		        .addTo(mymap);
+
+		    // Tooltip discret au survol
+		    marker.bindTooltip(poi.name, {
+		        direction: "top",
+		        offset: [0, -10],
+		        opacity: 0.9,
+		        className: "poi-tooltip"
+		    });
+
+		    // Clic → ouvrir la fiche directement
+		    marker.on("click", function() {
+		        window.location = root + "poi/" + poi.permalink;
+		    });
+
+		    markers.push(marker);
+		});
+
+        // Ajuster la vue
+        if (markers.length > 0) {
+            var group = L.featureGroup(markers);
+            mymap.fitBounds(group.getBounds(), { padding: [30, 30] });
+        }
+    });
 });