Lint and format

2024-03-06 00:14:26 +01:00 · 2024-03-06 00:14:26 +01:00 · c80eb89db7
commit c80eb89db7
parent 9d0dbc520b
34 changed files with 560 additions and 565 deletions
--- a/frontend/src/app.d.ts
+++ b/frontend/src/app.d.ts
@ -9,51 +9,50 @@ declare global {
 		// interface PageData {}
 		// interface Platform {}
 		interface Category {
-			"id": 1,
-			"name_it": "Natura",
-			"name_en": "Nature",
-			"description_it": "Giri nella natura",
-			"description_en": "Countryside routes",
-			"icon": "",
-			"created_at": null,
-			"updated_at": null,
-			"deleted_at": null,
-			"color": string,
-			"cover": string,
+			id: 1;
+			name_it: 'Natura';
+			name_en: 'Nature';
+			description_it: 'Giri nella natura';
+			description_en: 'Countryside routes';
+			icon: '';
+			created_at: null;
+			updated_at: null;
+			deleted_at: null;
+			color: string;
+			cover: string;
 		}
 		interface Sport {
-			"id": 1,
-			"name_it": "Trekking",
-			"name_en": "Trekking",
-			"description_it": "Percorso escursionistico",
-			"description_en": "Trekking route",
-			"icon": "",
-			"created_at": "2023-10-31T18:37:30.000000Z",
-			"updated_at": null,
-			"deleted_at": null
+			id: 1;
+			name_it: 'Trekking';
+			name_en: 'Trekking';
+			description_it: 'Percorso escursionistico';
+			description_en: 'Trekking route';
+			icon: '';
+			created_at: '2023-10-31T18:37:30.000000Z';
+			updated_at: null;
+			deleted_at: null;
 		}
 		interface SportDetails {
-			id: 1,
-			route_id: 1,
-			sport_id: 1,
-			short_description_it: "Percorso escursionistico intermedio. Buon allenamento richiesto. Sentieri facilmente percorribili. Adatto a ogni livello di abilit\u00e0. ",
-			short_description_en: "Intermediate hiking route. Good training required. Easily accessible paths. Suitable for all skill levels.",
-			gpx_path: "",
-			distance: 16800,
-			duration: 288,
-			elevation_gain: 439,
-			elevation_loss: null,
-			altitude_max: 620,
-			altitude_min: 180,
-			difficulty_it: "Facile",
-			difficulty_en: "Easy",
-			route_type_it: "Percorso ad anello",
-			route_type_en: "Ring route",
-			created_at: "2023-11-02T10:57:41.000000Z",
-			updated_at: null,
-			deleted_at: null,
-			sport: Sport
-
+			id: 1;
+			route_id: 1;
+			sport_id: 1;
+			short_description_it: 'Percorso escursionistico intermedio. Buon allenamento richiesto. Sentieri facilmente percorribili. Adatto a ogni livello di abilit\u00e0. ';
+			short_description_en: 'Intermediate hiking route. Good training required. Easily accessible paths. Suitable for all skill levels.';
+			gpx_path: '';
+			distance: 16800;
+			duration: 288;
+			elevation_gain: 439;
+			elevation_loss: null;
+			altitude_max: 620;
+			altitude_min: 180;
+			difficulty_it: 'Facile';
+			difficulty_en: 'Easy';
+			route_type_it: 'Percorso ad anello';
+			route_type_en: 'Ring route';
+			created_at: '2023-11-02T10:57:41.000000Z';
+			updated_at: null;
+			deleted_at: null;
+			sport: Sport;
 		}
 		interface Route {
 			id: number;
@ -66,7 +65,7 @@ declare global {
 			description_it: string;
 			description_en: string;
 			route_category_id: number;
-			created_at: "2023-11-02T10:50:07.000000Z";
+			created_at: '2023-11-02T10:50:07.000000Z';
 			updated_at: null;
 			deleted_at: null;
 			route_sport_details: Array<SportDetails>;
@ -74,9 +73,4 @@ declare global {
 		}
 	}
 }
-export {
-	Route,
-	Category,
-	Sport,
-	SportDetails
-};
+export { Route, Category, Sport, SportDetails };
--- a/frontend/src/app.html
+++ b/frontend/src/app.html
@ -1,6 +1,5 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="it">
-
 	<head>
 		<meta charset="utf-8" />
 		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
@ -46,5 +45,4 @@
 	<body data-sveltekit-preload-data="hover">
 		<div style="display: contents">%sveltekit.body%</div>
 	</body>
-
 </html>
--- a/frontend/src/css/app.css
+++ b/frontend/src/css/app.css
@ -1,4 +1,3 @@
-
 :root {
 	--footer-height: calc(68px + 20px + 20px);
 	--accent-color: #213c8b;
--- a/frontend/src/error.html
+++ b/frontend/src/error.html
@ -1,5 +1,4 @@
 <html>
-
 	<head>
 		<style>
 			* {
@ -39,5 +38,4 @@
 			<p id="message">%sveltekit.error.message%</p>
 		</div>
 	</body>
-
 </html>
--- a/frontend/src/hooks.client.ts
+++ b/frontend/src/hooks.client.ts
@ -1,6 +1,6 @@
 export async function handleError({ error, event, status, message }) {
 	const errorId = crypto.randomUUID();
-	console.error(error)
+	console.error(error);
 	// console.error(event)
 	// console.error(status)
 	return {
--- a/frontend/src/hooks.server.ts
+++ b/frontend/src/hooks.server.ts
@ -9,7 +9,7 @@ export async function handleFetch({ request, fetch }) {

 export async function handleError({ error, event, status, message }) {
 	const errorId = crypto.randomUUID();
-	console.error(error)
+	console.error(error);
 	// console.error(event)
 	// console.error(status)
 	return {
--- a/frontend/src/lib/components/BottomAppBar.svelte
+++ b/frontend/src/lib/components/BottomAppBar.svelte
@ -30,7 +30,6 @@
 		box-shadow: 0 0 50px #ccc;
 		background-color: var(--card-background-color);
 		margin: 0 auto;
-	
 	}

 	#container > a {
--- a/frontend/src/lib/components/Header.svelte
+++ b/frontend/src/lib/components/Header.svelte
@ -8,7 +8,7 @@
 	};
 </script>

-<div class='header'>
+<div class="header">
 	<!-- svelte-ignore a11y-no-static-element-interactions -->
 	<!-- svelte-ignore a11y-click-events-have-key-events -->
 	<!-- svelte-ignore a11y-missing-attribute -->
--- a/frontend/src/lib/components/HomeHeader.svelte
+++ b/frontend/src/lib/components/HomeHeader.svelte
@ -8,7 +8,7 @@
 	};
 </script>

-<div class='header'>
+<div class="header">
 	<!-- svelte-ignore a11y-no-static-element-interactions -->
 	<!-- svelte-ignore a11y-click-events-have-key-events -->
 	<!-- svelte-ignore a11y-missing-attribute -->
--- a/frontend/src/lib/components/Path.svelte
+++ b/frontend/src/lib/components/Path.svelte
@ -1,5 +1,5 @@
 <script lang="ts">
-	import {PUBLIC_BACKEND_URL} from '$env/static/public'
+	import { PUBLIC_BACKEND_URL } from '$env/static/public';

 	export let name: string;
 	export let id: number;
@ -7,7 +7,7 @@
 	export const path = `/paths/${id}`;
 	export let src: string;

-	let image = '/archi.png'
+	let image = '/archi.png';
 	switch (id) {
 		case 1:
 			image = '/archi.png';
@ -30,7 +30,7 @@
 			<div class="bold">{name}</div>
 		</div>
 	</div>
-	<div class="route-card-right" style:background-image='url({PUBLIC_BACKEND_URL}{src})' />
+	<div class="route-card-right" style:background-image="url({PUBLIC_BACKEND_URL}{src})" />
 </a>

 <style>
--- a/frontend/src/lib/components/Route.svelte
+++ b/frontend/src/lib/components/Route.svelte
@ -1,16 +1,16 @@
 <script lang="ts">
-	import {PUBLIC_BACKEND_URL} from '$env/static/public'
+	import { PUBLIC_BACKEND_URL } from '$env/static/public';

 	export let route: App.Route;
 </script>

 <a href="/routes/{route.id}">
 	<div id="image" style:background-image="url({PUBLIC_BACKEND_URL}{route.cover})" />
-	<div id='path-holder'>
-		<p class='path-name'>{route.title_it}</p>
+	<div id="path-holder">
+		<p class="path-name">{route.title_it}</p>
 	</div>
-	<div id='duration-holder'>
-		<div style='font-size: 15px;'>Dislivello</div>
+	<div id="duration-holder">
+		<div style="font-size: 15px;">Dislivello</div>
 		<p id="duration">{route.elevation_gain}</p>
 	</div>
 </a>
--- a/frontend/src/lib/components/Splash.svelte
+++ b/frontend/src/lib/components/Splash.svelte
@ -1,13 +1,13 @@
 <script>
 	import { onMount } from 'svelte';
 	import { fade } from 'svelte/transition';
-	import { dev } from '$app/environment'
+	import { dev } from '$app/environment';

 	let visible = dev ? false : true;
 	let time = 2000;

 	onMount(() => {
-		if(dev) return
+		if (dev) return;

 		setTimeout(() => {
 			visible = false;
@ -16,9 +16,9 @@
 </script>

 {#if visible}
-	<img class='background' transition:fade src="/splash.webp" alt="splash" />
-	<div class='wrapper'>
-		<img transition:fade class='logo' src="/images/splash-logo.png" alt="splash-logo" />
+	<img class="background" transition:fade src="/splash.webp" alt="splash" />
+	<div class="wrapper">
+		<img transition:fade class="logo" src="/images/splash-logo.png" alt="splash-logo" />
 	</div>
 {/if}

--- a/frontend/src/lib/components/Tabs.svelte
+++ b/frontend/src/lib/components/Tabs.svelte
@ -12,8 +12,8 @@
 	let component = InfoTabTrekking;

 	onMount(() => {
-		console.log(route)
-	})
+		console.log(route);
+	});
 	const dispatchClick = (c: InfoTabTrekking | InfoTabBike | DescTab | MapTab) => {
 		component = c;
 		dispatch('tab-click', { component });
@ -21,14 +21,30 @@
 </script>

 <div id="tabs">
-	<button class:active={component === InfoTabTrekking} on:click={() => dispatchClick(InfoTabTrekking)} id="info-trekking"> <img src='/trekking.svg' alt='trekking'> </button>
-	<button class:active={component === InfoTabBike} 	 on:click={() => dispatchClick(InfoTabBike)} 	 id="info-bike">	<img src='/bike.svg' alt='bike'> </button>
-	<button class:active={component === DescTab} 		 on:click={() => dispatchClick(DescTab)} 		 id="desc">			Descrizione</button>
-	<button class:active={component === MapTab}  		 on:click={() => dispatchClick(MapTab)} 	     id="map">			Mappa</button>
+	<button
+		class:active={component === InfoTabTrekking}
+		on:click={() => dispatchClick(InfoTabTrekking)}
+		id="info-trekking"
+	>
+		<img src="/trekking.svg" alt="trekking" />
+	</button>
+	<button
+		class:active={component === InfoTabBike}
+		on:click={() => dispatchClick(InfoTabBike)}
+		id="info-bike"
+	>
+		<img src="/bike.svg" alt="bike" />
+	</button>
+	<button class:active={component === DescTab} on:click={() => dispatchClick(DescTab)} id="desc">
+		Descrizione</button
+	>
+	<button class:active={component === MapTab} on:click={() => dispatchClick(MapTab)} id="map">
+		Mappa</button
+	>
 </div>
 <div id="container">
 	<div class="tab" bind:this={ref} role="tab">
-		<svelte:component this={component} route={route} />
+		<svelte:component this={component} {route} />
 	</div>
 </div>

@ -72,7 +88,8 @@
 		border-bottom: 1px solid black !important;
 	}

-	#info-bike, #info-trekking {
+	#info-bike,
+	#info-trekking {
 		display: flex;
 		justify-content: center;
 		align-items: center;
--- a/frontend/src/lib/components/tabs/DescTab.svelte
+++ b/frontend/src/lib/components/tabs/DescTab.svelte
@ -1,4 +1,4 @@
-<script lang='ts'>
+<script lang="ts">
 	import { fade } from 'svelte/transition';

 	export let route: App.Route;
--- a/frontend/src/lib/components/tabs/MapTab.svelte
+++ b/frontend/src/lib/components/tabs/MapTab.svelte
@ -1,7 +1,7 @@
 <script lang="ts">
 	import { onMount, onDestroy } from 'svelte';
 	import { fade } from 'svelte/transition';
-	const mapMarkerIcon = new URL('/icons/map.png', import.meta.url).href
+	const mapMarkerIcon = new URL('/icons/map.png', import.meta.url).href;

 	export let route;
 	const pianelloCoordinates = [43.14, 12.53];
@ -14,28 +14,29 @@
 	let longitude;
 	let accuracy;
 	let watchPositionId: number;
-	const errorMessage = "Geolocation not available";
-	const attribution = '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';
+	const errorMessage = 'Geolocation not available';
+	const attribution =
+		'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';
 	const openStreetMapTile = 'https://tile.openstreetmap.org/{z}/{x}/{y}.png';

 	let errored = false;

 	const watchPosition = async () => {
-        if (!("geolocation" in navigator)) {
+		if (!('geolocation' in navigator)) {
 			errored = true;
-			throw new Error(errorMessage)
+			throw new Error(errorMessage);
 		}

 		const options = {
 			enableHighAccuracy: true,
 			timeout: 5000,
-            maximumAge: 0,
+			maximumAge: 0
 		};

 		function success(pos: GeolocationPosition) {
 			const crd = pos.coords;

-            let string = "";
+			let string = '';

 			latitude = crd.latitude;
 			longitude = crd.longitude;
@ -43,14 +44,14 @@

 			const icon = leaflet.icon({
 				iconUrl: mapMarkerIcon,
-				iconSize: [75, 75], // size of the icon
+				iconSize: [75, 75] // size of the icon
 			});
 			userMarker = leaflet.marker([latitude, longitude], { icon }).addTo(map);

 			// move the map to have the location in its center
 			map.panTo(userMarker.getLatLng());

-            string += "Your current position is:";
+			string += 'Your current position is:';
 			string += `Latitude : ${crd.latitude}`;
 			string += `Longitude: ${crd.longitude}`;
 			string += `More or less ${crd.accuracy} meters.`;
@ -75,17 +76,17 @@

 		map.setView(pianelloCoordinates, 13);

-		leaflet
-			.tileLayer(openStreetMapTile, {attribution})
-			.addTo(map);
-	}
+		leaflet.tileLayer(openStreetMapTile, { attribution }).addTo(map);
+	};

 	const renderGPX = () => {
-		const gpx = "/gpx/tidone.gpx"; // URL to your GPX file or the GPX itself
-		new leafletGPX(gpx, {async: true}).on('loaded', function(e) {
+		const gpx = '/gpx/tidone.gpx'; // URL to your GPX file or the GPX itself
+		new leafletGPX(gpx, { async: true })
+			.on('loaded', function (e) {
 				map.fitBounds(e.target.getBounds());
-		}).addTo(map);
-	}
+			})
+			.addTo(map);
+	};

 	onMount(async () => {
 		await watchPosition();
@ -115,10 +116,14 @@
 {/if}

 <svelte:head>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
+	<link
+		rel="stylesheet"
+		href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
 		integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
-     crossorigin=""/>
+		crossorigin=""
+	/>
 </svelte:head>
+
 <style>
 	#map {
 		height: 100%;
--- a/frontend/src/lib/gps.worker.ts
+++ b/frontend/src/lib/gps.worker.ts
@ -1,12 +1,6 @@
 let latitude;
 let longitude;

-
-onmessage = () => {
-
-
-
-    
-};
+onmessage = () => {};

 export {};
--- a/frontend/src/lib/repo.ts
+++ b/frontend/src/lib/repo.ts
@ -1,6 +1,6 @@
-import {PUBLIC_BACKEND_URL} from '$env/static/public'
+import { PUBLIC_BACKEND_URL } from '$env/static/public';

-const API_URL = `${PUBLIC_BACKEND_URL}/api`
+const API_URL = `${PUBLIC_BACKEND_URL}/api`;

 const getAllRoutes = async () => {
 	let data = [];
@ -10,7 +10,7 @@ const getAllRoutes = async () => {
 	data = json;

 	return data;
-}
+};

 const getRouteCategories = async () => {
 	let data = [];
@ -20,7 +20,7 @@ const getRouteCategories = async () => {
 	data = json;

 	return data;
-}
+};

 const getRouteByCategory = async (categoryId: number) => {
 	let data = [];
@ -29,7 +29,7 @@ const getRouteByCategory = async (categoryId: number) => {
 	data = json;

 	return data;
-}
+};

 const getRoute = async (routeId: number) => {
 	let data = {};
@ -38,8 +38,7 @@ const getRoute = async (routeId: number) => {
 	data = json;

 	return data;
-}
-
+};

 const getSport = async (routeId: number, sportId: number) => {
 	let data = {};
@ -48,7 +47,7 @@ const getSport = async (routeId: number, sportId: number) => {
 	data = json;

 	return data;
-}
+};

 const getPlacemarks = async (routeId: number, sportId: number) => {
 	let data = {};
@ -57,5 +56,5 @@ const getPlacemarks = async (routeId: number, sportId: number) => {
 	data = json;

 	return data;
-}
+};
 export { getAllRoutes, getPlacemarks, getSport, getRoute, getRouteByCategory, getRouteCategories };
--- a/frontend/src/routes/+error.svelte
+++ b/frontend/src/routes/+error.svelte
@ -2,7 +2,7 @@
 	import { page } from '$app/stores';
 </script>

-<div id='container'>
+<div id="container">
 	<div class="wrapper">
 		<p id="status">{$page.status}</p>
 		<p id="message">{$page.error?.message}</p>
--- a/frontend/src/routes/+layout.svelte
+++ b/frontend/src/routes/+layout.svelte
@ -32,8 +32,8 @@
 		}
 	});

-	onNavigate((navigation: { complete: any; }) => {
-		if (!(document.startViewTransition)) return;
+	onNavigate((navigation: { complete: any }) => {
+		if (!document.startViewTransition) return;

 		return new Promise<void>((resolve) => {
 			document?.startViewTransition(async () => {
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@ -9,7 +9,7 @@
 	<div id="welcome-message">Benvenuti a <span class="bold">Pianello Val Tidone</span></div>
 	<div id="route-cards">
 		{#each categories as category}
-			<Path src={category.cover} color={category.color} name="{category.name_it}" id={category.id} />
+			<Path src={category.cover} color={category.color} name={category.name_it} id={category.id} />
 		{/each}
 	</div>
 </main>
--- a/frontend/src/routes/paths/[slug]/+page.ts
+++ b/frontend/src/routes/paths/[slug]/+page.ts
@ -1,4 +1,3 @@
-import { getRouteByCategory, getRouteCategories } from '$lib/repo.js';
 import { error } from '@sveltejs/kit';
 import { PUBLIC_BACKEND_URL } from '$env/static/public';

@ -9,10 +8,10 @@ export async function load({ params, fetch }) {
 	const categories: App.Category[] = await response.json();
 	const categoryId = Number(params.slug);

-    const category: App.Category = categories.find(c => c.id === categoryId) as App.Category;
+	const category: App.Category = categories.find((c) => c.id === categoryId) as App.Category;

 	if (!category) {
-        error(404);
+		error(404, { message: 'Path not found' });
 	}

 	const response2 = await fetch(`${API_URL}/route-by-category/${categoryId}`);
@ -20,8 +19,8 @@ export async function load({ params, fetch }) {

 	const toReturn = {
 		category: category.name_it,
-        routes,
-    }
+		routes
+	};

 	return toReturn;
 }
--- a/frontend/src/routes/routes/[slug]/+page.svelte
+++ b/frontend/src/routes/routes/[slug]/+page.svelte
@ -18,7 +18,7 @@

 <div bind:this={divider} id="divider" class:move-to-top={isMap}>
 	<div id="banner">
-		<p class='path-name'>Percorso <b>{data.name_it}</b></p>
+		<p class="path-name">Percorso <b>{data.name_it}</b></p>
 		<p id="duration">Dislivello {data?.route_sport_details[0]?.elevation_gain} m</p>
 	</div>
 	<Tabs on:tab-click={tabClick} route={data}></Tabs>
--- a/frontend/src/routes/routes/[slug]/+page.ts
+++ b/frontend/src/routes/routes/[slug]/+page.ts
@ -1,7 +1,7 @@
 import { error } from '@sveltejs/kit';
-import {PUBLIC_BACKEND_URL} from '$env/static/public'
+import { PUBLIC_BACKEND_URL } from '$env/static/public';

-const API_URL = `${PUBLIC_BACKEND_URL}/api`
+const API_URL = `${PUBLIC_BACKEND_URL}/api`;

 export async function load({ params, fetch }) {
 	const routeId = Number(params.slug);
@ -9,7 +9,7 @@ export async function load({ params, fetch }) {
 	const route = await response.json();

 	if (!route) {
-        error(404);
+		error(404, { message: 'Route non found' });
 	}

 	return route;
--- a/frontend/src/sw.ts
+++ b/frontend/src/sw.ts
@ -16,7 +16,7 @@ const ASSETS = [

 let client;

-addEventListener('message', event => {
+addEventListener('message', (event) => {
 	client = event.source;
 });

@ -30,9 +30,6 @@ self.addEventListener('install', (event) => {
 	event.waitUntil(addFilesToCache());
 });

-
-
-
 self.addEventListener('activate', (event) => {
 	// Remove previous cached data from disk
 	async function deleteOldCaches() {
@ -47,7 +44,7 @@ self.addEventListener('activate', (event) => {
 		channel = new BroadcastChannel('sw-messages');
 		channel.postMessage({ title: 'Cache Downloaded' });
 	} else {
-        client.postMessage("Cache Downloaded")
+		client.postMessage('Cache Downloaded');
 	}
 });

@ -81,4 +78,3 @@ self.addEventListener('fetch', (event) => {

 	event.respondWith(respond());
 });
-
--- a/frontend/static/manifest.json
+++ b/frontend/static/manifest.json
@ -44,4 +44,3 @@
 		}
 	]
 }
-  
--- a/frontend/svelte.config.js
+++ b/frontend/svelte.config.js
@ -1,4 +1,4 @@
-import adapter from "@sveltejs/adapter-node";
+import adapter from '@sveltejs/adapter-node';
 import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';

 /** @type {import('@sveltejs/kit').Config} */
@ -6,17 +6,17 @@ const config = {
 	preprocess: vitePreprocess(),
 	kit: {
 		files: {
-			serviceWorker: 'src/sw.ts',
+			serviceWorker: 'src/sw.ts'
 		},
 		serviceWorker: {
-			register: false,
+			register: false
 		},
 		adapter: adapter({
 			fallback: null,
 			precompress: true,
 			strict: true
-		}),
-	},
+		})
+	}
 };

 export default config;
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@ -1,22 +1,20 @@
 import { sveltekit } from '@sveltejs/kit/vite';
-import adapter from "@sveltejs/adapter-node";
+import adapter from '@sveltejs/adapter-node';

 const config = {
-  plugins: [
-    sveltekit(),
-  ],
+	plugins: [sveltekit()],
 	test: {
-    include: ["src/**/*.{test,spec}.{js,ts}"],
+		include: ['src/**/*.{test,spec}.{js,ts}']
 	},
 	build: {
-    minify: "esbuild",
-    target: "esnext",
+		minify: 'esbuild',
+		target: 'esnext'
 	},
 	kit: {
 		adapter: adapter({
-      precompress: false,
+			precompress: false
 		})
-  },
+	}
 };

 export default config;