Rename src/addons/addons/debug-console to src/addons/addons/debug-console/userscript.js

src/addons/addons/debug-console/userscript.js

@@ -0,0 +1,201 @@
+while (true) {
+    const targetElem = await addon.tab.waitForElement(
+        'div[class*="menu-bar_file-group"] > div:last-child:not(.sa-record)',
+        { markAsSeen: true }
+    );
+
+
+    // ✅ デバッグボタンを追加
+    if (!document.querySelector('.sa-debug-button')) {
+        const debugBtn = document.createElement("div");
+        debugBtn.className = "sa-debug-button " + targetElem.className;
+        debugBtn.textContent = "デバッグ";
+        debugBtn.style.cursor = "pointer";
+        debugBtn.addEventListener("click", () => {
+            // デバッグコンソール実行スクリプト
+            (function () {
+                if (window.__injectedConsole) return;
+                window.__injectedConsole = true;
+
+  const style = 
+    #floatingConsole {
+      position: fixed;
+      bottom: 20px;
+      right: 20px;
+      width: 400px;
+      max-height: 60vh;
+      background: #111;
+      color: #0f0;
+      font-family: monospace;
+      font-size: 14px;
+      border: 1px solid #0f0;
+      border-radius: 8px;
+      box-shadow: 0 0 10px #0f0;
+      z-index: 999999;
+      display: flex;
+      flex-direction: column;
+      resize: both;
+      overflow: hidden;
+    }
+    #floatingConsoleHeader {
+      background: #222;
+      cursor: move;
+      padding: 5px 10px;
+      user-select: none;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+    #floatingConsoleHeader button {
+      background: transparent;
+      color: #0f0;
+      border: none;
+      font-weight: bold;
+      margin-left: 5px;
+      cursor: pointer;
+    }
+    #floatingConsoleLog {
+      flex: 1;
+      overflow-y: auto;
+      padding: 10px;
+      border-top: 1px solid #0f0;
+      border-bottom: 1px solid #0f0;
+      background: #000;
+    }
+    #floatingConsoleInput {
+      display: flex;
+      border-top: 1px solid #0f0;
+    }
+    #floatingConsoleInput input {
+      flex: 1;
+      background: #000;
+      color: #0f0;
+      border: none;
+      padding: 10px;
+      font-family: monospace;
+    }
+    #floatingConsoleInput button {
+      background: #333;
+      color: #0f0;
+      border: none;
+      padding: 10px;
+      cursor: pointer;
+    }
+  ;
+
+  const css = document.createElement("style");
+  css.textContent = style;
+  document.head.appendChild(css);
+
+  const el = document.createElement("div");
+  el.id = "floatingConsole";
+  el.innerHTML = 
+    <div id="floatingConsoleHeader">
+      <span id="consoleTitle">🖥 Console</span>
+      <div>
+        <button id="minBtn">∧</button>
+        <button id="closeBtn">×</button>
+      </div>
+    </div>
+    <div id="floatingConsoleLog">[Console Ready]</div>
+    <div id="floatingConsoleInput">
+      <input id="floatingConsoleCmd" placeholder="JavaScriptを入力..." />
+      <button id="execBtn">実行</button>
+    </div>
+  ;
+  document.body.appendChild(el);
+
+  const logBox = el.querySelector("#floatingConsoleLog");
+  const input = el.querySelector("#floatingConsoleCmd");
+
+  const log = (msg) => {
+    const div = document.createElement("div");
+    div.textContent = "> " + msg;
+    logBox.appendChild(div);
+    logBox.scrollTop = logBox.scrollHeight;
+  };
+
+  el.querySelector("#execBtn").onclick = () => {
+    const code = input.value;
+    input.value = "";
+    try {
+      const result = eval(code);
+      log("結果: " + result);
+    } catch (e) {
+      log("エラー: " + e);
+    }
+  };
+
+  el.querySelector("#closeBtn").onclick = () => {
+    el.remove();
+    window.__injectedConsole = false;
+  };
+
+  let minimized = false;
+  const minBtn = el.querySelector("#minBtn");
+  const header = el.querySelector("#floatingConsoleHeader");
+  const title = el.querySelector("#consoleTitle");
+
+  minBtn.onclick = () => {
+    minimized = !minimized;
+    logBox.style.display = minimized ? "none" : "block";
+    el.querySelector("#floatingConsoleInput").style.display = minimized ? "none" : "flex";
+    title.style.display = minimized ? "none" : "inline"; // ✅ タイトル非表示
+    el.querySelector("#closeBtn").style.display = minimized ? "none" : "inline"; // ✅ ×ボタン非表示
+    minBtn.textContent = minimized ? "∨" : "∧";
+
+    if (minimized) {
+      el.style.width = "auto"; // ✅ 幅縮小
+      el.style.height = "auto"; // ✅ 高さ縮小
+      el.style.overflow = "visible";
+    } else {
+      el.style.width = "400px";
+      el.style.maxHeight = "60vh";
+    }
+  };
+
+  // ドラッグ移動
+  (function makeDraggable(target, handle) {
+    let offsetX = 0, offsetY = 0, dragging = false;
+    handle.addEventListener("mousedown", (e) => {
+      dragging = true;
+      offsetX = e.clientX - target.offsetLeft;
+      offsetY = e.clientY - target.offsetTop;
+      document.body.style.userSelect = "none";
+    });
+    document.addEventListener("mousemove", (e) => {
+      if (dragging) {
+        target.style.left = (e.clientX - offsetX) + "px";
+        target.style.top = (e.clientY - offsetY) + "px";
+        target.style.right = "auto";
+        target.style.bottom = "auto";
+      }
+    });
+    document.addEventListener("mouseup", () => {
+      dragging = false;
+      document.body.style.userSelect = "";
+    });
+  })(el, header);
+
+  // console.* フック
+  const hookConsole = (name) => {
+    const original = console[name];
+    console[name] = function (...args) {
+      original.apply(console, args);
+      log("[" + name + "] " + args.join(" "));
+    };
+  };
+  ["log", "warn", "error"].forEach(hookConsole);
+
+  window.onerror = (msg, src, line, col, err) => {
+    log("[onerror] " + msg + " @ " + line + ":" + col);
+  };
+  window.addEventListener("unhandledrejection", (e) => {
+    log("[unhandledrejection] " + e.reason);
+  });
+})();
+
+        });
+        targetElem.parentElement.appendChild(debugBtn);
+    }
+}