feat/dossiers-ngi: dated tip/at bar keeps caller path on edition switch

sites/dossiers.ngi.hacktivism.ch/_cascade/bar.js

@@ -25,6 +25,99 @@
     }
   }
 
+  function setEditionCookie(edition) {
+    document.cookie =
+      "tdpd_edition=" +
+      encodeURIComponent(edition) +
+      "; Path=/; Max-Age=31536000; SameSite=Lax";
+  }
+
+  function keepPath() {
+    return location.pathname + location.search;
+  }
+
+  function useHref(edition) {
+    var path = keepPath();
+    var href = "/_cascade/use/" + encodeURIComponent(edition);
+    if (!path || path.indexOf("/_cascade/use/") === 0) return href;
+    return href + "?next=" + encodeURIComponent(path);
+  }
+
+  function hintEl() {
+    return document.getElementById("cascade-hint");
+  }
+
+  function showHint(msg) {
+    var el = hintEl();
+    if (!el) {
+      var bar = document.getElementById("cascade-bar");
+      if (!bar) return;
+      el = document.createElement("div");
+      el.id = "cascade-hint";
+      el.className = "cascade-hint";
+      el.setAttribute("role", "status");
+      bar.appendChild(el);
+    }
+    el.hidden = false;
+    el.textContent = msg;
+    pinBar();
+  }
+
+  function clearHint() {
+    var el = hintEl();
+    if (!el) return;
+    el.hidden = true;
+    el.textContent = "";
+    pinBar();
+  }
+
+  function responseKeepsBar(res, text) {
+    if (res && res.ok) return true;
+    var body = text || "";
+    return (
+      body.indexOf("cascade-bar") !== -1 ||
+      body.indexOf("cascade-missing") !== -1
+    );
+  }
+
+  function switchEdition(edition, branchLabel) {
+    var prev = cookieEdition();
+    var here = keepPath() || "/";
+    var label = branchLabel || edition;
+    if (!edition) return;
+    if (edition === prev) {
+      clearHint();
+      return;
+    }
+    setEditionCookie(edition);
+    fetch(here, { cache: "no-store", credentials: "same-origin" })
+      .then(function (res) {
+        return res.text().then(function (text) {
+          return { res: res, text: text };
+        });
+      })
+      .then(function (got) {
+        if (responseKeepsBar(got.res, got.text)) {
+          location.replace(here + location.hash);
+          return;
+        }
+        setEditionCookie(prev);
+        showHint(
+          "This path is not in " +
+            label +
+            ". Choose another branch above."
+        );
+      })
+      .catch(function () {
+        setEditionCookie(prev);
+        showHint(
+          "This path is not in " +
+            label +
+            ". Choose another branch above."
+        );
+      });
+  }
+
   function esc(s) {
     return String(s)
       .replace(/&/g, "&")
@@ -276,8 +369,8 @@
       var parent = row.parent || "";
       var isDefault = branch === defaultBranch;
       html.push(
-        '<a class="cascade-tree-row" role="treeitem" href="/_cascade/use/' +
-          esc(edition) +
+        '<a class="cascade-tree-row" role="treeitem" href="' +
+          esc(useHref(edition)) +
           '" data-edition="' +
           esc(edition) +
           '" data-branch="' +
@@ -333,7 +426,9 @@
       .catch(function () {
         if (!soft && mount && !mount.querySelector("a[data-edition]")) {
           mount.innerHTML =
-            '<a class="cascade-tree-row" href="/_cascade/use/flask" data-edition="flask" data-branch="flask"><span class="cascade-name"><code>flask</code></span></a>' +
+            '<a class="cascade-tree-row" href="' +
+            esc(useHref("flask")) +
+            '" data-edition="flask" data-branch="flask"><span class="cascade-name"><code>flask</code></span></a>' +
             '<span class="tip"> (branch-status unavailable)</span>';
           markActive(mount, cookieEdition());
           pinBar();
@@ -341,6 +436,26 @@
       });
   }
 
+  document.addEventListener("click", function (ev) {
+    var a = ev.target.closest
+      ? ev.target.closest("a.cascade-tree-row[data-edition]")
+      : null;
+    if (!a || ev.defaultPrevented) return;
+    if (ev.button !== 0 || ev.metaKey || ev.ctrlKey || ev.shiftKey || ev.altKey)
+      return;
+    ev.preventDefault();
+    switchEdition(
+      a.getAttribute("data-edition"),
+      a.getAttribute("data-branch") || a.getAttribute("data-edition")
+    );
+  });
+
+  if (document.body && document.body.classList.contains("cascade-missing")) {
+    showHint(
+      "This path is not in the current branch. Choose another branch above."
+    );
+  }
+
   loadStatus(false);
   setInterval(function () {
     loadStatus(true);