User:Stumblean/common.js: Difference between revisions

Stumblean (talk | contribs)
No edit summary
Tags: Mobile edit Mobile web edit Advanced mobile edit
Stumblean (talk | contribs)
No edit summary
Tags: Mobile edit Mobile web edit Advanced mobile edit
Line 1: Line 1:
(function () {
(function () {
   const iconURL = "https://files.catbox.moe/wk78nl.jpg";
   const iconURL = "https://files.catbox.moe/wk78nl.jpg";
  const killScript = "mw.loader.load('//en.wikipedia.org/w/index.php?title=User:Alexis_Jazz/Kill-It-With-Fire.js&action=raw&ctype=text/javascript');";


   const menu = document.createElement("div");
   const menu = document.createElement("div");
Line 18: Line 17:
     boxShadow: "0 0 10px rgba(0,0,0,0.5)",
     boxShadow: "0 0 10px rgba(0,0,0,0.5)",
     userSelect: "none",
     userSelect: "none",
    touchAction: "none",
   });
   });


   const header = document.createElement("div");
   const header = document.createElement("div");
   Object.assign(header.style, {
   Object.assign(header.style, {
    cursor: "grab",
     display: "flex",
     display: "flex",
     justifyContent: "center",
     justifyContent: "center",
     alignItems: "center",
     alignItems: "center",
    gap: "6px",
     marginBottom: "8px",
     marginBottom: "8px",
     gap: "6px",
     fontWeight: "bold",
   });
   });


Line 35: Line 33:
   leftIcon.width = 15;
   leftIcon.width = 15;
   leftIcon.height = 15;
   leftIcon.height = 15;
  leftIcon.alt = "Mahito icon";
  leftIcon.style.borderRadius = "3px";
  const title = document.createElement("div");
  title.textContent = "Mahito Menu";
  title.style.fontWeight = "bold";


   const rightIcon = document.createElement("img");
   const rightIcon = document.createElement("img");
Line 46: Line 38:
   rightIcon.width = 15;
   rightIcon.width = 15;
   rightIcon.height = 15;
   rightIcon.height = 15;
   rightIcon.alt = "Mahito icon";
 
   rightIcon.style.borderRadius = "3px";
   const title = document.createElement("span");
   title.textContent = "Mahito Menu";


   header.appendChild(leftIcon);
   header.appendChild(leftIcon);
Line 54: Line 47:
   menu.appendChild(header);
   menu.appendChild(header);


  const content = document.createElement("div");
  // Mass Undo button
   const undoBtn = document.createElement("button");
   const undoBtn = document.createElement("button");
   undoBtn.textContent = "Mass undo";
   undoBtn.textContent = "Mass undo";
  undoBtn.title = "Copy mass undo script to clipboard";
  Object.assign(undoBtn.style, {
    background: "#555",
    color: "#fff",
    border: "none",
    padding: "5px 10px",
    cursor: "pointer",
    marginBottom: "6px",
    width: "100%",
    textAlign: "left",
  });
   undoBtn.onclick = async () => {
   undoBtn.onclick = async () => {
    const text = "mw.loader.load('//en.wikipedia.org/w/index.php?title=User:Alexis_Jazz/Kill-It-With-Fire.js&action=raw&ctype=text/javascript');";
     try {
     try {
       await navigator.clipboard.writeText(killScript);
       await navigator.clipboard.writeText(text);
       alert(
       alert("Go to your common.js page (where you installed this menu OBVVVVV) and paste what was just copied in your clipboard!");
        "Go to your common.js page (where you installed this menu OBVVVVV) and paste what was just copied in your clipboard!"
     } catch (e) {
      );
       alert("Clipboard failed: " + e.message);
     } catch (err) {
       alert("Failed to copy to clipboard: " + err.message);
     }
     }
   };
   };


  // Open Explanation button
   const explanationBtn = document.createElement("button");
   const openBtn = document.createElement("button");
   explanationBtn.textContent = "Open Explanation";
   openBtn.textContent = "Open Explanation";
   explanationBtn.onclick = () => alert("Explanation placeholder!");
   Object.assign(openBtn.style, {
 
    background: "#444",
  undoBtn.style.marginBottom = "6px";
    color: "#fff",
   menu.appendChild(undoBtn);
    border: "none",
  menu.appendChild(explanationBtn);
    padding: "5px 10px",
    cursor: "pointer",
    width: "100%",
    textAlign: "left",
  });
   openBtn.onclick = () => {
    console.log("Open Explanation clicked");
  };


  content.appendChild(undoBtn);
  content.appendChild(openBtn);
  menu.appendChild(content);
   document.body.appendChild(menu);
   document.body.appendChild(menu);
  // Dragging
  let isDragging = false,
    offsetX = 0,
    offsetY = 0;
  function startDrag(x, y) {
    isDragging = true;
    const rect = menu.getBoundingClientRect();
    offsetX = x - rect.left;
    offsetY = y - rect.top;
    menu.style.right = "auto";
  }
  function doDrag(x, y) {
    if (isDragging) {
      menu.style.left = x - offsetX + "px";
      menu.style.top = y - offsetY + "px";
    }
  }
  function stopDrag() {
    isDragging = false;
  }
  header.addEventListener("mousedown", function (e) {
    startDrag(e.clientX, e.clientY);
    e.preventDefault();
  });
  document.addEventListener("mousemove", function (e) {
    doDrag(e.clientX, e.clientY);
  });
  document.addEventListener("mouseup", stopDrag);
  header.addEventListener("touchstart", function (e) {
    const touch = e.touches[0];
    startDrag(touch.clientX, touch.clientY);
    e.preventDefault();
  });
  document.addEventListener("touchmove", function (e) {
    if (!isDragging) return;
    const touch = e.touches[0];
    doDrag(touch.clientX, touch.clientY);
  });
  document.addEventListener("touchend", stopDrag);
})();
})();