Extract tree_nodes layer, add heritage tags & img

Customizations/AllKnownLayouts.ts

@@ -17,6 +17,7 @@ import * as widths from "../assets/themes/widths/width.json"
 import * as drinking_water from "../assets/themes/drinking_water/drinking_water.json"
 import * as climbing from "../assets/themes/climbing/climbing.json"
 import * as surveillance_cameras from "../assets/themes/surveillance_cameras/surveillance_cameras.json"
+import * as trees from "../assets/themes/trees/trees.json"
 import * as personal from "../assets/themes/personalLayout/personalLayout.json"
 import LayerConfig from "./JSON/LayerConfig";
 import LayoutConfig from "./JSON/LayoutConfig";
@@ -63,7 +64,8 @@ export class AllKnownLayouts {
         new LayoutConfig(buurtnatuur),
         new LayoutConfig(bike_monitoring_stations),
         new LayoutConfig(surveillance_cameras),
-        new LayoutConfig(climbing)
+        new LayoutConfig(climbing),
+        new LayoutConfig(trees),
     ];
 
 

Customizations/SharedLayers.ts

@@ -17,6 +17,7 @@ import * as direction from "../assets/layers/direction/direction.json"
 import * as surveillance_camera from "../assets/layers/surveillance_cameras/surveillance_cameras.json"
 import * as toilets from "../assets/layers/toilets/toilets.json"
 import * as bookcases from "../assets/layers/public_bookcases/public_bookcases.json"
+import * as tree_nodes from "../assets/layers/trees/tree_nodes.json"
 import LayerConfig from "./JSON/LayerConfig";
 
 export default class SharedLayers {
@@ -45,7 +46,8 @@ export default class SharedLayers {
             new LayerConfig(information_boards,[], "shared_layers"),
             new LayerConfig(toilets,[], "shared_layers"),
             new LayerConfig(bookcases,[], "shared_layers"),
-            new LayerConfig(surveillance_camera,[], "shared_layers")
+            new LayerConfig(surveillance_camera,[], "shared_layers"),
+            new LayerConfig(tree_nodes,[], "shared_layers")
         ];
 
         const sharedLayers = new Map<string, LayerConfig>();
@@ -57,4 +59,4 @@ export default class SharedLayers {
     }
     
     
-}
+}

Logic/MetaTagging.ts

@@ -63,7 +63,7 @@ export default class MetaTagging {
         ["_country"], "The country code of the property (with latlon2country)",
         (feature, index) => {
 
-            const coder = new CountryCoder("https://pietervdvn.github.io/latlon2country/");
+            const coder = new CountryCoder("/latlon2country");
 
             let centerPoint: any = GeoOperations.centerpoint(feature);
             const lat = centerPoint.geometry.coordinates[1];

assets/layers/trees/tree_nodes.json

@@ -0,0 +1,418 @@
+{
+  "id": "tree_nodes",
+  "name": {
+    "nl": "Boom",
+    "en": "Tree"
+  },
+  "minzoom": 18,
+  "overpassTags": {
+    "and": ["natural=tree"]
+  },
+  "title": {
+    "render": {
+      "nl": "Boom",
+      "en": "Tree"
+    },
+    "mappings": [
+      {
+        "if": "name~*",
+        "then": {
+          "nl": "<i>{name}</i>",
+          "en": "<i>{name}</i>"
+        }
+      }
+    ]
+  },
+  "tagRenderings": [
+    "images",
+    {
+      "render": {
+        "nl": "Hoogte: {height}",
+        "en": "Height: {height}"
+      },
+      "condition": {
+        "and": [
+          "height~*"
+        ]
+      },
+      "mappings": [
+        {
+          "if": {
+            "and": ["height~^[0-9.]+$"]
+          },
+          "then": {
+            "nl": "Hoogte: {height}&nbsp;m",
+            "en": "Height: {height}&nbsp;m"
+          }
+        }
+      ]
+    },
+    {
+      "question": {
+        "nl": "Is dit een naald- of loofboom?",
+        "en": "Is this a broadleaved or needleleaved tree?"
+      },
+      "mappings": [
+        {
+          "if": {
+            "and": ["leaf_type=broadleaved"]
+          },
+          "then": {
+            "nl": "<img src=\"./assets/themes/trees/broadleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Loofboom",
+            "en": "<img src=\"./assets/themes/trees/broadleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Broadleaved"
+          }
+        },
+        {
+          "if": {
+            "and": ["leaf_type=needleleaved"]
+          },
+          "then": {
+            "nl": "<img src=\"./assets/themes/trees/needleleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Naaldboom",
+            "en": "<img src=\"./assets/themes/trees/needleleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Needleleaved"
+          }
+        },
+        {
+          "if": {
+            "and": ["leaf_type=leafless"]
+          },
+          "then": {
+            "nl": "<img src=\"./assets/themes/trees/leafless.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Permanent bladloos",
+            "en": "<img src=\"./assets/themes/trees/leafless.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Permanently leafless"
+          },
+          "hideInAnswer": true
+        }
+      ]
+    },
+    {
+      "question": {
+        "nl": "Hoe significant is deze boom? Kies het eerste antwoord dat van toepassing is.",
+        "en": "How significant is this tree? Choose the first answer that applies."
+      },
+      "mappings": [
+        {
+          "if": {
+            "and": ["denotation=landmark"]
+          },
+          "then": {
+            "nl": "De boom valt op door zijn grootte of prominente locatie. Hij is nuttig voor navigatie.",
+            "en": "The tree is remarkable due to its size or prominent location. It is useful for navigation."
+          }
+        },
+        {
+          "if": {
+            "and": ["denotation=natural_monument"]
+          },
+          "then": {
+            "nl": "De boom is een natuurlijk monument, bijvoorbeeld doordat hij bijzonder oud of van een waardevolle soort is.",
+            "en": "The tree is a natural monument, e.g. because it is especially old, or of a valuable species."
+          }
+        },
+        {
+          "if": {
+            "and": ["denotation=agricultural"]
+          },
+          "then": {
+            "nl": "De boom wordt voor landbouwdoeleinden gebruikt, bijvoorbeeld in een boomgaard.",
+            "en": "The tree is used for agricultural purposes, e.g. in an orchard."
+          }
+        },
+        {
+          "if": {
+            "and": ["denotation=park"]
+          },
+          "then": {
+            "nl": "De boom staat in een park of dergelijke (begraafplaats, schoolterrein, …).",
+            "en": "The tree is in a park or similar (cemetery, school grounds, …)."
+          }
+        },
+        {
+          "if": {
+            "and": ["denotation=garden"]
+          },
+          "then": {
+            "nl": "De boom staat in de tuin bij een woning/flatgebouw.",
+            "en": "The tree is a residential garden."
+          }
+        },
+        {
+          "if": {
+            "and": ["denotation=avenue"]
+          },
+          "then": {
+            "nl": "Dit is een laanboom.",
+            "en": "This is a tree along an avenue."
+          }
+        },
+        {
+          "if": {
+            "and": ["denotation=urban"]
+          },
+          "then": {
+            "nl": "De boom staat in een woonkern.",
+            "en": "The tree is an urban area."
+          }
+        },
+        {
+          "if": {
+            "and": ["denotation=none"]
+          },
+          "then": {
+            "nl": "De boom staat buiten een woonkern.",
+            "en": "The tree is outside of an urban area."
+          }
+        }
+      ]
+    },
+    {
+      "question": {
+        "nl": "Is deze boom groenblijvend of bladverliezend?",
+        "en": "Is this tree evergreen or deciduous?"
+      },
+      "mappings": [
+        {
+          "if": {
+            "and": ["leaf_cycle=deciduous"]
+          },
+          "then": {
+            "nl": "Bladverliezend: de boom is een periode van het jaar kaal.",
+            "en": "Deciduous: the tree loses its leaves for some time of the year."
+          }
+        },
+        {
+          "if": {
+            "and": ["leaf_cycle=evergreen"]
+          },
+          "then": {
+            "nl": "Groenblijvend.",
+            "en": "Evergreen."
+          }
+        }
+      ],
+      "condition": {
+        "and": ["leaf_type!~^leafless$"]
+      }
+    },
+    {
+      "render": {
+        "nl": "Naam: {name}",
+        "en": "Naam: {name}"
+      },
+      "question": {
+        "nl": "Heeft de boom een naam?",
+        "en": "Does the tree have a name?"
+      },
+      "freeform": {
+        "key": "name",
+        "addExtraTags": [
+          "noname="
+        ]
+      },
+      "mappings": [
+        {
+          "if": {
+            "and": [
+              "name=",
+              "noname=yes"
+            ]
+          },
+          "then": {
+            "nl": "De boom heeft geen naam.",
+            "en": "The tree does not have a name."
+          }
+        }
+      ],
+      "condition": {
+        "or": [
+          "denotation=landmark",
+          "denotation=natural_monument",
+          "name~*"
+        ]
+      }
+    },
+    {
+      "question": {
+        "nl": "Is deze boom erkend als erfgoed?",
+        "en": "Is this tree registered heritage?"
+      },
+      "mappings": [
+        {
+          "if": {
+            "and": [
+              "heritage=4",
+              "heritage:operator=OnroerendErfgoed"
+            ]
+          },
+          "then": {
+            "nl": "<img src=\"https://upload.wikimedia.org/wikipedia/commons/6/60/Onroerend_Erfgoed_logo_without_text.svg\" style=\"width:0.85em;height:1em;vertical-align:middle\" alt=\"\"/> Erkend als houtig erfgoed door Onroerend Erfgoed Vlaanderen",
+            "en": "<img src=\"https://upload.wikimedia.org/wikipedia/commons/6/60/Onroerend_Erfgoed_logo_without_text.svg\" style=\"width:0.85em;height:1em;vertical-align:middle\" alt=\"\"/> Registered as heritage by <i>Onroerend Erfgoed</i> Flanders"
+          }
+        },
+        {
+          "if": {
+            "and": [
+              "heritage=4",
+              "heritage:operator=aatl"
+            ]
+          },
+          "then": {
+            "nl": "Erkend als natuurlijk erfgoed door Directie Cultureel Erfgoed Brussel",
+            "en": "Registered as heritage by <i>Direction du Patrimoine culturel</i> Brussels"
+          }
+        },
+        {
+          "if": {
+            "and": [
+              "heritage=yes",
+              "heritage:operator="
+            ]
+          },
+          "then": {
+            "nl": "Erkend als erfgoed door een andere organisatie",
+            "en": "Registered as heritage by a different organisation"
+          }
+        },
+        {
+          "if": {
+            "and": [
+              "heritage=no",
+              "heritage:operator="
+            ]
+          },
+          "then": {
+            "nl": "Niet erkend als erfgoed",
+            "en": "Not registered as heritage"
+          }
+        },
+        {
+          "if": {
+            "and": [
+              "heritage~*"
+            ]
+          },
+          "then": {
+            "nl": "Erkend als erfgoed door een andere organisatie",
+            "en": "Registered as heritage by a different organisation"
+          },
+          "hideInAnswer": true
+        }
+      ],
+      "condition": {
+        "or": [
+          "denotation=landmark",
+          "denotation=natural_monument"
+        ]
+      }
+    },
+    {
+      "render": {
+        "nl": "<img src=\"https://upload.wikimedia.org/wikipedia/commons/6/60/Onroerend_Erfgoed_logo_without_text.svg\" style=\"width:0.85em;height:1em;vertical-align:middle\" alt=\"\"/> Onroerend Erfgoed-ID: <a href=\"https://id.erfgoed.net/erfgoedobjecten/{ref:OnroerendErfgoed}\">{ref:OnroerendErfgoed}</a>",
+        "en": "<img src=\"https://upload.wikimedia.org/wikipedia/commons/6/60/Onroerend_Erfgoed_logo_without_text.svg\" style=\"width:0.85em;height:1em;vertical-align:middle\" alt=\"\"/> Onroerend Erfgoed ID: <a href=\"https://id.erfgoed.net/erfgoedobjecten/{ref:OnroerendErfgoed}\">{ref:OnroerendErfgoed}</a>"
+      },
+      "question": {
+        "nl": "Wat is het ID uitgegeven door Onroerend Erfgoed Vlaanderen?",
+        "en": "What is the ID issuesd by Onroerend Erfgoed Flanders?"
+      },
+      "freeform": {
+        "key": "ref:OnroerendErfgoed",
+        "type": "nat"
+      },
+      "condition": {
+        "and": [
+          "heritage=4",
+          "heritage:operator=OnroerendErfgoed"
+        ]
+      }
+    },
+    {
+      "render": {
+        "nl": "<img src=\"https://upload.wikimedia.org/wikipedia/commons/e/e4/Wikidata-logo_S.svg\" style=\"width:1em;height:0.56em;vertical-align:middle\" alt=\"\"/> Wikidata: <a href=\"http://www.wikidata.org/entity/{wikidata}\">{wikidata}</a>",
+        "en": "<img src=\"https://upload.wikimedia.org/wikipedia/commons/e/e4/Wikidata-logo_S.svg\" style=\"width:1em;height:0.56em;vertical-align:middle\" alt=\"\"/> Wikidata: <a href=\"http://www.wikidata.org/entity/{wikidata}\">{wikidata}</a>"
+      },
+      "question": {
+        "nl": "Wat is het Wikidata-ID van deze boom?",
+        "en": "What is the Wikidata ID for this tree?"
+      },
+      "freeform": {
+        "key": "wikidata",
+        "type": "wikidata"
+      },
+      "condition": {
+        "or": [
+          "denotation=landmark",
+          "denotation=natural_monument",
+          "wikidata~*"
+        ]
+      }
+    }
+  ],
+  "hideUnderlayingFeaturesMinPercentage": 0,
+  "icon": {
+    "render": "./assets/themes/trees/unknown.svg",
+    "mappings": [
+      {
+        "if": {
+          "and": ["leaf_type=broadleaved"]
+        },
+        "then": "./assets/themes/trees/broadleaved.svg"
+      },
+      {
+        "if": {
+          "and": ["leaf_type=needleleaved"]
+        },
+        "then": "./assets/themes/trees/needleleaved.svg"
+      }
+    ]
+  },
+  "width": {
+    "render": "8"
+  },
+  "iconSize": {
+    "render": "40,40,bottom"
+  },
+  "color": {
+    "render": "#00f"
+  },
+  "presets": [
+    {
+      "tags": [
+        "natural=tree",
+        "leaf_type=broadleaved"
+      ],
+      "title": {
+        "nl": "Loofboom",
+        "en": "Broadleaved tree"
+      },
+      "description": {
+        "nl": "Een boom van een soort die blaadjes heeft, bijvoorbeeld eik of populier.",
+        "en": "A tree of a species with leaves, such as oak or populus."
+      }
+    },
+    {
+      "tags": [
+        "natural=tree",
+        "leaf_type=needleleaved"
+      ],
+      "title": {
+        "nl": "Naaldboom",
+        "en": "Needleleaved tree"
+      },
+      "description": {
+        "nl": "Een boom van een soort met naalden, bijvoorbeeld den of spar.",
+        "en": "A tree of a species with needles, such as pine or spruce."
+      }
+    },
+    {
+      "tags": [
+        "natural=tree"
+      ],
+      "title": {
+        "nl": "Boom",
+        "en": "Tree"
+      },
+      "description": {
+        "nl": "Wanneer je niet zeker bent of het nu een loof- of naaldboom is.",
+        "en": "If you're not sure whether it's a broadleaved or needleleaved tree."
+      }
+    }
+  ]
+}

assets/themes/trees/trees.json

@@ -22,278 +22,10 @@
   "startLat": 50.642,
   "startLon": 4.482,
   "startZoom": 8,
-  "widenFactor": 0.05,
+  "widenFactor": 0.01,
   "socialImage": "./assets/themes/trees/logo.svg",
   "layers": [
-    {
+    "tree_nodes"
-      "id": "tree",
-      "name": {
-        "nl": "Boom",
-        "en": "Tree"
-      },
-      "minzoom": 18,
-      "overpassTags": {
-        "and": [
-          "natural=tree"
-        ]
-      },
-      "title": {
-        "render": {
-          "nl": "Boom",
-          "en": "Tree"
-        },
-        "mappings": []
-      },
-      "tagRenderings": [
-        {
-          "question": {
-            "nl": "Is dit een naald- of loofboom?",
-            "en": "Is this a broadleaved or needleleaved tree?"
-          },
-          "mappings": [
-            {
-              "if": {
-                "and": [
-                  "leaf_type=broadleaved"
-                ]
-              },
-              "then": {
-                "nl": "<img src=\"./assets/themes/trees/broadleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Dit is een loofboom.",
-                "en": "<img src=\"./assets/themes/trees/broadleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> This tree is broadleaved."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "leaf_type=needleleaved"
-                ]
-              },
-              "then": {
-                "nl": "<img src=\"./assets/themes/trees/needleleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Dit is een naaldboom.",
-                "en": "<img src=\"./assets/themes/trees/needleleaved.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> This tree is needleleaved."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "leaf_type=leafless"
-                ]
-              },
-              "then": {
-                "nl": "<img src=\"./assets/themes/trees/leafless.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> Deze boom is permanent bladloos.",
-                "en": "<img src=\"./assets/themes/trees/leafless.svg\" style=\"width:1.5em;height:1.5em\" alt=\"\"/> This tree is permanently leafless."
-              },
-              "hideInAnswer": true
-            }
-          ]
-        },
-        {
-          "question": {
-            "nl": "Hoe significant is deze boom? Kies het eerste antwoord dat van toepassing is.",
-            "en": "How significant is this tree? Choose the first answer that applies."
-          },
-          "mappings": [
-            {
-              "if": {
-                "and": [
-                  "denotation=natural_monument"
-                ]
-              },
-              "then": {
-                "nl": "De boom is houtig erfgoed, bijvoorbeeld doordat hij bijzonder oud of van een waardevolle soort is.",
-                "en": "The tree is a natural monument, e.g. because it is especially old, or of a valuable species."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "denotation=landmark"
-                ]
-              },
-              "then": {
-                "nl": "De boom valt op door zijn grootte of prominente locatie. Hij is nuttig voor navigatie.",
-                "en": "The tree is remarkable due to its size or prominent location. It is useful for navigation."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "denotation=agricultural"
-                ]
-              },
-              "then": {
-                "nl": "De boom wordt voor landbouwdoeleinden gebruikt, bijvoorbeeld in een boomgaard.",
-                "en": "The tree is used for agricultural purposes, e.g. in an orchard."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "denotation=park"
-                ]
-              },
-              "then": {
-                "nl": "De boom staat in een park of dergelijke (begraafplaats, schoolterrein, …).",
-                "en": "The tree is in a park or similar (cemetery, school grounds, …)."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "denotation=garden"
-                ]
-              },
-              "then": {
-                "nl": "De boom staat in de tuin bij een woning/flatgebouw.",
-                "en": "The tree is a residential garden."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "denotation=avenue"
-                ]
-              },
-              "then": {
-                "nl": "Dit is een laanboom.",
-                "en": "This is a tree along an avenue."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "denotation=urban"
-                ]
-              },
-              "then": {
-                "nl": "De boom staat in een woonkern.",
-                "en": "The tree is an urban area."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "denotation=none"
-                ]
-              },
-              "then": {
-                "nl": "De boom staat buiten een woonkern.",
-                "en": "The tree is outside of an urban area."
-              }
-            }
-          ]
-        },
-        {
-          "question": {
-            "nl": "Is deze boom bladhoudend of bladverliezend?",
-            "en": "Is this tree evergreen or deciduous?"
-          },
-          "mappings": [
-            {
-              "if": {
-                "and": [
-                  "leaf_cycle=deciduous"
-                ]
-              },
-              "then": {
-                "nl": "Deze boom is bladverliezend: hij is een periode van het jaar kaal.",
-                "en": "This tree is deciduous: it loses its leaves for some time of the year."
-              }
-            },
-            {
-              "if": {
-                "and": [
-                  "leaf_cycle=evergreen"
-                ]
-              },
-              "then": {
-                "nl": "Deze boom is groenblijvend.",
-                "en": "This tree is evergreen."
-              }
-            }
-          ],
-          "condition": {
-            "and": [
-              "leaf_type!~^leafless$"
-            ]
-          }
-        }
-      ],
-      "hideUnderlayingFeaturesMinPercentage": 0,
-      "icon": {
-        "render": "./assets/themes/trees/unknown.svg",
-        "mappings": [
-          {
-            "if": {
-              "and": [
-                "leaf_type=broadleaved"
-              ]
-            },
-            "then": "./assets/themes/trees/broadleaved.svg"
-          },
-          {
-            "if": {
-              "and": [
-                "leaf_type=needleleaved"
-              ]
-            },
-            "then": "./assets/themes/trees/needleleaved.svg"
-          }
-        ]
-      },
-      "width": {
-        "render": "8"
-      },
-      "iconSize": {
-        "render": "40,40,bottom"
-      },
-      "color": {
-        "render": "#00f"
-      },
-      "presets": [
-        {
-          "tags": [
-            "natural=tree",
-            "leaf_type=broadleaved"
-          ],
-          "title": {
-            "nl": "Loofboom",
-            "en": "Broadleaved tree"
-          },
-          "description": {
-            "nl": "Een boom van een soort die blaadjes heeft, bijvoorbeeld eik of populier.",
-            "en": "A tree of a species with leaves, such as oak or populus."
-          }
-        },
-        {
-          "tags": [
-            "natural=tree",
-            "leaf_type=needleleaved"
-          ],
-          "title": {
-            "nl": "Naaldboom",
-            "en": "Needleleaved tree"
-          },
-          "description": {
-            "nl": "Een boom van een soort met naalden, bijvoorbeeld den of spar.",
-            "en": "A tree of a species with needles, such as pine or spruce."
-          }
-        },
-        {
-          "tags": [
-            "natural=tree"
-          ],
-          "title": {
-            "nl": "Boom",
-            "en": "Tree"
-          },
-          "description": {
-            "nl": "Wanneer je niet zeker bent of het nu een loof- of naaldboom is.",
-            "en": "If you're not sure whether it's a broadleaved or needleleaved tree."
-          }
-        }
-      ]
-    }
   ],
   "roamingRenderings": [],
   "defaultBackgroundId": "AGIV"

index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>    
+<!DOCTYPE html>
 <!-- WARNING: index.html serves as a template. If you want to change something, change it there -->
 <html lang="en">
 <head>
@@ -19,7 +19,7 @@
     <!-- $$$CUSTOM-CSS -->
     <link rel="manifest" href="./manifest.manifest">
     <link rel="icon" href="assets/svg/add.svg" sizes="any" type="image/svg+xml">
-    
+
     <meta property="og:type" content="website">
     <!-- $$$OG-META -->
 
@@ -67,6 +67,5 @@
 <div id="leafletDiv"></div>
 
 <script src="./index.ts"></script>
-<script data-goatcounter="https://pietervdvn.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>
 </body>
 </html>

index.ts

@@ -73,7 +73,8 @@ if (layoutFromBase64.startsWith("wiki:")) {
     new FixedUiElement(`Downloading ${themeName} from the wiki...`)
         .AttachTo("centermessage");
     const cleanUrl = `https://wiki.openstreetmap.org/wiki/${themeName}`;
-    const url = `https://cors-anywhere.herokuapp.com/` + cleanUrl; // VERY SAFE AND HACKER-PROOF!
+    //const url = `https://cors-anywhere.herokuapp.com/` + cleanUrl; // ~NOT~ VERY SAFE AND HACKER-PROOF!
+    const url = cleanUrl; // MUCH SAFER!
 
     $.ajax({
         url: url,