From 91e34032b2272d9719891f4182dbbc03b5ee9362 Mon Sep 17 00:00:00 2001
From: Tykayn <contact@cipherbliss.com>
Date: Tue, 23 Sep 2025 11:26:44 +0200
Subject: [PATCH] change vectory tiles

---
 oedb/resources/demo.py                        |  8 +--
 oedb/resources/demo/demo_main.py              |  2 +-
 oedb/resources/demo/static/demo_styles.css    |  5 ++
 oedb/resources/demo/static/traffic.js         |  2 +-
 oedb/resources/demo/templates/stats.html      |  2 +-
 oedb/resources/demo/templates/traffic.html    | 64 +++++++++----------
 .../resources/demo/templates/view_events.html |  2 +-
 oedb/resources/event_form.py                  |  2 +-
 test_marker.html                              |  2 +-
 9 files changed, 47 insertions(+), 42 deletions(-)

diff --git a/oedb/resources/demo.py b/oedb/resources/demo.py
index 70e7490..cf35dfa 100644
--- a/oedb/resources/demo.py
+++ b/oedb/resources/demo.py
@@ -241,7 +241,7 @@ class DemoResource:
                     // Initialize the map
                     const map = new maplibregl.Map({{
                         container: 'map',
-                        style: 'https://demotiles.maplibre.org/style.json',
+                        style: 'https://tiles.openfreemap.org/styles/liberty',
                         center: [2.2137, 46.2276], // Default center (center of metropolitan France)
                         zoom: 5
                     }});
@@ -916,7 +916,7 @@ class DemoResource:
                     // Initialize the map
                     const map = new maplibregl.Map({
                         container: 'map',
-                        style: 'https://demotiles.maplibre.org/style.json',
+                        style: 'https://tiles.openfreemap.org/styles/liberty',
                         center: [2.3522, 48.8566], // Default center (Paris)
                         zoom: 4
                     });
@@ -1153,7 +1153,7 @@ class DemoResource:
                         // Initialize results map
                         const resultsMap = new maplibregl.Map({
                             container: 'resultsMap',
-                            style: 'https://demotiles.maplibre.org/style.json',
+                            style: 'https://tiles.openfreemap.org/styles/liberty',
                             center: [2.3522, 48.8566], // Default center (Paris)
                             zoom: 4
                         });
@@ -1494,7 +1494,7 @@ class DemoResource:
                     // Initialize the map
                     const map = new maplibregl.Map({
                         container: 'map',
-                        style: 'https://demotiles.maplibre.org/style.json',
+                        style: 'https://tiles.openfreemap.org/styles/liberty',
                         center: [2.3522, 48.8566], // Default center (Paris)
                         zoom: 4
                     });
diff --git a/oedb/resources/demo/demo_main.py b/oedb/resources/demo/demo_main.py
index 3df856a..5877842 100644
--- a/oedb/resources/demo/demo_main.py
+++ b/oedb/resources/demo/demo_main.py
@@ -178,7 +178,7 @@ class DemoMainResource:
                 <script>
                     // Map style URLs
                     const mapStyles = {
-                        default: 'https://demotiles.maplibre.org/style.json',
+                        default: 'https://tiles.openfreemap.org/styles/liberty',
                         osmVector: 'https://cdn.jsdelivr.net/gh/openmaptiles/osm-bright-gl-style@master/style-cdn.json',
                         osmRaster: {
                             version: 8,
diff --git a/oedb/resources/demo/static/demo_styles.css b/oedb/resources/demo/static/demo_styles.css
index 2669fc9..49f566e 100644
--- a/oedb/resources/demo/static/demo_styles.css
+++ b/oedb/resources/demo/static/demo_styles.css
@@ -510,4 +510,9 @@ input:invalid,
 select:invalid {
     border-color: #f44336;
     background-color: #fff8f8;
+}
+
+.maplibregl-popup-content{
+  min-width: 300px;
+    max-width: 95vw;
 }
\ No newline at end of file
diff --git a/oedb/resources/demo/static/traffic.js b/oedb/resources/demo/static/traffic.js
index a36aea1..746861a 100644
--- a/oedb/resources/demo/static/traffic.js
+++ b/oedb/resources/demo/static/traffic.js
@@ -37,7 +37,7 @@ function initTabs() {
 function initMap() {
 	map = new maplibregl.Map({
 		container: 'map',
-		style: 'https://demotiles.maplibre.org/style.json',
+		style: 'https://tiles.openfreemap.org/styles/liberty',
 		center: [2.2137, 46.2276],
 		zoom: 5
 	});
diff --git a/oedb/resources/demo/templates/stats.html b/oedb/resources/demo/templates/stats.html
index 59cac20..7062504 100644
--- a/oedb/resources/demo/templates/stats.html
+++ b/oedb/resources/demo/templates/stats.html
@@ -49,7 +49,7 @@
 			<script>
 				const map = new maplibregl.Map({
 					container: 'mapDiv',
-					style: 'https://demotiles.maplibre.org/style.json',
+					style: 'https://tiles.openfreemap.org/styles/liberty',
 					center: [2.3522, 48.8566],
 					zoom: 4
 				});
diff --git a/oedb/resources/demo/templates/traffic.html b/oedb/resources/demo/templates/traffic.html
index 55a653f..95c9f26 100644
--- a/oedb/resources/demo/templates/traffic.html
+++ b/oedb/resources/demo/templates/traffic.html
@@ -194,37 +194,37 @@
         
         <form id="trafficForm">
             <div class="form-group">
-                <label for="photo">Photo (optionnelle)</label>
-                <input type="file" id="photo" name="photo" accept="image/*" capture="environment">
-                <div class="note">Prenez une photo géolocalisée de la situation (mobile recommandé)</div>
-                <div id="photoPreviewContainer" style="margin-top:8px; display:none;">
-                    <img id="photoPreview" alt="Aperçu photo" style="max-width:100%; border-radius:4px;"/>
-                </div>
-                <div class="form-row" style="margin-top:8px;">
-                    <div class="form-group">
-                        <label for="panoramaxTokenInput">Token Panoramax</label>
-                        <input type="password" id="panoramaxTokenInput" placeholder="Jeton d'API Panoramax">
-                        <div class="note">Stocké en local sur cet appareil. Utilisé pour envoyer la photo.</div>
-                    </div>
-                    <div class="form-group" style="align-self:flex-end;">
-                        <button type="button" id="savePanoramaxTokenBtn">Enregistrer le token</button>
-                        <button type="button" id="showPanoramaxTokenBtn" style="display:none;">Modifier le token</button>
-                    </div>
-                </div>
-                <div class="camera-block">
-                    <label>Prendre une photo avec la caméra</label>
-                    <div class="camera-controls">
-                        <button type="button" id="startCameraBtn">Démarrer la caméra</button>
-                        <button type="button" id="capturePhotoBtn" disabled>Prendre la photo</button>
-                        <button type="button" id="stopCameraBtn" disabled>Arrêter</button>
-                    </div>
-                    <div class="camera-preview">
-                        <video id="cameraVideo" autoplay playsinline muted></video>
-                        <canvas id="cameraCanvas" style="display:none;"></canvas>
-                    </div>
-                    <div class="note">La photo capturée sera ajoutée au champ ci-dessus.</div>
-                </div>
-            </div>
+<!--                <label for="photo">Photo (optionnelle)</label>-->
+<!--                <input type="file" id="photo" name="photo" accept="image/*" capture="environment">-->
+<!--                <div class="note">Prenez une photo géolocalisée de la situation (mobile recommandé)</div>-->
+<!--                <div id="photoPreviewContainer" style="margin-top:8px; display:none;">-->
+<!--                    <img id="photoPreview" alt="Aperçu photo" style="max-width:100%; border-radius:4px;"/>-->
+<!--                </div>-->
+<!--                <div class="form-row" style="margin-top:8px;">-->
+<!--                    <div class="form-group">-->
+<!--                        <label for="panoramaxTokenInput">Token Panoramax</label>-->
+<!--                        <input type="password" id="panoramaxTokenInput" placeholder="Jeton d'API Panoramax">-->
+<!--                        <div class="note">Stocké en local sur cet appareil. Utilisé pour envoyer la photo.</div>-->
+<!--                    </div>-->
+<!--                    <div class="form-group" style="align-self:flex-end;">-->
+<!--                        <button type="button" id="savePanoramaxTokenBtn">Enregistrer le token</button>-->
+<!--                        <button type="button" id="showPanoramaxTokenBtn" style="display:none;">Modifier le token</button>-->
+<!--                    </div>-->
+<!--                </div>-->
+<!--                <div class="camera-block">-->
+<!--                    <label>Prendre une photo avec la caméra</label>-->
+<!--                    <div class="camera-controls">-->
+<!--                        <button type="button" id="startCameraBtn">Démarrer la caméra</button>-->
+<!--                        <button type="button" id="capturePhotoBtn" disabled>Prendre la photo</button>-->
+<!--                        <button type="button" id="stopCameraBtn" disabled>Arrêter</button>-->
+<!--                    </div>-->
+<!--                    <div class="camera-preview">-->
+<!--                        <video id="cameraVideo" autoplay playsinline muted></video>-->
+<!--                        <canvas id="cameraCanvas" style="display:none;"></canvas>-->
+<!--                    </div>-->
+<!--                    <div class="note">La photo capturée sera ajoutée au champ ci-dessus.</div>-->
+<!--                </div>-->
+<!--            </div>-->
             <div class="form-group">
                 <label for="label" class="required">Description du problème</label>
                 <input type="text" id="label" name="label" placeholder="e.g., Large pothole on Highway A1" required>
@@ -344,7 +344,7 @@
         // Initialize the map
         const map = new maplibregl.Map({
             container: 'map',
-            style: 'https://demotiles.maplibre.org/style.json',
+            style: 'https://tiles.openfreemap.org/styles/liberty',
             center: [2.2137, 46.2276], // Default center (center of metropolitan France)
             zoom: 5
         });
diff --git a/oedb/resources/demo/templates/view_events.html b/oedb/resources/demo/templates/view_events.html
index 52a525f..8079595 100644
--- a/oedb/resources/demo/templates/view_events.html
+++ b/oedb/resources/demo/templates/view_events.html
@@ -73,7 +73,7 @@
         // Initialize the map
         const map = new maplibregl.Map({
             container: 'map',
-            style: 'https://demotiles.maplibre.org/style.json',
+            style: 'https://tiles.openfreemap.org/styles/liberty',
             center: [2.2137, 46.2276], // Default center (center of metropolitan France)
             zoom: 5
         });
diff --git a/oedb/resources/event_form.py b/oedb/resources/event_form.py
index db73ad6..bab9360 100644
--- a/oedb/resources/event_form.py
+++ b/oedb/resources/event_form.py
@@ -227,7 +227,7 @@ class EventFormResource:
                     // Initialize the map
                     const map = new maplibregl.Map({
                         container: 'map',
-                        style: 'https://demotiles.maplibre.org/style.json',
+                        style: 'https://tiles.openfreemap.org/styles/liberty',
                         center: [2.2137, 46.2276], // Default center (center of metropolitan France)
                         zoom: 5
                     });
diff --git a/test_marker.html b/test_marker.html
index 47e586f..121ad79 100644
--- a/test_marker.html
+++ b/test_marker.html
@@ -40,7 +40,7 @@
         // Initialize the map
         const map = new maplibregl.Map({
             container: 'map',
-            style: 'https://demotiles.maplibre.org/style.json',
+            style: 'https://tiles.openfreemap.org/styles/liberty',
             center: [2.2137, 46.2276], // Default center (center of metropolitan France)
             zoom: 5
         });