From 9d7f87464da4143c1c0fe67bbf0f53526c257f8d Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Fri, 13 Oct 2023 20:54:26 +0200
Subject: [PATCH 1/7] Added titles for accessibility

---
 src/components/maps/overlay/SearchMarkers.vue | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/maps/overlay/SearchMarkers.vue b/src/components/maps/overlay/SearchMarkers.vue
index f93cc51f..3b5e739b 100644
--- a/src/components/maps/overlay/SearchMarkers.vue
+++ b/src/components/maps/overlay/SearchMarkers.vue
@@ -90,16 +90,16 @@ onUpdated(() => {
     <div ref="searchBar" class="search-w" :data-focused="shouldBeActive">
         <div class="input-w">
             <i class="search-icon ph-fill ph-magnifying-glass"></i>
-            <input ref="qInput" type="text" v-model="q">
+            <input ref="qInput" name="q" type="text" v-model="q" title="Rechercher le monde">
 
-            <button data-to-players class="player-btn" tabindex="1">
+            <button data-to-players class="player-btn" tabindex="1" title="Aller à la position actuelle des joueurs">
                 <i class="pin-icon ph-fill ph-map-pin"></i>
             </button>
         </div>
 
         <ul class="search-results" v-if="shouldBeActive">
             <li v-for="m in filteredMarkers?.slice(0, 10)" :key="m.title">
-                <button class="search-item" :data-to-marker="`${m.markerCoords.x},${m.markerCoords.y}`" tabindex="0">
+                <button class="search-item" :data-to-marker="`${m.markerCoords.x},${m.markerCoords.y}`" tabindex="0" :title="`Aller à ${m.title}`">
                     <span class="title">{{ m.title }}</span>
                     <span class="desc">{{ m.description }}</span>
                 </button>
@@ -153,6 +153,15 @@ onUpdated(() => {
             color: #dc2626;
             border-radius: 50%;
             cursor: pointer;
+
+            &:hover {
+                background-color: var(--slate-200);
+            }
+
+            &:focus-visible {
+                outline: 1px dotted var(--slate-500);
+                outline: 4px auto var(--slate-900);
+            }
         }
     }
 

From 7f7fa1465a5e141f9138668ed46890082e800c20 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Fri, 13 Oct 2023 21:32:19 +0200
Subject: [PATCH 2/7] Fixed small focus bugs

---
 src/components/maps/WorldMap.astro            |  4 ++
 src/components/maps/WorldMapOverlay.astro     |  9 +---
 src/components/maps/overlay/SearchMarkers.vue | 48 ++++++++++++++-----
 src/pages/index.astro                         |  9 +---
 4 files changed, 43 insertions(+), 27 deletions(-)

diff --git a/src/components/maps/WorldMap.astro b/src/components/maps/WorldMap.astro
index a444813d..ca9ac233 100644
--- a/src/components/maps/WorldMap.astro
+++ b/src/components/maps/WorldMap.astro
@@ -204,6 +204,10 @@ body {
 .world-wrapper {
     position: fixed;
     inset: 0;
+
+    #world {
+        height: 100%;
+    }
 }
 
 .leaflet-container {
diff --git a/src/components/maps/WorldMapOverlay.astro b/src/components/maps/WorldMapOverlay.astro
index db5700db..b7fcf726 100644
--- a/src/components/maps/WorldMapOverlay.astro
+++ b/src/components/maps/WorldMapOverlay.astro
@@ -1,16 +1,9 @@
 ---
-import { allTasks } from 'nanostores';
-import { $world } from './worldStore';
-
 import SearchMarkers from "./overlay/SearchMarkers.vue";
-
-$world.listen(() => {})
-await allTasks()
-const { markers, players } = $world.get()
 ---
 
 <div class="world-overlay">
-    <SearchMarkers markers={markers} players={players} client:visible />
+    <SearchMarkers client:load />
 </div>
 
 <script>
diff --git a/src/components/maps/overlay/SearchMarkers.vue b/src/components/maps/overlay/SearchMarkers.vue
index 3b5e739b..c053394d 100644
--- a/src/components/maps/overlay/SearchMarkers.vue
+++ b/src/components/maps/overlay/SearchMarkers.vue
@@ -19,11 +19,7 @@ onMounted(() => {
     isFocused.value = true
 })
 
-const shouldBeActive = computed(() => {
-    if (q.value.length > 0) {
-        return isFocused
-    }
-})
+const shouldBeActive = computed(() => q.value.length > 0)
 
 const q = ref<string>("")
 
@@ -49,6 +45,7 @@ whenever(shortcutKeyCombo, () => {
 })
 whenever(eraseKeyCombo, () => {
     q.value = ""
+    isFocused.value = true
 })
 
 /**
@@ -90,9 +87,9 @@ onUpdated(() => {
     <div ref="searchBar" class="search-w" :data-focused="shouldBeActive">
         <div class="input-w">
             <i class="search-icon ph-fill ph-magnifying-glass"></i>
-            <input ref="qInput" name="q" type="text" v-model="q" title="Rechercher le monde">
+            <input ref="qInput" name="recherche" type="text" v-model="q" title="Rechercher le monde">
 
-            <button data-to-players class="player-btn" tabindex="1" title="Aller à la position actuelle des joueurs">
+            <button data-to-players class="player-btn" :tabindex="shouldBeActive ? 1 : 0" title="Aller à la position actuelle des joueurs">
                 <i class="pin-icon ph-fill ph-map-pin"></i>
             </button>
         </div>
@@ -112,11 +109,11 @@ onUpdated(() => {
 .search-w {
     margin-bottom: 1em;
     padding: .5rem 1.2rem;
-    width: 25%;
-    min-width: 20rem;
+    width: calc(100% - 3rem);
     background: #fff;
     border: 1px solid var(--slate-400);
     border-radius: 25px;
+    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
     pointer-events: all;
 
     .input-w {
@@ -147,6 +144,8 @@ onUpdated(() => {
         }
 
         .player-btn {
+            position: relative;
+            isolation: isolate;
             aspect-ratio: 1 / 1;
             line-height: 1;
             font-size: 1.5em;
@@ -154,13 +153,32 @@ onUpdated(() => {
             border-radius: 50%;
             cursor: pointer;
 
+            &::before {
+                display: block;
+                content: '';
+                position: absolute;
+                inset: -.4rem;
+                background-color: transparent;
+                border-radius: 50%;
+                z-index: -1;
+                outline-offset: -.2rem;
+                transition-property: background-color;
+                transition-duration: .2s;
+                transition-timing-function: ease-in-out;
+            }
+
             &:hover {
-                background-color: var(--slate-200);
+                &::before {
+                    background-color: var(--slate-300);
+                }
             }
 
             &:focus-visible {
-                outline: 1px dotted var(--slate-500);
-                outline: 4px auto var(--slate-900);
+                &::before {
+                    background-color: var(--slate-200);
+                    outline: 1px dotted var(--slate-500);
+                    outline: 4px auto var(--slate-900);
+                }
             }
         }
     }
@@ -237,4 +255,10 @@ onUpdated(() => {
         }
     }
 }
+
+@media screen and (width >= 900px) {
+    .search-w {
+        width: 29%;
+    }
+}
 </style>
\ No newline at end of file
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 8e7228cb..e8e6c7b1 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -2,14 +2,9 @@
 import Layout from '../layouts/Layout.astro';
 import WorldMap from '../components/maps/WorldMap.astro'
 import WorldMapOverlay from '../components/maps/WorldMapOverlay.astro'
-
-const fetchLandMarkers = await fetch('http://localhost:4321/api/markers.json');
-const fetchPlayersPosition = await fetch('http://localhost:4321/api/players.json');
-const landData = await fetchLandMarkers.json();
-const playerCoords = await fetchPlayersPosition.json();
 ---
 
 <Layout title="Cartographie">
-    <WorldMapOverlay markers={landData} players={playerCoords} />
-    <WorldMap markers={landData} players={playerCoords} />
+    <WorldMapOverlay />
+    <WorldMap />
 </Layout>

From da2faedd27d7272d810c0bee7baec578fbefdb7b Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sat, 14 Oct 2023 11:36:05 +0200
Subject: [PATCH 3/7] Changed deploy to node server

Afaik, Nanostores need SSR in the setup I used, so for now, the build will have to be deployed on a node server.
I could have used a full Vue app to avoid this, but oh well, nothing we can't refactor ; and it just works anyways. Plus it would have meant switching to a vue leaflet wrapper that hasn't been maintained in years.
Can always change it later.
---
 astro.config.mjs                  |   7 +-
 package-lock.json                 | 171 ++++++++++++++++++++++++++++++
 package.json                      |   1 +
 src/components/maps/worldStore.ts |  24 +++--
 4 files changed, 196 insertions(+), 7 deletions(-)

diff --git a/astro.config.mjs b/astro.config.mjs
index 2ff3bdcf..7a9cfac8 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -1,8 +1,13 @@
 import { defineConfig } from 'astro/config';
+import nodeJs from '@astrojs/node';
 
 import vue from "@astrojs/vue";
 
 // https://astro.build/config
 export default defineConfig({
-  integrations: [vue()]
+    integrations: [vue()],
+    output: 'server',
+    adapter: nodeJs({
+        mode: 'standalone'
+    }),
 });
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 915e27e6..759f7378 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
       "name": "leim-maps",
       "version": "0.0.1",
       "dependencies": {
+        "@astrojs/node": "^6.0.3",
         "@astrojs/vue": "^3.0.1",
         "@nanostores/vue": "^0.10.0",
         "@types/leaflet": "^1.9.6",
@@ -66,6 +67,18 @@
         "astro": "^3.2.3"
       }
     },
+    "node_modules/@astrojs/node": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/@astrojs/node/-/node-6.0.3.tgz",
+      "integrity": "sha512-3isB8ETX3WabAh8pY1HMnbt4e8HV9noVP4X52SlF+GycIt7YOXsUSzditjROZkrZOSfWhzsTaHh7EqbdVXqzrw==",
+      "dependencies": {
+        "send": "^0.18.0",
+        "server-destroy": "^1.0.1"
+      },
+      "peerDependencies": {
+        "astro": "^3.2.3"
+      }
+    },
     "node_modules/@astrojs/prism": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/@astrojs/prism/-/prism-3.0.0.tgz",
@@ -2045,6 +2058,14 @@
         "node": ">=4.0.0"
       }
     },
+    "node_modules/depd": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
+      "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/dequal": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
@@ -2053,6 +2074,15 @@
         "node": ">=6"
       }
     },
+    "node_modules/destroy": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
+      "integrity": "sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==",
+      "engines": {
+        "node": ">= 0.8",
+        "npm": "1.2.8000 || >= 1.4.16"
+      }
+    },
     "node_modules/detect-libc": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.2.tgz",
@@ -2093,6 +2123,11 @@
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
       "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA=="
     },
+    "node_modules/ee-first": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.4.537",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.537.tgz",
@@ -2103,6 +2138,14 @@
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.2.1.tgz",
       "integrity": "sha512-97g6QgOk8zlDRdgq1WxwgTMgEWGVAQvB5Fdpgc1MkNy56la5SKP9GsMXKDOdqwn90/41a8yPwIGk1Y6WVbeMQA=="
     },
+    "node_modules/encodeurl": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
+      "integrity": "sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/end-of-stream": {
       "version": "1.4.4",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
@@ -2161,6 +2204,11 @@
         "node": ">=6"
       }
     },
+    "node_modules/escape-html": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow=="
+    },
     "node_modules/escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
@@ -2189,6 +2237,14 @@
         "@types/estree": "^1.0.0"
       }
     },
+    "node_modules/etag": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/execa": {
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/execa/-/execa-8.0.1.tgz",
@@ -2300,6 +2356,14 @@
         "pkg-dir": "^4.2.0"
       }
     },
+    "node_modules/fresh": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
+      "integrity": "sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/fs-constants": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
@@ -2587,6 +2651,21 @@
       "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz",
       "integrity": "sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ=="
     },
+    "node_modules/http-errors": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.0.tgz",
+      "integrity": "sha512-FtwrG/euBzaEjYeRqOgly7G0qviiXoJWnvEH2Z1plBdXgbyjv34pHTSb9zoeHMyDy33+DWy5Wt9Wo+TURtOYSQ==",
+      "dependencies": {
+        "depd": "2.0.0",
+        "inherits": "2.0.4",
+        "setprototypeof": "1.2.0",
+        "statuses": "2.0.1",
+        "toidentifier": "1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/human-signals": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-5.0.0.tgz",
@@ -4182,6 +4261,17 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/on-finished": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
+      "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
+      "dependencies": {
+        "ee-first": "1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
@@ -4651,6 +4741,14 @@
       "integrity": "sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==",
       "optional": true
     },
+    "node_modules/range-parser": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
+      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/rc": {
       "version": "1.2.8",
       "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
@@ -5106,11 +5204,68 @@
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
+    "node_modules/send": {
+      "version": "0.18.0",
+      "resolved": "https://registry.npmjs.org/send/-/send-0.18.0.tgz",
+      "integrity": "sha512-qqWzuOjSFOuqPjFe4NOsMLafToQQwBSOEpS+FwEt3A2V3vKubTquT3vmLTQpFgMXp8AlFWFuP1qKaJZOtPpVXg==",
+      "dependencies": {
+        "debug": "2.6.9",
+        "depd": "2.0.0",
+        "destroy": "1.2.0",
+        "encodeurl": "~1.0.2",
+        "escape-html": "~1.0.3",
+        "etag": "~1.8.1",
+        "fresh": "0.5.2",
+        "http-errors": "2.0.0",
+        "mime": "1.6.0",
+        "ms": "2.1.3",
+        "on-finished": "2.4.1",
+        "range-parser": "~1.2.1",
+        "statuses": "2.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/send/node_modules/debug": {
+      "version": "2.6.9",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+      "dependencies": {
+        "ms": "2.0.0"
+      }
+    },
+    "node_modules/send/node_modules/debug/node_modules/ms": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A=="
+    },
+    "node_modules/send/node_modules/mime": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+      "bin": {
+        "mime": "cli.js"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/send/node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="
+    },
     "node_modules/server-destroy": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/server-destroy/-/server-destroy-1.0.1.tgz",
       "integrity": "sha512-rb+9B5YBIEzYcD6x2VKidaa+cqYBJQKnU4oe4E3ANwRRN56yk/ua1YCJT1n21NTS8w6CcOclAKNP3PhdCXKYtQ=="
     },
+    "node_modules/setprototypeof": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
+      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw=="
+    },
     "node_modules/sharp": {
       "version": "0.32.6",
       "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.32.6.tgz",
@@ -5256,6 +5411,14 @@
       "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
       "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g=="
     },
+    "node_modules/statuses": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz",
+      "integrity": "sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/stdin-discarder": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/stdin-discarder/-/stdin-discarder-0.1.0.tgz",
@@ -5456,6 +5619,14 @@
         "node": ">=8.0"
       }
     },
+    "node_modules/toidentifier": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
+      "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==",
+      "engines": {
+        "node": ">=0.6"
+      }
+    },
     "node_modules/trim-lines": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/trim-lines/-/trim-lines-3.0.1.tgz",
diff --git a/package.json b/package.json
index 9f2fc505..e71bf8aa 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
     "astro": "astro"
   },
   "dependencies": {
+    "@astrojs/node": "^6.0.3",
     "@astrojs/vue": "^3.0.1",
     "@nanostores/vue": "^0.10.0",
     "@types/leaflet": "^1.9.6",
diff --git a/src/components/maps/worldStore.ts b/src/components/maps/worldStore.ts
index 0e78f2fc..1df9a715 100644
--- a/src/components/maps/worldStore.ts
+++ b/src/components/maps/worldStore.ts
@@ -1,5 +1,5 @@
-import { deepMap, onMount, task, action } from 'nanostores'
-import type { MapCoords, MapMarker } from '../../types/Leaflet';
+import { deepMap, onMount, task } from 'nanostores'
+import type { MapMarker } from '../../types/Leaflet';
 
 export const $world = deepMap({
     markers: [] as MapMarker[],
@@ -10,12 +10,24 @@ export const $world = deepMap({
 onMount($world, () => {
     // Fetch all markers
     task(async () => {
-        const m = await fetch('http://localhost:4321/api/markers.json')
-        $world.setKey('markers', await m.json())
+        let m
+        try {
+            m = await fetch('http://localhost:4321/api/markers.json')
+
+            $world.setKey('markers', await m.json())
+        } catch (err) {
+            console.log(err)
+        }
     })
     // Fetch all player data
     task(async () => {
-        const p = await fetch('http://localhost:4321/api/players.json')
-        $world.setKey('players', await p.json())
+        let p
+        try {
+            p = await fetch('http://localhost:4321/api/players.json')
+
+            $world.setKey('players', await p.json())
+        } catch (err) {
+            console.log(err)
+        }
     })
 })

From fab55fd4046a769036232cbed76b62679641b355 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sat, 14 Oct 2023 11:40:18 +0200
Subject: [PATCH 4/7] Changed placeholder style for search

---
 src/components/maps/overlay/SearchMarkers.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/maps/overlay/SearchMarkers.vue b/src/components/maps/overlay/SearchMarkers.vue
index c053394d..5c210204 100644
--- a/src/components/maps/overlay/SearchMarkers.vue
+++ b/src/components/maps/overlay/SearchMarkers.vue
@@ -87,7 +87,7 @@ onUpdated(() => {
     <div ref="searchBar" class="search-w" :data-focused="shouldBeActive">
         <div class="input-w">
             <i class="search-icon ph-fill ph-magnifying-glass"></i>
-            <input ref="qInput" name="recherche" type="text" v-model="q" title="Rechercher le monde">
+            <input ref="qInput" name="recherche" type="text" v-model="q" title="Rechercher le monde" placeholder="Ville, point d'intérêt…">
 
             <button data-to-players class="player-btn" :tabindex="shouldBeActive ? 1 : 0" title="Aller à la position actuelle des joueurs">
                 <i class="pin-icon ph-fill ph-map-pin"></i>
@@ -131,6 +131,10 @@ onUpdated(() => {
             min-width: 10rem;
             padding-inline-start: calc($search-icon-size + $search-items-gap);
             flex-grow: 1;
+
+            &::placeholder {
+                color: var(--slate-400);
+            }
         }
 
         .search-icon {

From 02b63a3748f4b1b9eeeadd65867c875021e98000 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sat, 14 Oct 2023 14:03:09 +0200
Subject: [PATCH 5/7] Added external link marker and fix useless is:global

---
 src/assets/scss/_leaflet.scss      | 20 ++++++++++++++++----
 src/assets/scss/theme.scss         | 13 +++++++++++++
 src/components/maps/WorldMap.astro |  4 ++--
 src/layouts/Layout.astro           |  4 ++--
 4 files changed, 33 insertions(+), 8 deletions(-)

diff --git a/src/assets/scss/_leaflet.scss b/src/assets/scss/_leaflet.scss
index 6fd81eaf..29b0e268 100644
--- a/src/assets/scss/_leaflet.scss
+++ b/src/assets/scss/_leaflet.scss
@@ -8,6 +8,22 @@
     background: #f1f5f9;
 
     .leaflet-map-pane {
+        .leaflet-popup-pane {
+            .leaflet-popup-content-wrapper {
+                border-radius: .25rem;
+
+                .leaflet-popup-content {
+                    strong {
+                        margin-bottom: .25em;
+
+                        a {
+                            text-underline-offset: 2px;
+                            text-decoration: underline;
+                        }
+                    }
+                }
+            }
+        }
         .leaflet-tooltip-pane {
             .leaflet-tooltip {
                 &.capital-name {
@@ -30,7 +46,3 @@
         }
     }
 }
-
-.leaflet-popup-content-wrapper {
-    border-radius: .25rem;
-}
\ No newline at end of file
diff --git a/src/assets/scss/theme.scss b/src/assets/scss/theme.scss
index 898d4f23..9e1fe5a0 100644
--- a/src/assets/scss/theme.scss
+++ b/src/assets/scss/theme.scss
@@ -20,3 +20,16 @@ html {
     color: var(--slate-900);
 }
 
+a[href^='http'] {
+    padding-right: 1.25em;
+}
+
+a[href^='http']::after {
+    position: absolute;
+    content: "\e972";
+    font-family: 'Phosphor-Fill' !important;
+    display: inline-block;
+    width: 1em;
+    height: 1em;
+    margin-left: .25em;
+}
\ No newline at end of file
diff --git a/src/components/maps/WorldMap.astro b/src/components/maps/WorldMap.astro
index ca9ac233..29445bcc 100644
--- a/src/components/maps/WorldMap.astro
+++ b/src/components/maps/WorldMap.astro
@@ -90,11 +90,11 @@ for (let i = 0; i < markers.length; i++) {
 
     const marker = L.marker(coords, { icon: markerIcon }).addTo(map);
     const popupContent = `
-        <b>
+        <strong>
             <a href="${m.link}" target="_blank">
                 ${m.title}
             </a>
-        </b>
+        </strong>
         <br>
         ${m.description}
     `;
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index dedbbfb9..e0b772fd 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -38,6 +38,6 @@ const { title } = Astro.props;
 	</body>
 </html>
 
-<style is:global lang="scss">
-    @import '../assets/scss/theme.scss';
+<style lang="scss">
+    @use '../assets/scss/theme.scss';
 </style>

From 1f644d1586751fd7347998a2b849e5fa752afbbe Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sat, 14 Oct 2023 14:23:43 +0200
Subject: [PATCH 6/7] Stylized popup links

---
 src/assets/scss/_leaflet.scss      | 28 ++++++++++++++++++++++------
 src/components/maps/WorldMap.astro | 21 ++++++++++++++-------
 2 files changed, 36 insertions(+), 13 deletions(-)

diff --git a/src/assets/scss/_leaflet.scss b/src/assets/scss/_leaflet.scss
index 29b0e268..6e35fed5 100644
--- a/src/assets/scss/_leaflet.scss
+++ b/src/assets/scss/_leaflet.scss
@@ -13,13 +13,29 @@
                 border-radius: .25rem;
 
                 .leaflet-popup-content {
-                    strong {
-                        margin-bottom: .25em;
+                    .title {
+                        display: block;
+                        font-weight: 600;
+                        text-underline-offset: 2px;
+                        text-decoration: underline;
+                    }
 
-                        a {
-                            text-underline-offset: 2px;
-                            text-decoration: underline;
-                        }
+                    strong.title {
+                        color: #16a34a;
+                    }
+
+                    a.title:hover {
+                        text-decoration: none;
+                        color: #16a34a;
+                    }
+
+                    p {
+
+                    }
+
+                    > * + * {
+                        margin: 0;
+                        margin-top: .4em;
                     }
                 }
             }
diff --git a/src/components/maps/WorldMap.astro b/src/components/maps/WorldMap.astro
index 29445bcc..ae5a99c7 100644
--- a/src/components/maps/WorldMap.astro
+++ b/src/components/maps/WorldMap.astro
@@ -89,15 +89,22 @@ for (let i = 0; i < markers.length; i++) {
     }
 
     const marker = L.marker(coords, { icon: markerIcon }).addTo(map);
-    const popupContent = `
-        <strong>
-            <a href="${m.link}" target="_blank">
+    let popupContent = "";
+    if (m.link) {
+        popupContent = `
+            <a href="${m.link}" target="_blank" class="title">
                 ${m.title}
             </a>
-        </strong>
-        <br>
-        ${m.description}
-    `;
+            <p>${m.description}</p>
+        `;
+    } else {
+        popupContent = `
+            <strong class="title">
+                ${m.title}
+            </strong>
+            <p>${m.description}</p>
+        `;
+    }
     marker.bindPopup(popupContent).openPopup();
 
     const displayTooltip = m.group === 'capitals';

From c9672206be320d7246d768c0533cee560d836741 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sat, 14 Oct 2023 14:32:53 +0200
Subject: [PATCH 7/7] Added player popup

---
 src/assets/scss/_leaflet.scss         | 15 +++++++--------
 src/components/maps/WorldMap.astro    |  8 ++++++++
 src/components/maps/worldStore.ts     |  4 ++--
 src/pages/api/data/players.markers.ts |  1 +
 4 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/assets/scss/_leaflet.scss b/src/assets/scss/_leaflet.scss
index 6e35fed5..99b2d9df 100644
--- a/src/assets/scss/_leaflet.scss
+++ b/src/assets/scss/_leaflet.scss
@@ -16,21 +16,20 @@
                     .title {
                         display: block;
                         font-weight: 600;
-                        text-underline-offset: 2px;
-                        text-decoration: underline;
                     }
 
                     strong.title {
                         color: #16a34a;
                     }
 
-                    a.title:hover {
-                        text-decoration: none;
-                        color: #16a34a;
-                    }
-
-                    p {
+                    a.title {
+                        text-underline-offset: 2px;
+                        text-decoration: underline;
 
+                        &:hover {
+                            text-decoration: none;
+                            color: #16a34a;
+                        }
                     }
 
                     > * + * {
diff --git a/src/components/maps/WorldMap.astro b/src/components/maps/WorldMap.astro
index ae5a99c7..620f3f59 100644
--- a/src/components/maps/WorldMap.astro
+++ b/src/components/maps/WorldMap.astro
@@ -133,6 +133,14 @@ if ( players ) {
 
     const playerMarker = L.marker(playersPosition, { icon: playerIcon }).addTo(map)
     playerMarker.addTo(layerGroups['players'])
+
+    const popupContent = `
+        <strong class="title">
+            ${players.title}
+        </strong>
+        <p>${players.description}</p>
+    `;
+    playerMarker.bindPopup(popupContent).openPopup();
 }
 
 map.fitBounds(layer.getBounds());
diff --git a/src/components/maps/worldStore.ts b/src/components/maps/worldStore.ts
index 1df9a715..ac4eb589 100644
--- a/src/components/maps/worldStore.ts
+++ b/src/components/maps/worldStore.ts
@@ -1,9 +1,9 @@
 import { deepMap, onMount, task } from 'nanostores'
-import type { MapMarker } from '../../types/Leaflet';
+import type { MapMarker, PlayerMarker } from '../../types/Leaflet';
 
 export const $world = deepMap({
     markers: [] as MapMarker[],
-    players: {} as MapMarker,
+    players: {} as PlayerMarker,
 })
 
 // Fetch initial data
diff --git a/src/pages/api/data/players.markers.ts b/src/pages/api/data/players.markers.ts
index 2f08882b..b9a95b27 100644
--- a/src/pages/api/data/players.markers.ts
+++ b/src/pages/api/data/players.markers.ts
@@ -6,4 +6,5 @@ export const playerPosition: PlayerMarker = {
         x: 162.05197
     },
     title: "L'Éclipse",
+    description: "Tara Belyus, Vascylly et Adol Sulvan livrent 3 condamnés à Handany."
 }
\ No newline at end of file