backward compatibility with old embedding URLs

website/src/lib/components/embedding/Embedding.ts

@@ -1,3 +1,4 @@
+import { PUBLIC_MAPBOX_TOKEN } from "$env/static/public";
 import { basemaps } from "$lib/assets/layers";
 
 export type EmbeddingOptions = {
@@ -78,3 +79,51 @@ export function getCleanedEmbeddingOptions(options: any, defaultOptions: any = d
 }
 
 export const allowedEmbeddingBasemaps = Object.keys(basemaps).filter(basemap => !['ordnanceSurvey'].includes(basemap));
+
+export function getURLForGoogleDriveFile(fileId: string): string {
+    return `https://www.googleapis.com/drive/v3/files/${fileId}?alt=media&key=AIzaSyA2ZadQob_hXiT2VaYIkAyafPvz_4ZMssk`;
+}
+
+export function convertOldEmbeddingOptions(options: URLSearchParams): any {
+    let newOptions: any = {
+        token: PUBLIC_MAPBOX_TOKEN,
+        files: [],
+    };
+    if (options.has('state')) {
+        let state = JSON.parse(options.get('state')!);
+        if (state.ids) {
+            newOptions.files.push(...state.ids.map(getURLForGoogleDriveFile));
+        }
+        if (state.urls) {
+            newOptions.files.push(...state.urls);
+        }
+    }
+    if (options.has('source')) {
+        let basemap = options.get('source')!;
+        if (basemap === 'satellite') {
+            newOptions.basemap = 'mapboxSatellite';
+        } else if (basemap === 'otm') {
+            newOptions.basemap = 'openTopoMap';
+        } else if (basemap === 'ohm') {
+            newOptions.basemap = 'openHikingMap';
+        }
+    }
+    if (options.has('imperial')) {
+        newOptions.distanceUnits = 'imperial';
+    }
+    if (options.has('running')) {
+        newOptions.velocityUnits = 'pace';
+    }
+    if (options.has('distance')) {
+        newOptions.distanceMarkers = true;
+    }
+    if (options.has('direction')) {
+        newOptions.directionMarkers = true;
+    }
+    if (options.has('slope')) {
+        newOptions.elevation = {
+            fill: 'slope',
+        };
+    }
+    return newOptions;
+}

website/src/routes/+layout.svelte

@@ -6,9 +6,19 @@
 	import Head from '$lib/components/Head.svelte';
 	import Nav from '$lib/components/Nav.svelte';
 	import Footer from '$lib/components/Footer.svelte';
+	import { onMount } from 'svelte';
+	import { convertOldEmbeddingOptions } from '$lib/components/embedding/Embedding';
 
 	const appRoutes = ['/[[language]]/app', '/[[language]]/embed'];
 
+	onMount(() => {
+		if ($page.url.searchParams.has('embed')) {
+			// convert old embedding options to new format and redirect to new embed page
+			let locale = $page.params.language;
+			window.location.href = `${locale ? '/' + locale : ''}/embed?options=${encodeURIComponent(JSON.stringify(convertOldEmbeddingOptions($page.url.searchParams)))}`;
+		}
+	});
+
 	$: showNavAndFooter = $page.route.id === null || !appRoutes.includes($page.route.id);
 </script>
 

website/src/routes/l/[[language]]/+page.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import { languages } from '$lib/languages';
+</script>
+
+<!-- hidden links for svelte crawling -->
+<div>
+	{#each Object.entries(languages) as [lang, label]}
+		{#if lang !== 'en'}
+			<a href="./{lang}">
+				{label}
+			</a>
+		{/if}
+	{/each}
+</div>

website/svelte.config.js

@@ -23,7 +23,7 @@ const config = {
             base: process.argv.includes('dev') ? '' : process.env.BASE_PATH
         },
         prerender: {
-            entries: ['/', '/404'],
+            entries: ['/', '/404', '/l/fr/'],
             crawl: true,
         }
     }