add podcast to switcher

codeforcologne · Jul 1, 2024 · ff1f341 · ff1f341
1 parent 605dac9
commit ff1f341
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 29 deletions.
diff --git a/assets/index-BHM6lY4k.js → assets/index-iSzUt6tk.js b/assets/index-BHM6lY4k.js → assets/index-iSzUt6tk.js
diff --git a/assets/index-BHM6lY4k.js.map → assets/index-iSzUt6tk.js.map b/assets/index-BHM6lY4k.js.map → assets/index-iSzUt6tk.js.map
diff --git a/index.html b/index.html
@@ -134,11 +134,11 @@
     }
 
     .LayerSwitchDiv {
-      background: url("assets/dop-DUYcEANn.png");
+      background: url("/assets/dop-DUYcEANn.png");
     }
 
     .LayerSwitchDivK {
-      background: url("assets/karte-CX4px2aL.png");
+      background: url("/assets/karte-CX4px2aL.png");
       border: solid 1px white;
     }
 
@@ -448,8 +448,8 @@
     ]
 }
 </script>
-  <script type="module" crossorigin src="assets/index-BHM6lY4k.js"></script>
-  <link rel="stylesheet" crossorigin href="assets/index-8qqDi7_8.css">
+  <script type="module" crossorigin src="/assets/index-iSzUt6tk.js"></script>
+  <link rel="stylesheet" crossorigin href="/assets/index-8qqDi7_8.css">
 </head>
 
 
@@ -461,10 +461,10 @@ <h1 id="titleApp" class="title"> Denkmal 4D Köln&nbsp; </h1>
       alt="Über, Hilfe und Daten" height="45" width="45">
     <img class="languageIcon" id="legalIcon" src="data:image/png;base64,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" title="Rechtliches" alt="Rechtliches" height="45"
       width="45">
-    <img class="languageIcon" id="storyIcon" src="assets/story-DlHi-A9Y.png" title="Erfolgsgeschichten" alt="Erfolgsgeschichten"
+    <img class="languageIcon" id="storyIcon" src="/assets/story-DlHi-A9Y.png" title="Erfolgsgeschichten" alt="Erfolgsgeschichten"
       height="45" width="45">
     <a target="_blank" href="https://ertanoz.github.io/Cesium3DHeritageMap/Apps/HelloWorld.html"><img
-        class="languageIcon" id="3dIcon" src="assets/3dheritagemapicon-D25J_olT.gif" title="Zur 3D Anwendung"
+        class="languageIcon" id="3dIcon" src="/assets/3dheritagemapicon-D25J_olT.gif" title="Zur 3D Anwendung"
         alt="Zur 3D Anwendung" height="45" width="45"></a>
   </div>
 
@@ -514,12 +514,12 @@ <h2 id="hilfe_anker">Hilfe</h2>
       <h4>Auswahl der zu pflegenden Kategorien</h4>
       <p>In der linken oberen Ecke der Kartenanwendung können die Kategorien ausgewählt werden, die es hier zu pflegen
         gibt.</p>
-      <img src="assets/nav-CnFizlh8.png" alt="Auswahl der zu pflegenden Kategorien">
+      <img src="/assets/nav-CnFizlh8.png" alt="Auswahl der zu pflegenden Kategorien">
       <p>Der Stand der Bearbeitung ist der Legende zu entnehmen.</p>
 
       <h4>Objektinformationen abfragen</h4>
       <p>Durch das Anklicken oder Antippen eines Denkmales öffnet sich die Detailinformationen:</p>
-      <img src="assets/featureinfo-BQM3ybo-.png" alt="FeatureInfo">
+      <img src="/assets/featureinfo-BQM3ybo-.png" alt="FeatureInfo">
       <p>Wenn noch kein 3D Model eingepflegt wurde, hast Du hier die Möglichkeit über den Button "Klar, da kümmere ich
         mich drum!" das Denkmal als "in Arbeit" zu markieren. Dann wissen andere, dass für dieses Denkmal zukünftig ein
         3D Modell erstellt wird. </p>
@@ -534,14 +534,14 @@ <h4>Hintergrundkarte wechseln</h4>
         Die Luftbilder besitzen eine Auflösung von 10 cm und sind recht aktuell (der Aufnahmezyklus wurde ab 2020 auf 2
         Jahre verkürzt).
       </p>
-      <img src="assets/layerswitcher-fTrBrw2t.png" alt="Karte/Luftbild umschalten">
+      <img src="/assets/layerswitcher-fTrBrw2t.png" alt="Karte/Luftbild umschalten">
       <h4>Denkmal anlegen</h4>
       <p>
         Mittels des Icons lassen sich neue Denkmäler anlegen:
       </p>
       <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAxCAYAAACcXioiAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAARoSURBVGhDzZlNSBRhGMfnIIgXFfXm18WLIngR9ODRuyCCF6EOQoFQ3Yw6KBZUlwzSCCoMXCP6YMsPSiRNU9fdNNuttdZSK9PYNKRE6vbk/9l5ZWZ8d2fdj5n5wx9nZ99d/r95n3lm31dldWWFvqytHdn43FIwSD6fj2amp/nc3t4e/fv7l4TwXllZGfVcv07Xuq9SVlYWTU+O8zgcGzX4xE1NTU105/YtqqyspP67feo7xJ9vaWmhmzduqGciUqZGHtDs2FPy+2bo88fgoaDxejkUojcLCwyD4KufPzHM5sYGufr7aXhoiOrq6vgcnJ2dTb9+htUYEZ08cYKKioqooKCA/vz+rZ6NnG9tbaWA309nTp+itrY2Po8xSuitl4Kvp2l+coRmRh8TgLwTzykw76GV5ZA0rJm1swOojfVvupmBcCVxla9cvsTQEMJjbH19PU2Nv+BzP8NhysjIoIsXLzAAXmMc9OjhgwiAsN1CaXV1dVFpaSmXWEVFBQ0MDKjvEh0/doyhq6ur+TVmRVld8jsCwOv1UklJCSmKcsiNjY3qqIgwCxBmQtnaWHcEQHNzszS8sMvl4vtIlBtKFA1C+RXetBUAV763t5ePY0GUl5fT2fZ27mgQuhJuZmXz64qtAJ2dnRzQDCIzM5O7jmgGmAnc1Ep4fc0WgLm5uYN2KCB6enr4tQyiuLiYgu8CB88ddCtuoz++f7McAOFFsHghOjo6dK1aPHcsB0B4PKi04cwgCgsLaXd3VwcgbGkJycILx4LweDx8LAUQ4dMNECu8cDQIIdsA4gkvrIUQV17IFgCEz8/Pl4aNZgFhlOUAiYSHjVdeSArw3jfF4QOel+qw1CiR8BgfLTwkBfCOD/NP6IknLnVY8kpHeEgKIA5CH4LqsOSEEOkIDxlXj1ivHADAySqd4SFUChZd87Ov6MP7AAW8k6kDSHd4CPfq0sIsLbwa42Uwyj4lAFaEh7QdUzhpAKvCQykHsDI8lFIAq8NDaPn+2RfJAyQaHs+HZLTkf8NbPhOD9/lGTgjArvCQyImZQAs9MkAi4fErNBXhIZETz4Mjl5Dd4SFk/PjOzzNwJAAnhIewz4olMFaRYkPOFMAp4SFsGJ8/f453sb8uBxkkJgDC5+XlSUNGc7rCQ9jMun9v4AAAjgqA8LKAsZzO8BB2EbG9KABiltDW1hbV1NRIg8qc7vAQFl2jz0bMAfr6+mhxcTFuCCvCQ+j9cQFUVVVRbm4uQ2xvb8eEsCo8hMBaAOk9sLb/V4Qzg7AyPITAWgDcE4cAuru7dSG1ELW1tbrw2Bq3Uuj9CI3/aeBY2kZRPloAWAZhdXgIJWS0DkBbPkZrIewID5kCGMtH64aGBnK73epX2SNTAGP5IDRa6s7OjvoV9mrc3c+/RLWLGh1ATk6O40JrFVqc44UMIASMDsCJ1v7213kfBjPhaAAsIbH/IwVQ7WgArH+Ni3ijHQ3A5bNfKrLgwo4FwGazWfnAjgVAtzErn9BbL/0Hb48jmRUG/DsAAAAASUVORK5CYII=" alt="Denkmal anlegen" height="45" width="45">
       <p>Es öffnet sich am linken oberen Rand der Karte ein Fenster.</p>
-      <img src="assets/create_denkmal_coord-B2p7-aCo.png" alt="Denkmal anlegen Koordinaten">
+      <img src="/assets/create_denkmal_coord-B2p7-aCo.png" alt="Denkmal anlegen Koordinaten">
       <p>Nachdem der Standort des neuen Denkmals durch einen Klick in die Karte definiert wurde, können über den Button
         "weiter" dessen Attribute eingegeben werden.<br />
       </p>
@@ -657,7 +657,7 @@ <h2 id="hilfe_osm">Anleitung Daten in OSM einpflegen</h2>
       <p>Falls das Objekt noch nicht verfügbar sein sollte, kannst Du über das Menü oben z.B. einen neuen Punkt für
         ein
         Denkmal anlegen:</p>
-      <img src="assets/osm_point-9yv9KjyM.png" alt="OSM Punk anlegen">
+      <img src="/assets/osm_point-9yv9KjyM.png" alt="OSM Punk anlegen">
       <p>Rechts kannst Du eine andere Hintergrundkarte auswählen. Die Luftbilder des Landes NRW sind recht aktuell
         (2-Jahres-Zyklus) und besitzen
         mit 10 cm eine hervorragende Auflösung. Dies hilft sehr, die richtige Lokalisierung für den Punkt zu finden.
@@ -667,9 +667,9 @@ <h2 id="hilfe_osm">Anleitung Daten in OSM einpflegen</h2>
         In diesem Fall auf "NRW Orthofoto" umschalten.</p>
       <p>Durch einen Klick in die Karte kann der Punkt dann gesetzt werden.</p>
       <p>Auf der linken Seite öffnet sich ein Kontextmenü, dort nach Denkmal suchen und auswählen:</p>
-      <img src="assets/osm_tag-BjgiwRZ6.png" alt="OSM Tag">
+      <img src="/assets/osm_tag-BjgiwRZ6.png" alt="OSM Tag">
       <p>Es können dann noch mehrere Merkmale vergeben werden:</p>
-      <img src="assets/osm_tagging-Cy8CvYCD.png" alt="OSM Merkmale">
+      <img src="/assets/osm_tagging-Cy8CvYCD.png" alt="OSM Merkmale">
       <p>Uns interessiert hier hauptsächlich der Link zum 3D Modell. Dafür wird zwar <i>building:model = URL</i>
         <a class="blackdiv" target="_blank" href="https://wiki.openstreetmap.org/wiki/3D_development/Tagging">hier</a>
         vorgeschlagen, doch wird dies kaum verwendet.
@@ -689,7 +689,7 @@ <h2 id="oklab">Über CodeforCologne [OK-Lab Köln]</h2>
         Anderen, die sich regelmäßig treffen, um an nützlichen Anwendungen rund um offene Daten zu arbeiten. Unser
         Treffen findet alle zwei Wochen statt. Schaut einfach in unserer <a class="blackdiv" target="_blank"
           href="https://www.meetup.com/de-DE/codeforcologne/">Meetup Gruppe</a> vorbei!</p>
-      <a class="blackdiv" target="_blank" href="https://codefor.de/koeln/"><img src="assets/oklab_koelle-9LTdKmyK.png"
+      <a class="blackdiv" target="_blank" href="https://codefor.de/koeln/"><img src="/assets/oklab_koelle-9LTdKmyK.png"
           alt="CodeforCologne"></a>
       <h2 id="kontakt">Kontakt</h2>
       <p>Martin: contact (at) opendemdata.info</p>
@@ -1281,7 +1281,7 @@ <h2 id="delete_headline">Denkmal löschen</h2>
     </div>
     <div id="deleteFooter" class="modal_footer">Denkmal 4D Köln</div>
   </div>
-  <img class="loader" id="loader" src="assets/loader-BqnzDy8Q.gif" title="Loader (c) loading.io" alt="Loader (c) loading.io">
+  <img class="loader" id="loader" src="/assets/loader-BqnzDy8Q.gif" title="Loader (c) loading.io" alt="Loader (c) loading.io">
   <script>
     function zurAnleitung() {
       document.getElementById("help").style.display = "block";

diff --git a/src/main.js b/src/main.js
@@ -143,10 +143,16 @@ class SelectorControl extends Control {
     radioItem4.id = "rad4";
     radioItem4.value = "myradio4";
 
+    var radioItem5 = document.createElement("input");
+    radioItem5.type = "radio";
+    radioItem5.name = "radioGrp";
+    radioItem5.id = "rad5";
+    radioItem5.value = "myradio5";
     var objTextNode1 = document.createTextNode("3D Model");
     var objTextNode2 = document.createTextNode("Foto");
     var objTextNode3 = document.createTextNode("Wikipedia");
     var objTextNode4 = document.createTextNode("OpenStreetMap");
+    var objTextNode5 = document.createTextNode("Podcast");
 
     var objLabel = document.createElement("label");
     objLabel.style.cssText = "position:absolute;top:50px;left:10px";
@@ -172,28 +178,35 @@ class SelectorControl extends Control {
     objLabel4.appendChild(radioItem4);
     objLabel4.appendChild(objTextNode4);
 
+    var objLabel5 = document.createElement("label");
+    objLabel5.style.cssText = "position:absolute;top:130px;left:10px;";
+    objLabel5.htmlFor = radioItem5.id;
+    objLabel5.appendChild(radioItem5);
+    objLabel5.appendChild(objTextNode5);
+
     var objTextNode5 = document.createElement("P");
     objTextNode5.innerHTML =
       "<strong>Was gibt es hier zu pflegen?</strong>";
     objTextNode5.style.cssText = "position:absolute;left:20px";
 
 
     var divLegend = document.createElement("p");
-    divLegend.style.cssText = "position:absolute;top:120px;left:5px";
+    divLegend.style.cssText = "position:absolute;top:140px;left:5px";
     divLegend.innerHTML = `<div><strong>&nbsp;&nbsp;Vorhanden:</strong></div><div class="kreis_green"></div>&nbsp;&nbsp;Ja<br />
         <div  id="kreis_yellow"><div class="kreis_yellow"></div>&nbsp;&nbsp;In Arbeit</div>
         <div class="kreis_red"></div>&nbsp;&nbsp;Nein`;
 
     var element = document.createElement("div");
     element.style.cssText =
-      "position:relative;top:10px;left:10px;background: lightcyan; width: 225px; height: 220px;";
+      "position:relative;top:10px;left:10px;background: lightcyan; width: 225px; height: 240px;";
     element.className = "ol-unselectable ol-control noiseselect";
     element.id = "controlEle";
     element.appendChild(objTextNode5);
     element.appendChild(objLabel);
     element.appendChild(objLabel2);
     element.appendChild(objLabel3);
     element.appendChild(objLabel4);
+    element.appendChild(objLabel5);
     element.appendChild(divLegend);
 
 
@@ -222,6 +235,11 @@ class SelectorControl extends Control {
       this.handleOtherChange.bind(this),
       false
     );
+    objLabel5.addEventListener(
+      "change",
+      this.handleOtherChange.bind(this),
+      false
+    );
 
 
   }
@@ -571,6 +589,9 @@ function updateWMS() {
   if (document.getElementById("rad4").checked) {
     newStyle = 'openmaps:denkmaeler_osm'
   }
+  if (document.getElementById("rad5").checked) {
+    newStyle = 'openmaps:denkmaeler_podcast'
+  }
 
   wmsLayer.getSource().updateParams({
     styles: newStyle