Add: theme switcher

logs_collector/collector/static/collector/js/bs.theme.mode.js

@@ -0,0 +1,90 @@
+/*!
+ * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
+ * Copyright 2011-2023 The Bootstrap Authors
+ * Licensed under the Creative Commons Attribution 3.0 Unported License.
+ */
+
+;(() => {
+  "use strict"
+
+  const getStoredTheme = () => localStorage.getItem("theme")
+  const setStoredTheme = (theme) => localStorage.setItem("theme", theme)
+
+  const getPreferredTheme = () => {
+    const storedTheme = getStoredTheme()
+    if (storedTheme) {
+      return storedTheme
+    }
+
+    return window.matchMedia("(prefers-color-scheme: dark)").matches
+      ? "dark"
+      : "light"
+  }
+
+  const setTheme = (theme) => {
+    if (
+      theme === "auto" &&
+      window.matchMedia("(prefers-color-scheme: dark)").matches
+    ) {
+      document.documentElement.setAttribute("data-bs-theme", "dark")
+    } else {
+      document.documentElement.setAttribute("data-bs-theme", theme)
+    }
+  }
+
+  setTheme(getPreferredTheme())
+
+  const showActiveTheme = (theme, focus = false) => {
+    const themeSwitcher = document.querySelector("#bd-theme")
+
+    if (!themeSwitcher) {
+      return
+    }
+
+    const themeSwitcherText = document.querySelector("#bd-theme-text")
+    const activeThemeIcon = document.querySelector(".theme-icon-active use")
+    const btnToActive = document.querySelector(
+      `[data-bs-theme-value="${theme}"]`
+    )
+    const svgOfActiveBtn = btnToActive
+      .querySelector("svg use")
+      .getAttribute("href")
+
+    document.querySelectorAll("[data-bs-theme-value]").forEach((element) => {
+      element.classList.remove("active")
+      element.setAttribute("aria-pressed", "false")
+    })
+
+    btnToActive.classList.add("active")
+    btnToActive.setAttribute("aria-pressed", "true")
+    activeThemeIcon.setAttribute("href", svgOfActiveBtn)
+    const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`
+    themeSwitcher.setAttribute("aria-label", themeSwitcherLabel)
+
+    if (focus) {
+      themeSwitcher.focus()
+    }
+  }
+
+  window
+    .matchMedia("(prefers-color-scheme: dark)")
+    .addEventListener("change", () => {
+      const storedTheme = getStoredTheme()
+      if (storedTheme !== "light" && storedTheme !== "dark") {
+        setTheme(getPreferredTheme())
+      }
+    })
+
+  window.addEventListener("DOMContentLoaded", () => {
+    showActiveTheme(getPreferredTheme())
+
+    document.querySelectorAll("[data-bs-theme-value]").forEach((toggle) => {
+      toggle.addEventListener("click", () => {
+        const theme = toggle.getAttribute("data-bs-theme-value")
+        setStoredTheme(theme)
+        setTheme(theme)
+        showActiveTheme(theme, true)
+      })
+    })
+  })
+})()

logs_collector/collector/static/collector/js/jq.delete.archive.js

@@ -0,0 +1,31 @@
+$(function () {
+    function deleteArchiveListElement(id) {
+        const archiveList = `#li-archive-${id}`
+        $(archiveList).remove()
+    }
+    $(".btn-archive-eraser").click(function (e) { 
+        e.preventDefault();
+        const csrf = $("input[name=csrfmiddlewaretoken]").val()
+        console.log(csrf)
+        const archiveListElement = $(this).attr("data-jq-archive-target");
+        $.ajax({
+            type: "delete",
+            url: $(this).attr("href"),
+            headers: {
+                'X-CSRFToken':csrf,
+                'Content-Type':'application/json'
+            },
+            // beforeSend: function(xhr) {
+            //     xhr.setRequestHeader("X-CSRFToken", csrf);
+            // },
+            success: function (response) {
+                console.log(response)
+                deleteArchiveListElement(archiveListElement);
+            },
+            error: function (response) {
+                console.log(response)
+            }
+        });
+    });
+    console.log("JQ is ready to work");
+});