diff --git a/src/lib/index.ts b/src/lib/index.ts index 5c5a893..212e5c2 100644 --- a/src/lib/index.ts +++ b/src/lib/index.ts @@ -8,7 +8,7 @@ export interface GameOptions { export interface GameData { lines: [GeoJSON.Feature, string][]; - stops: GeoJSON.Feature[]; + stops: [number, number][]; stopName: string; gameId: string; } diff --git a/src/routes/game/+page.server.ts b/src/routes/game/+page.server.ts index ba89062..3cc1b28 100644 --- a/src/routes/game/+page.server.ts +++ b/src/routes/game/+page.server.ts @@ -32,8 +32,9 @@ export const load: PageServerLoad = async ({ fetch, url, platform }) => { const lineCodes = new Set(lineColors.map(([f, _]) => f.properties!.code_ligne)); const crossingStops = await getMergedStops(fetch, lineCodes); - const strippedStops = crossingStops.map((f) => { - return { ...f, properties: {} }; + const strippedStops: [number, number][] = crossingStops.map((f) => { + const coords = (f.geometry as GeoJSON.Point).coordinates; + return [coords[1], coords[0]]; }); const randomStop = crossingStops[Math.floor(Math.random() * crossingStops.length)]; diff --git a/src/routes/game/+page.svelte b/src/routes/game/+page.svelte index 216cea2..3a34884 100644 --- a/src/routes/game/+page.svelte +++ b/src/routes/game/+page.svelte @@ -23,6 +23,13 @@ function createMap(node: HTMLElement) { map = L.map(node).setView(center, 13); + function setMarker(pos: L.LatLng) { + if (map && playerMarker && !results) { + playerMarker.setLatLng(pos); + latlng = pos; + } + } + L.tileLayer(`https://basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}{r}.png`, { attribution: '© OpenStreetMap contributors © CARTO', @@ -33,17 +40,14 @@ data.gameData.lines.forEach(([feature, color]) => { L.geoJSON(feature, { style: { color } }).addTo(map!); }); - data.gameData.stops.forEach((f) => L.geoJSON(f).addTo(map!)); + data.gameData.stops.forEach((coords) => { + const marker = L.marker(coords).addTo(map!); + marker.on("click", (e) => setMarker(e.latlng)); + }); const playerMarker = L.marker([0, 0]).addTo(map); - map.on("click", (e) => { - if (map && playerMarker && !results) { - playerMarker.setLatLng(e.latlng); - latlng = e.latlng; - } - }); - + map.on("click", (e) => setMarker(e.latlng)); map.on("keydown", (e) => { if (latlng.lat !== 0 && latlng.lng !== 0 && e.originalEvent.key === " ") { checkLocation();