show sources

assets/favicons/README.md

@@ -0,0 +1 @@
+All images in this directory belong to their copyright owners and are only used as small icons.

custom.d.ts

@@ -1,4 +1,9 @@
 declare module "*.svg" {
-    const content: any;
+    const content: string;
+    export default content;
+}
+
+declare module "*.png" {
+    const content: string;
     export default content;
 }

data/schema.json

@@ -88,9 +88,6 @@
       "type": "object",
       "additionalProperties": false,
       "properties": {
-        "wayID": {
-          "type": "integer"
-        },
         "coords": {
           "$ref": "#/definitions/Coordinates"
         },

interfaces.ts

@@ -18,6 +18,12 @@ export interface OSMNodeSource {
     nodes: number[]
 }
 
+export interface Source {
+    type: "news" | "official" | "proposal" | "streetview" | "in person"
+    date: string
+    url?: string
+}
+
 export interface GeoData {
     coords: Coords,
     length: number // in meter
@@ -27,7 +33,10 @@ export interface Crossing {
     id: number
     name: string
     bezirk: number
+    comment?:string
+    set?:string
     type: FlagType
+    sources: Source[]
     geosource: OSMWaySource | OSMNodeSource | RawCoordSource,
     geo?: GeoData
 }

src/main.ts

@@ -19,6 +19,7 @@ import dataURL from "../data/data.json?url"
 import {Crossing} from "../interfaces";
 import prideFlag from "../assets/prideflag.svg"
 import transFlag from "../assets/transflag.svg"
+import {displaySources} from "./text";
 
 
 function averageCoords(coords: number[][]): number[] {
@@ -179,14 +180,20 @@ map.on('singleclick', function (event) {
         if (id > 10000) {
             id -= 10000
         }
-        console.info(id)
         const crossing = metaData[id]
 
         content.innerHTML = "";
         const p = document.createElement("p")
         p.innerText = crossing.name
         content.appendChild(p)
-
+        if (crossing.comment) {
+            const p = document.createElement("p")
+            const small = document.createElement("small")
+            small.innerText = crossing.comment
+            p.appendChild(small)
+            content.appendChild(p)
+        }
+        displaySources(crossing.sources, content)
         overlay.setPosition(coordinate);
 
     }, {hitTolerance: 5})
@@ -195,4 +202,3 @@ map.on('singleclick', function (event) {
         closer.blur();
     }
 });
-console.log(dataURL)

src/text.ts

@@ -0,0 +1,48 @@
+import {Source} from "../interfaces";
+import gggIcon from "../assets/favicons/ggg.at_redrawn.png"
+import meinBezirkIcon from "../assets/favicons/meinbezirk.at.png"
+import kurierIcon from "../assets/favicons/kurier.at.png"
+import spoeIcon from "../assets/favicons/spoe.png"
+import neosIcon from "../assets/favicons/neos.png"
+import WienIcon from "../assets/favicons/wien.gv.at.png"
+
+export function displaySources(sources: Source[], content: HTMLElement) {
+    sources.forEach(s => {
+        if (!s.url) {
+            return
+        }
+        const img = document.createElement("img")
+        const a = document.createElement("a")
+        a.rel = "noopener"
+        a.target = "_blank"
+        a.title = s.date
+        img.src = ""
+        img.width = img.height = 32
+        a.appendChild(img)
+        a.href = s.url! // TODO: missing url
+        switch (a.hostname) {
+            case "www.ggg.at":
+                img.src = gggIcon
+                break
+            case "www.meinbezirk.at":
+                img.src = meinBezirkIcon
+                break
+            case "kurier.at":
+                img.src = kurierIcon
+                break
+            case "www.neos.eu":
+                img.src = neosIcon
+                break
+            case "www.wien.gv.at":
+                img.src=WienIcon
+                break
+        }
+        if (a.hostname.includes("spoe")) {
+            img.src = spoeIcon
+        }
+        if (img.src === document.URL) {
+            a.innerText = a.hostname
+        }
+        content.appendChild(a)
+    })
+}