From ca65d2986ee2201d0ea7b5192df2746fba49d2f5 Mon Sep 17 00:00:00 2001 From: "Federico Pasqua (eisterman)" Date: Mon, 24 Mar 2025 18:53:57 +0100 Subject: [PATCH] First Layout with Leaflet map and centered slot for overlays --- package.json | 4 ++- pnpm-lock.yaml | 23 +++++++++++++++++ src/app.html | 18 +++++++------- src/routes/+page.svelte | 4 +-- src/routes/[qrcode]/+layout.svelte | 40 ++++++++++++++++++++++++++++++ src/routes/[qrcode]/+layout.ts | 19 ++++++++++++++ src/routes/[qrcode]/+page.svelte | 3 +++ src/routes/[qrcode]/Map.svelte | 28 +++++++++++++++++++++ 8 files changed, 127 insertions(+), 12 deletions(-) create mode 100644 src/routes/[qrcode]/+layout.svelte create mode 100644 src/routes/[qrcode]/+layout.ts create mode 100644 src/routes/[qrcode]/+page.svelte create mode 100644 src/routes/[qrcode]/Map.svelte diff --git a/package.json b/package.json index 061f4cc..933e674 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "@sveltejs/kit": "^2.16.0", "@sveltejs/vite-plugin-svelte": "^5.0.0", "@tailwindcss/vite": "^4.0.0", + "@types/leaflet": "^1.9.17", "daisyui": "^5.0.9", "eslint": "^9.18.0", "eslint-plugin-svelte": "^3.0.0", @@ -34,7 +35,8 @@ "dependencies": { "@inlang/paraglide-js": "^2.0.0", "arktype": "^2.1.12", - "formsnap": "^2.0.0" + "formsnap": "^2.0.0", + "leaflet": "^1.9.4" }, "pnpm": { "onlyBuiltDependencies": [ diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5035109..1d1c316 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -17,6 +17,9 @@ importers: formsnap: specifier: ^2.0.0 version: 2.0.0(svelte@5.25.3)(sveltekit-superforms@2.24.0(@sveltejs/kit@2.20.2(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.25.3)(vite@6.2.3(jiti@2.4.2)(lightningcss@1.29.2)))(svelte@5.25.3)(vite@6.2.3(jiti@2.4.2)(lightningcss@1.29.2)))(@types/json-schema@7.0.15)(svelte@5.25.3)(typescript@5.8.2)) + leaflet: + specifier: ^1.9.4 + version: 1.9.4 devDependencies: '@eslint/compat': specifier: ^1.2.5 @@ -36,6 +39,9 @@ importers: '@tailwindcss/vite': specifier: ^4.0.0 version: 4.0.15(vite@6.2.3(jiti@2.4.2)(lightningcss@1.29.2)) + '@types/leaflet': + specifier: ^1.9.17 + version: 1.9.17 daisyui: specifier: ^5.0.9 version: 5.0.9 @@ -614,9 +620,15 @@ packages: '@types/estree@1.0.7': resolution: {integrity: sha512-w28IoSUCJpidD/TGviZwwMJckNESJZXFu7NBZ5YJ4mEUnNraUn9Pm8HSZm/jDF1pDWYKspWE7oVphigUPRakIQ==} + '@types/geojson@7946.0.16': + resolution: {integrity: sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==} + '@types/json-schema@7.0.15': resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==} + '@types/leaflet@1.9.17': + resolution: {integrity: sha512-IJ4K6t7I3Fh5qXbQ1uwL3CFVbCi6haW9+53oLWgdKlLP7EaS21byWFJxxqOx9y8I0AP0actXSJLVMbyvxhkUTA==} + '@types/validator@13.12.2': resolution: {integrity: sha512-6SlHBzUW8Jhf3liqrGGXyTJSIFe4nqlJ5A5KaMZ2l/vbM3Wh3KSybots/wfWVzNLK4D1NZluDlSQIbIEPx6oyA==} @@ -1108,6 +1120,9 @@ packages: resolution: {integrity: sha512-FIyV/64EkKhJmjgC0g2hygpBv5RNWVPyNCqSAD7eTCv6eFWNIi4PN1UvdSJGicN/o35bnevgis4Y0UDC0qi8jQ==} engines: {node: '>=14.0.0'} + leaflet@1.9.4: + resolution: {integrity: sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA==} + levn@0.4.1: resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==} engines: {node: '>= 0.8.0'} @@ -2047,8 +2062,14 @@ snapshots: '@types/estree@1.0.7': {} + '@types/geojson@7946.0.16': {} + '@types/json-schema@7.0.15': {} + '@types/leaflet@1.9.17': + dependencies: + '@types/geojson': 7946.0.16 + '@types/validator@13.12.2': optional: true @@ -2575,6 +2596,8 @@ snapshots: kysely@0.27.6: {} + leaflet@1.9.4: {} + levn@0.4.1: dependencies: prelude-ls: 1.2.1 diff --git a/src/app.html b/src/app.html index 16ef9cc..31a81ef 100644 --- a/src/app.html +++ b/src/app.html @@ -1,12 +1,12 @@ - - - - - %sveltekit.head% - - -
%sveltekit.body%
- + + + + + %sveltekit.head% + + +
%sveltekit.body%
+ diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index cc88df0..43dfbef 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,2 +1,2 @@ -

Welcome to SvelteKit

-

Visit svelte.dev/docs/kit to read the documentation

+

Demo Charge.re

+

This page can be a view or just a basic redirect to rossinienergy.com

diff --git a/src/routes/[qrcode]/+layout.svelte b/src/routes/[qrcode]/+layout.svelte new file mode 100644 index 0000000..ba1a681 --- /dev/null +++ b/src/routes/[qrcode]/+layout.svelte @@ -0,0 +1,40 @@ + + +
+
+
+
+ RossiniEnergy +
+
+
    +

  • QRCODE: {qrcode}

    • +
  • +
    + PARK: {cc['park']} +
      +

    • EN

      • +

    • IT

      • +
    +
    +
    • +
+
+
+ {#await import('./Map.svelte') then { default: Map }} + + {/await} +
+
+
+ {@render children()} +
+
+
\ No newline at end of file diff --git a/src/routes/[qrcode]/+layout.ts b/src/routes/[qrcode]/+layout.ts new file mode 100644 index 0000000..fec4f43 --- /dev/null +++ b/src/routes/[qrcode]/+layout.ts @@ -0,0 +1,19 @@ +import type { LayoutLoad } from './$types'; +import { error } from "@sveltejs/kit"; +import { type } from "arktype"; + +const QrcodeType = type("string.integer.parse"); + +export const load: LayoutLoad = async ({ params, fetch }) => { + const qrcode = QrcodeType(params.qrcode); + if (qrcode instanceof type.errors) error(400, 'invalid qrcode'); + const data = await fetch(`/api/v2/chargecontroller/${qrcode}/`, { + method: 'GET', + headers: { + 'Accept': 'application/json', + } + }); + return { + chargecontroller: await data.json(), + }; +}; \ No newline at end of file diff --git a/src/routes/[qrcode]/+page.svelte b/src/routes/[qrcode]/+page.svelte new file mode 100644 index 0000000..55e5cd2 --- /dev/null +++ b/src/routes/[qrcode]/+page.svelte @@ -0,0 +1,3 @@ +
+ TEST CARD +
\ No newline at end of file diff --git a/src/routes/[qrcode]/Map.svelte b/src/routes/[qrcode]/Map.svelte new file mode 100644 index 0000000..465d04b --- /dev/null +++ b/src/routes/[qrcode]/Map.svelte @@ -0,0 +1,28 @@ + + +
+
\ No newline at end of file