UX: add link to Mapillary, fix #1637

src/Logic/ImageProviders/GenericImageProvider.ts

@@ -31,11 +31,12 @@ export default class GenericImageProvider extends ImageProvider {
                 key: key,
                 url: value,
                 provider: this,
+                id: value
             }),
         ]
     }
 
-    SourceIcon(backlinkSource?: string) {
+    SourceIcon() {
         return undefined
     }
 

src/Logic/ImageProviders/ImageProvider.ts

@@ -6,13 +6,14 @@ import { Utils } from "../../Utils"
 export interface ProvidedImage {
     url: string
     key: string
-    provider: ImageProvider
+    provider: ImageProvider,
+    id: string
 }
 
 export default abstract class ImageProvider {
     public abstract readonly defaultKeyPrefixes: string[]
 
-    public abstract SourceIcon(backlinkSource?: string): BaseUIElement
+    public abstract SourceIcon(id?: string, location?: {lon: number, lat: number}): BaseUIElement
 
     /**
      * Given a properies object, maps it onto _all_ the available pictures for this imageProvider
@@ -28,7 +29,7 @@ export default abstract class ImageProvider {
             throw "No `defaultKeyPrefixes` defined by this image provider"
         }
         const relevantUrls = new UIEventSource<
-            { url: string; key: string; provider: ImageProvider }[]
+            { id: string, url: string; key: string; provider: ImageProvider }[]
         >([])
         const seenValues = new Set<string>()
         allTags.addCallbackAndRunD((tags) => {
@@ -67,4 +68,10 @@ export default abstract class ImageProvider {
     public abstract DownloadAttribution(url: string): Promise<LicenseInfo>
 
     public abstract apiUrls(): string[]
+
+    public backlink(): string | undefined {
+        return undefined
+    }
+
+
 }

src/Logic/ImageProviders/Imgur.ts

@@ -66,6 +66,7 @@ export class Imgur extends ImageProvider implements ImageUploader {
                     url: value,
                     key: key,
                     provider: this,
+                    id: value
                 }),
             ]
         }

src/Logic/ImageProviders/Mapillary.ts

@@ -4,6 +4,7 @@ import Svg from "../../Svg"
 import { Utils } from "../../Utils"
 import { LicenseInfo } from "./LicenseInfo"
 import Constants from "../../Models/Constants"
+import Link from "../../UI/Base/Link"
 
 export class Mapillary extends ImageProvider {
     public static readonly singleton = new Mapillary()
@@ -17,10 +18,6 @@ export class Mapillary extends ImageProvider {
     ]
     defaultKeyPrefixes = ["mapillary", "image"]
 
-    apiUrls(): string[] {
-        return ["https://mapillary.com", "https://www.mapillary.com", "https://graph.mapillary.com"]
-    }
-
     /**
      * Indicates that this is the same URL
      * Ignores 'stp' parameter
@@ -57,6 +54,22 @@ export class Mapillary extends ImageProvider {
         return false
     }
 
+    static createLink(location: {
+        lon: number,
+        lat: number
+    } = undefined, zoom: number = 17, pKey?: string) {
+        const params = {
+            focus: pKey === undefined ? "map" : "photo",
+            lat: location.lat,
+            lng: location.lon,
+            z: location === undefined ? undefined : Math.max((zoom ?? 2) - 1, 1),
+            pKey,
+        }
+        const baselink = `https://www.mapillary.com/app/?`
+        const paramsStr = Utils.NoNull(Object.keys(params).map(k => params[k] === undefined ? undefined : k + "=" + params[k]))
+        return baselink + paramsStr.join("&")
+    }
+
     /**
      * Returns the correct key for API v4.0
      */
@@ -80,8 +93,19 @@ export class Mapillary extends ImageProvider {
         return undefined
     }
 
-    SourceIcon(backlinkSource?: string): BaseUIElement {
-        return Svg.mapillary_svg()
+    apiUrls(): string[] {
+        return ["https://mapillary.com", "https://www.mapillary.com", "https://graph.mapillary.com"]
+    }
+
+    SourceIcon(id: string, location?: {
+        lon: number,
+        lat: number
+    }): BaseUIElement {
+        const icon = Svg.mapillary_svg()
+        if (!id) {
+            return icon
+        }
+        return new Link(icon, Mapillary.createLink(location, 16, "" + id), true)
     }
 
     async ExtractUrls(key: string, value: string): Promise<Promise<ProvidedImage>[]> {
@@ -111,6 +135,7 @@ export class Mapillary extends ImageProvider {
         const response = await Utils.downloadJsonCached(metadataUrl, 60 * 60)
         const url = <string>response["thumb_1024_url"]
         return {
+            id: "" + mapillaryId,
             url: url,
             provider: this,
             key: key,

src/Logic/ImageProviders/WikidataImageProvider.ts

@@ -15,7 +15,7 @@ export class WikidataImageProvider extends ImageProvider {
         super()
     }
 
-    public SourceIcon(_?: string): BaseUIElement {
+    public SourceIcon(): BaseUIElement {
         return Svg.wikidata_svg()
     }
 

src/Logic/ImageProviders/WikimediaImageProvider.ts

@@ -1,7 +1,6 @@
 import ImageProvider, { ProvidedImage } from "./ImageProvider"
 import BaseUIElement from "../../UI/BaseUIElement"
 import Svg from "../../Svg"
-import Link from "../../UI/Base/Link"
 import { Utils } from "../../Utils"
 import { LicenseInfo } from "./LicenseInfo"
 import Wikimedia from "../Web/Wikimedia"
@@ -70,17 +69,8 @@ export class WikimediaImageProvider extends ImageProvider {
         return WikimediaImageProvider.apiUrls
     }
 
-    SourceIcon(backlink: string): BaseUIElement {
-        const img = Svg.wikimedia_commons_white_svg().SetStyle("width:2em;height: 2em")
-        if (backlink === undefined) {
-            return img
-        }
-
-        return new Link(
-            Svg.wikimedia_commons_white_svg(),
-            `https://commons.wikimedia.org/wiki/${backlink}`,
-            true
-        )
+    SourceIcon(): BaseUIElement {
+        return Svg.wikimedia_commons_white_svg().SetStyle("width:2em;height: 2em")
     }
 
     public PrepUrl(value: string): ProvidedImage {
@@ -173,6 +163,6 @@ export class WikimediaImageProvider extends ImageProvider {
         if (!image.startsWith("File:")) {
             image = "File:" + image
         }
-        return { url: WikimediaImageProvider.PrepareUrl(image), key: undefined, provider: this }
+        return { url: WikimediaImageProvider.PrepareUrl(image), key: undefined, provider: this , id: image}
     }
 }