diff --git a/src/routes/(token-based)/view/[vorgang]/[tatort]/+page.svelte b/src/routes/(token-based)/view/[vorgang]/[tatort]/+page.svelte index 8e47533..4823311 100644 --- a/src/routes/(token-based)/view/[vorgang]/[tatort]/+page.svelte +++ b/src/routes/(token-based)/view/[vorgang]/[tatort]/+page.svelte @@ -2,6 +2,7 @@ import Panel from '$lib/components/Panel.svelte'; import { onMount } from 'svelte'; import Button from '$lib/components/Button.svelte'; + import type { ModelViewerElement } from '@google/model-viewer'; export let data; @@ -24,31 +25,32 @@ let yRotation = 0; let zRotation = 0; - let modelViewer; + let modelViewer: ModelViewerElement | null = null; $: style = `width: ${progress}%`; - const onProgress = ({ detail }) => { + const updateModelProgress = ({ detail }: { detail: { totalProgress: number } }) => { progress = Math.ceil(detail.totalProgress * 100.0); if (progress == 100) { setTimeout(() => { hideProgressScreen = true; }, 250); } else hideProgressScreen = false; - } + }; function onResetView() { - cameraAzimuth = 0; - cameraPolar = 0; - cameraZoom = 100; - - modelViewer.cameraOrbit = cameraOrbit; - modelViewer.cameraTarget = cameraTarget; - modelViewer.fieldOfView = fieldOfView; - cameraAzimuth = 0; - cameraPolar = 0; - cameraZoom = 100; - fieldOfView = '10deg'; + if (modelViewer) { + cameraAzimuth = 0; + cameraPolar = 0; + cameraZoom = 100; + modelViewer.cameraOrbit = cameraOrbit; + modelViewer.cameraTarget = cameraTarget; + modelViewer.fieldOfView = fieldOfView; + cameraAzimuth = 0; + cameraPolar = 0; + cameraZoom = 100; + fieldOfView = '10deg'; + } } function updateCameraOrbit(azimuth: number, polar: number, zoom: number) { @@ -58,10 +60,10 @@ } -