Add per-category details

layers/chandler/layer.js

@@ -13,11 +13,13 @@ const res = await fetch("https://whereis.chandlerswift.com/api/0/last");
 const locs = await res.json();
 const loc = locs[0];
 
+let geometry = new Point(fromLonLat([loc.lon, loc.lat]));
+
 const vectorLayer = new VectorLayer({
     source: new VectorSource({
         features: [
             new Feature({
-                geometry: new Point(fromLonLat([loc.lon, loc.lat])),
+                geometry: geometry,
             })
         ]
     }),
@@ -29,4 +31,11 @@ const vectorLayer = new VectorLayer({
     }),
 });
 
+setInterval(async function(){
+    const res = await fetch("https://whereis.chandlerswift.com/api/0/last");
+    const locs = await res.json();
+    const loc = locs[0];
+    geometry.setCoordinates(fromLonLat([loc.lon, loc.lat]));
+}, 10 * 1000);
+
 export default vectorLayer;

layers/light_pollution.js

@@ -25,4 +25,5 @@ let layers = [];
 export default {
     name: "Light Pollution",
     layers: layers,
+    details: "For legend and more information, see <a href='https://www.cleardarksky.com/'>cleardarksky.com</a>.",
 };

main.js

@@ -28,6 +28,7 @@ for (let category of layerCategories) {
   catDiv.innerHTML = `
     <details ${category.layers.filter(l => l.enabled).length > 0 ? "open" : ""}>
     <summary>${category.name}</summary>
+    ${category.details ? "<p>" + category.details + "</p>" : ""}
     <ul></ul>
     </details>
   `;