Revert "Revert "update mod loader""

This reverts commit 5e88bd9a30.

static/pleroma-mod-loader.js

@@ -11,6 +11,11 @@ function PleromaModLoader () {
   function loadMods () {
     for (const mod of this.config.mods) {
       const modObject = new PleromaMod(mod);
+      modObject.enabled = true;
+      if (localStorage.getItem("pleroma_mod_" + mod + "_enabled") === "false") {
+        modObject.enabled = false;
+      }
+      localStorage.setItem("pleroma_mod_" + mod + "_enabled", modObject.enabled);
       modObject.include();
       this.loadedMods[mod] = modObject;
     }
@@ -44,9 +49,17 @@ function PleromaModLoader () {
     const loginPanel = document.getElementsByClassName("login-form");
     if (postPanel.length > 0 || loginPanel.length > 0) {
       for (var modName in this.loadedMods) {
+        const settings = document.querySelector(".settings div[label]:first-child");
+        if (settings) {
+          if (!settings.querySelector(".mod-settings")) {
+            this.appendModSettings(settings);
+          }
+        }
         const mod = this.loadedMods[modName];
-        if (mod.instance.onReady) {
-          mod.instance.onReady();
+        if (mod.enabled && mod.instance) {
+          if (mod.instance.onReady) {
+            mod.instance.onReady();
+          }
         }
       }
       this.createObserver();
@@ -55,6 +68,63 @@ function PleromaModLoader () {
     }
   },
 
+  function createCheckbox (label, mod) {
+    const labelElement = document.createElement("label");
+    labelElement.classList.add("checkbox");
+
+    const input = document.createElement("input");
+    input.setAttribute("type", "checkbox");
+    input.checked = mod.enabled;
+    input.addEventListener("change", (event) => {
+      if (event.target.checked) {
+        mod.enable();
+      } else {
+        mod.disable();
+      }
+    });
+    labelElement.appendChild(input);
+
+    const fakeCheckbox = document.createElement("i");
+    fakeCheckbox.classList.add("checkbox-indicator");
+    labelElement.appendChild(fakeCheckbox);
+
+    const text = document.createElement("span");
+    text.classList.add("label");
+    text.innerText = label;
+
+    labelElement.appendChild(text);
+
+    return labelElement;
+  },
+
+  function appendModSettings (element) {
+    const container = document.createElement("div");
+    container.classList.add("setting-item");
+    container.classList.add("mod-settings");
+
+    const title = document.createElement("h2");
+    title.innerText = "Mods";
+    container.appendChild(title);
+
+    const optionList = document.createElement("ul");
+    optionList.classList.add("setting-list");
+
+    const modNames = Object.keys(this.loadedMods).sort();
+    for (const mod of modNames) {
+      const li = document.createElement("li");
+
+      const enable = this.createCheckbox("enable " + mod, this.loadedMods[mod]);
+
+      li.appendChild(enable);
+
+      optionList.appendChild(li);
+    }
+
+    container.appendChild(optionList);
+
+    element.appendChild(container);
+  },
+
   function createObserver () {
     this.containers = {
       main: document.getElementsByClassName("main")[0],
@@ -63,16 +133,26 @@ function PleromaModLoader () {
 
     const observerConfig = { subtree: true, childList: true };
     this.observer = new MutationObserver((mutations, observer) => {
+      if (
+        mutations.length > 0 &&
+        mutations[0].addedNodes.length > 0 &&
+        mutations[0].addedNodes[0].classList &&
+        mutations[0].addedNodes[0].classList.contains("settings")
+      ) {
+        this.appendModSettings(mutations[0].addedNodes[0].querySelector("div[label]:first-child"));
+      }
       for (var modName in this.loadedMods) {
         const mod = this.loadedMods[modName];
-        if (mod.instance.onMutation) {
-          for (const mutation of mutations) {
-            let filter = null;
-            if (mod.instance.config.filter) {
-              filter = new RegExp(mod.instance.config.filter.join("|"));
-            }
-            if (!filter || filter.test(mutation.target.className)) {
-              mod.instance.onMutation(mutation, observer);
+        if (mod.instance && mod.enabled) {
+          if (mod.instance.onMutation) {
+            for (const mutation of mutations) {
+              let filter = null;
+              if (mod.instance.config.filter) {
+                filter = new RegExp(mod.instance.config.filter.join("|"));
+              }
+              if (!filter || filter.test(mutation.target.className)) {
+                mod.instance.onMutation(mutation, observer);
+              }
             }
           }
         }
@@ -128,6 +208,7 @@ function PleromaModLoader () {
 function PleromaMod (name) {
   this.name = name;
   this.instance = null;
+  this.enabled = localStorage.getItem("pleroma_mod_" + this.name + "_enabled") !== "false";
 }
 [
   function getClassName () {
@@ -140,12 +221,32 @@ function PleromaMod (name) {
     return className;
   },
 
+  function enable () {
+    this.enabled = true;
+    this.modLoaded();
+    if (this.instance.onReady) {
+      this.instance.onReady();
+    }
+    localStorage.setItem("pleroma_mod_" + this.name + "_enabled", this.enabled);
+  },
+
+  function disable () {
+    this.enabled = false;
+    if (this.instance.onDestroy) {
+      this.instance.onDestroy();
+    }
+    this.instance = null;
+    localStorage.setItem("pleroma_mod_" + this.name + "_enabled", this.enabled);
+  },
+
   function include () {
     console.log("loading " + this.name);
     PleromaModLoader.includeScript(
       PleromaModLoader.getModDir() + "pleroma-mod-" + this.name + "/mod.js"
     ).then(() => {
-      this.modLoaded();
+      if (this.enabled) {
+        this.modLoaded();
+      }
     });
   },