From 1ad6c63a2fbb0321bcd616452967c042b51dfa89 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kier=C3=A1n=20Meinhardt?= <kmein@posteo.de>
Date: Tue, 22 Feb 2022 20:34:53 +0100
Subject: [PATCH] feat(makanek): redaktion.r

---
 flake.lock                        |   6 +-
 lib/radio-news.html               | 143 ++++++++++++++++++++++++++++++
 systems/makanek/configuration.nix |   1 +
 systems/makanek/radio-news.nix    |   7 ++
 4 files changed, 154 insertions(+), 3 deletions(-)
 create mode 100644 lib/radio-news.html
 create mode 100644 systems/makanek/radio-news.nix
diff --git a/flake.lock b/flake.lock
index cfd4173..13d5e00 100644
--- a/flake.lock
+++ b/flake.lock
@@ -158,11 +158,11 @@
     "retiolum": {
       "flake": false,
       "locked": {
-        "lastModified": 1645135023,
-        "narHash": "sha256-kgUEjGo725tJTXJM2a0PRAyG6lqnTvS2t/sBIJTPZWs=",
+        "lastModified": 1645558430,
+        "narHash": "sha256-Q8URzBIbh6vHf5QHKWHEMUDbRHeyVSFpqB8i4PmnX6M=",
         "owner": "krebs",
         "repo": "retiolum",
-        "rev": "b555fab8bdcc4dd1ca2241b05861096e263db5b8",
+        "rev": "5e69ac7782c7d384a4b6cad4619dd83aa952426f",
         "type": "github"
       },
       "original": {
diff --git a/lib/radio-news.html b/lib/radio-news.html
new file mode 100644
index 0000000..2d98aa1
--- /dev/null
+++ b/lib/radio-news.html
@@ -0,0 +1,143 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <title>lassulus radio news</title>
+    <style>
+      body {
+        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+      }
+
+      main {
+        max-width: 800px;
+        margin: 0 auto;
+        display: grid;
+        grid-template-columns: 2fr 1fr;
+        grid-gap: 2em;
+      }
+
+      #news-list ul {
+        list-style: none;
+        padding-left: 0;
+      }
+
+      #news-list li {
+        margin-bottom: 1em;
+      }
+
+      #news-list time {
+        display: block;
+        color: grey;
+      }
+
+      form label {
+        display: block;
+      }
+
+      form input,
+      form textarea {
+        width: 100%;
+        margin-bottom: 1em;
+      }
+
+      @media only screen and (max-width: 768px) {
+        main {
+          grid-template-columns: 1fr;
+        }
+      }
+    </style>
+    <script>
+      const newsEndpoint = "http://prism.r:7999";
+
+      function isoString(date) {
+        return date.toISOString().slice(0, -5) + "Z";
+      }
+
+      function setNextNews() {
+        document.getElementById("next-news").innerHTML = (
+          60 - new Date().getUTCMinutes()
+        ).toString();
+      }
+
+      setInterval(setNextNews, 6000);
+
+      function fetchNews() {
+        fetch(newsEndpoint).then((response) => {
+          response.json().then((news) => {
+            const newsList = document.getElementById("news-list");
+            newsList.innerHTML = "";
+            const ul = document.createElement("ul");
+            for (const newsItem of news) {
+              const start = new Date(newsItem.from);
+              const end = new Date(newsItem.to);
+
+              const li = document.createElement("li");
+
+              const startDate = document.createElement("time");
+              startDate.className = "start";
+              startDate.title = start.toString();
+              startDate.setAttribute("datetime", isoString(start));
+              startDate.appendChild(document.createTextNode(isoString(start)));
+
+              const endDate = document.createElement("time");
+              endDate.className = "end";
+              endDate.title = end.toString();
+              endDate.setAttribute("datetime", isoString(end));
+              endDate.appendChild(document.createTextNode(isoString(end)));
+
+              li.appendChild(document.createTextNode(newsItem.text));
+              li.appendChild(startDate);
+              li.appendChild(endDate);
+              ul.appendChild(li);
+            }
+            newsList.appendChild(ul);
+          });
+        });
+      }
+
+      function sendNews(event) {
+        event.preventDefault();
+        const formData = new FormData(event.target);
+
+        const request = new XMLHttpRequest();
+        request.open("POST", newsEndpoint, false); // synchronous
+        request.send(
+          JSON.stringify({
+            from: isoString(new Date(formData.get("from"))),
+            to: isoString(new Date(formData.get("to"))),
+            text: formData.get("text"),
+          })
+        );
+        location.reload();
+      }
+
+      window.onload = () => {
+        setNextNews();
+        fetchNews();
+      };
+    </script>
+  </head>
+  <body>
+    <main>
+      <section>
+        <h1>Submit news</h1>
+        <form onsubmit="sendNews(event)">
+          <label>Start date</label>
+          <input type="datetime-local" name="from" required />
+          <label>End date</label>
+          <input type="datetime-local" name="to" required />
+          <label>News text</label>
+          <textarea name="text" rows="10" required></textarea>
+          <input type="submit" />
+        </form>
+        Next news report should start in <span id="next-news"></span> minutes.
+      </section>
+      <aside>
+        <h1>Planned news</h1>
+        <div id="news-list">
+          <em>No news planned yet.</em>
+        </div>
+      </aside>
+    </main>
+  </body>
+</html>
diff --git a/systems/makanek/configuration.nix b/systems/makanek/configuration.nix
index 38e1847..9dbd0f3 100644
--- a/systems/makanek/configuration.nix
+++ b/systems/makanek/configuration.nix
@@ -15,6 +15,7 @@ in
     ./moodle-dl-borsfaye.nix
     ./names.nix
     ./nextcloud.nix
+    ./radio-news.nix
     ./radio.nix
     ./retiolum-map.nix
     ./tarot.nix
diff --git a/systems/makanek/radio-news.nix b/systems/makanek/radio-news.nix
new file mode 100644
index 0000000..2bc9d53
--- /dev/null
+++ b/systems/makanek/radio-news.nix
@@ -0,0 +1,7 @@
+{ pkgs, lib, ... }:
+let
+  inherit (import <niveum/lib>) serveHtml;
+in
+{
+  services.nginx.virtualHosts."redaktion.r".locations."/".extraConfig = serveHtml <niveum/lib/radio-news.html> pkgs;
+}
