diff --git a/src/UI/Image/ImageOperations.svelte b/src/UI/Image/ImageOperations.svelte index 5d4450921b..46b8d2dd36 100644 --- a/src/UI/Image/ImageOperations.svelte +++ b/src/UI/Image/ImageOperations.svelte @@ -8,7 +8,7 @@ import type { ProvidedImage } from "../../Logic/ImageProviders/ImageProvider" import ImageAttribution from "./ImageAttribution.svelte" import ImagePreview from "./ImagePreview.svelte" - import { DownloadIcon } from "@rgossiaux/svelte-heroicons/solid" + import { DownloadIcon, ExternalLinkIcon } from "@rgossiaux/svelte-heroicons/solid" import { twMerge } from "tailwind-merge" import { UIEventSource } from "../../Logic/UIEventSource" import Loading from "../Base/Loading.svelte" @@ -23,7 +23,7 @@ export let nearbyFeatures: | Feature[] | Store[]> = [] - + let visitUrl = image.provider?.visitUrl(image) let isLoaded = new UIEventSource(false) @@ -39,22 +39,28 @@ {#if $$slots["dot-menu-actions"]} - - - + + + + {#if visitUrl !== undefined} + + + + + {/if} {/if}
- +
diff --git a/src/UI/Image/ImagePreview.svelte b/src/UI/Image/ImagePreview.svelte index f7eb0d62f8..6cc6f75479 100644 --- a/src/UI/Image/ImagePreview.svelte +++ b/src/UI/Image/ImagePreview.svelte @@ -3,24 +3,22 @@ * The image preview allows to drag and zoom in to the image */ import panzoom from "panzoom" - import type { HotspotProperties, ProvidedImage } from "../../Logic/ImageProviders/ImageProvider" - import { UIEventSource } from "../../Logic/UIEventSource" + import type { HotspotProperties, PanoramaView, ProvidedImage } from "../../Logic/ImageProviders/ImageProvider" + import ImageProvider from "../../Logic/ImageProviders/ImageProvider" + import { Store, UIEventSource } from "../../Logic/UIEventSource" import Zoomcontrol from "../Zoomcontrol" import { onDestroy } from "svelte" - import type { PanoramaView } from "../../Logic/ImageProviders/ImageProvider" import { PhotoSphereViewerWrapper } from "./photoSphereViewerWrapper" - import type { Feature, Geometry, Point } from "geojson" - import { Store } from "../../Logic/UIEventSource" + import AllImageProviders from "../../Logic/ImageProviders/AllImageProviders" export let nearbyFeatures: | Feature[] | Store[]> = [] - export let image: Partial + export let image: Partial & { url: string, id: string } let panzoomInstance = undefined let panzoomEl: HTMLElement let viewerEl: HTMLElement - export let isLoaded: UIEventSource = undefined onDestroy(Zoomcontrol.createLock()) @@ -32,10 +30,21 @@ async function initPhotosphere() { const imageInfo: Feature = await image.provider.getPanoramaInfo(image) if (imageInfo === undefined) { - console.error("Image info is apperently undefined for", image) + console.error("Image info is apparently undefined for", image) return } const viewer = new PhotoSphereViewerWrapper(viewerEl, imageInfo) + viewer.imageInfo.addCallbackAndRunD(panoramaInfo => { + let provider: ImageProvider + if (typeof panoramaInfo.properties.provider === "string") { + provider = AllImageProviders.byName(panoramaInfo.properties.provider) + } else { + provider = panoramaInfo.properties.provider + } + console.log(">>> Got:", panoramaInfo, "by", provider.name) +UI: + //actuallyDisplayed.set(image.properties.imageMeta) + }) if (Array.isArray(nearbyFeatures)) { viewer.setNearbyFeatures(nearbyFeatures) } else { @@ -77,5 +86,6 @@ isLoaded?.setData(true) }} src={image.url_hd ?? image.url} + alt="" /> {/if}