Implement basic background animation for closed screen.

src/closed.js

@@ -0,0 +1,80 @@
+/**
+ * This file contains the animation logic for the closed screen.
+ *
+ * In it, we fill the screen evenly with "closed" messages. The locations are
+ */
+/**
+ * Contains the state for this demo.
+ *
+ * @type {{popups: Array, popup_index: number}}
+ */
+const state = {
+    popups: [],
+    popup_index: 0,
+};
+
+const MAX_POPUPS = 200;
+
+function startClosedAnimation() {
+    window.setInterval(animationTick, 100);
+}
+
+function minDist(x, y) {
+    let min = 0;
+    let element;
+    for (element of state.popups) {
+        if (element == null) {
+            continue;
+        }
+
+        const dx = x - element.x;
+        const dy = y - element.y;
+        const dist = Math.sqrt(dx * dx + dy * dy);
+        min = Math.min(dist, min);
+    }
+
+    return min;
+}
+
+function animationTick() {
+    const index = state.popup_index;
+    if (state.popups.length >= MAX_POPUPS) {
+        document.body.removeChild(state.popups[index].element);
+        state.popups[index] = null;
+    }
+
+    const width = window.innerWidth;
+    const height = window.innerHeight;
+
+    // Generate new candidates
+    const candidates = [];
+    for (let i = 0; i < MAX_POPUPS; ++i) {
+        candidates.push({x: Math.random() * width, y: Math.random() * height});
+    }
+
+    let best = candidates[0];
+    let max = minDist(candidates[0].x, candidates[0].y);
+    let candidate;
+    for (candidate of candidates) {
+        const dist = minDist(candidate.x, candidate.y);
+        if (dist > max) {
+            best = candidate;
+            max = dist;
+        }
+    }
+
+    let element = document.createElement('div');
+    element.innerText = 'Nee';
+    element.classList.add('closed_notice');
+    element.style.left = best.x + 'px';
+    element.style.top = best.y + 'px';
+    element.style.transform = 'rotate(' + (Math.random() * 360) + 'deg)';
+
+    document.body.appendChild(element);
+    best.element = element;
+
+    state.popups[index] = best;
+    state.popup_index = (index + 1) % MAX_POPUPS;
+}
+
+export {startClosedAnimation}

src/index.js

@@ -0,0 +1,9 @@
+import {startClosedAnimation} from "./closed";
+
+window.addEventListener('load', function () {
+    if (document.body.classList.contains('open')) {
+        // TODO: leave it in HTML/CSS for now.
+    } else {
+        startClosedAnimation();
+    }
+});