1 files changed, 94 insertions, 0 deletions
diff --git a/static/js/dynamic-comment-form.js b/static/js/dynamic-comment-form.js
new file mode 100644
index 0000000..4be2d52
--- /dev/null
+++ b/static/js/dynamic-comment-form.js
@@ -0,0 +1,94 @@
+/*
+ * dynamic-comment-form.js -- Captcha challenge loader
+ * Copyright © 2022 - 2023 Jakob L. Kreuze <zerodaysfordays@sdf.org>
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU General Public License as
+ * published by the Free Software Foundation; either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see
+ * <http://www.gnu.org/licenses/>.
+ */
+
+function makeRequest (method, url) {
+  return new Promise(function (resolve, reject) {
+    var xhr = new XMLHttpRequest();
+    xhr.open(method, url);
+    xhr.onload = function () {
+      if (xhr.status >= 200 && xhr.status < 300) {
+        resolve(xhr.response);
+      } else {
+        reject({
+          status: xhr.status,
+          statusText: xhr.statusText
+        });
+      }
+    };
+    xhr.onerror = function () {
+      reject({
+        status: xhr.status,
+        statusText: xhr.statusText
+      });
+    };
+    xhr.send();
+  });
+}
+
+window.addEventListener("load", () => {
+  let primaryDisplay = document.getElementById("comment-form-primary");
+  primaryDisplay.removeAttribute("hidden");
+
+  let altDisplay = document.getElementById("comment-form-alt");
+  altDisplay.remove();
+
+  let trigger = document.getElementById("captcha-challenge-trigger");
+  let triggerBlock = document.getElementById("captcha-trigger-block");
+  trigger.addEventListener("click", (event) => {
+    let captchaField = document.getElementById("comment-captcha");
+
+    let captchaId = document.getElementById("captcha-id");
+    let captchaImage = document.getElementById("captcha-image");
+
+    trigger.innerHTML = "Please wait...";
+    trigger.disabled = true;
+
+    if (captchaId.value === "") {
+      makeRequest("GET", "/api/challenge/captcha")
+        .then(function (data) {
+          // Update form with parsed values.
+          let challengeData = JSON.parse(data);
+          captchaId.value = challengeData["challenge-id"];
+          captchaImage.src = challengeData["image"];
+
+          // Unhide fieldset.
+          captchaField.removeAttribute("hidden");
+
+          // Hide initial trigger.
+          triggerBlock.remove();
+        })
+        .catch(console.err);
+    }
+
+    event.preventDefault();
+  });
+});
+
+
+window.addEventListener("load", () => {
+  let header = document.getElementById("comment-form-header");
+  let replyTo = document.getElementById("reply-to");
+  let buttons = document.querySelectorAll(".comment-reply-button");
+  buttons.forEach((button) => {
+    button.addEventListener("click", (event) => {
+      header.innerHTML = "Comment form (reply mode)";
+      replyTo.value = button.getAttribute("data-reply-to-id");
+    });
+  });
+});