@leeguoo/pwtk-network-debugger 1.2.27 → 1.2.29

package/dist/index.esm.js

@@ -8093,6 +8093,7 @@ const _DebugPanel = class _DebugPanel {
     this.isDragging = false;
     this.isResizing = false;
     this.dragStart = { x: 0, y: 0 };
+    this.resizeTimeout = null;
     this.currentTab = "network";
     this.consoleHistory = [];
     this.requestsCache = [];
@@ -8126,12 +8127,11 @@ const _DebugPanel = class _DebugPanel {
     this.container.className = `${this.config.position} ${this.config.minimized ? "minimized" : ""}`;
     this.container.innerHTML = `
       <div class="debugger-header">
-        <div class="debugger-title">🔓 ${this.config.minimized ? "PWTK" : "PWTK 解密小工具"} <span style="font-size: 10px; opacity: 0.7;">by Leo</span></div>
+        <div class="debugger-title">🔓 PWTK 解密小工具 <span style="font-size: 10px; opacity: 0.7;">by Leo</span></div>
         <div class="debugger-controls">
-          ${!this.config.minimized ? '<button class="debugger-btn" data-action="clear" title="清空"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg></button>' : ""}
-          ${!this.config.minimized ? '<button class="debugger-btn" data-action="export" title="导出"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg></button>' : ""}
-          <button class="debugger-btn" data-action="minimize" title="${this.config.minimized ? "展开" : "最小化"}"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="${this.config.minimized ? "M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z" : "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"}"/></svg></button>
-          ${!this.config.minimized ? '<button class="debugger-btn" data-action="fullscreen" title="全屏"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg></button>' : ""}
+          <button class="debugger-btn" data-action="clear" title="清空"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg></button>
+          <button class="debugger-btn" data-action="export" title="导出"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg></button>
+          <button class="debugger-btn" data-action="fullscreen" title="全屏"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg></button>
           <button class="debugger-btn" data-action="close" title="关闭"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg></button>
         </div>
       </div>
@@ -8210,8 +8210,14 @@ const _DebugPanel = class _DebugPanel {
       this.startDrag(e);
     });
     controls.addEventListener("click", (e) => {
-      const target = e.target;
-      const action = target.dataset.action;
+      e.stopPropagation();
+      let target = e.target;
+      while (target && target !== controls) {
+        if (target.dataset?.action) break;
+        target = target.parentElement;
+      }
+      const action = target?.dataset?.action;
+      if (!action) return;
       switch (action) {
         case "clear":
           this.clearRequests();
@@ -8219,9 +8225,6 @@ const _DebugPanel = class _DebugPanel {
         case "export":
           this.exportData();
           break;
-        case "minimize":
-          this.toggleMinimize();
-          break;
         case "fullscreen":
           this.toggleFullscreen();
           break;
@@ -8261,6 +8264,7 @@ const _DebugPanel = class _DebugPanel {
     });
     document.addEventListener("mousemove", this.handleMouseMove.bind(this));
     document.addEventListener("mouseup", this.handleMouseUp.bind(this));
+    window.addEventListener("resize", this.handleWindowResize.bind(this));
   }
   startListening() {
     this.interceptor.addListener((request) => {
@@ -8505,48 +8509,23 @@ Created by Leo (@leeguoo)`);
       alert("分享失败，请稍后重试");
     }
   }
-  toggleMinimize() {
-    this.config.minimized = !this.config.minimized;
-    this.container.classList.toggle("minimized", this.config.minimized);
-    const header = this.container.querySelector(".debugger-header");
-    if (header) {
-      header.innerHTML = `
-        <div class="debugger-title">🔓 ${this.config.minimized ? "PWTK" : "PWTK 解密小工具"} <span style="font-size: 10px; opacity: 0.7;">by Leo</span></div>
-        <div class="debugger-controls">
-          ${!this.config.minimized ? '<button class="debugger-btn" data-action="clear" title="清空"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg></button>' : ""}
-          ${!this.config.minimized ? '<button class="debugger-btn" data-action="export" title="导出"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg></button>' : ""}
-          <button class="debugger-btn" data-action="minimize" title="${this.config.minimized ? "展开" : "最小化"}"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="${this.config.minimized ? "M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z" : "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"}"/></svg></button>
-          ${!this.config.minimized ? '<button class="debugger-btn" data-action="fullscreen" title="全屏"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg></button>' : ""}
-          <button class="debugger-btn" data-action="close" title="关闭"><svg class="debugger-icon" viewBox="0 0 24 24"><path fill="currentColor" d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg></button>
-        </div>
-      `;
-      const controls = header.querySelector(".debugger-controls");
-      controls.addEventListener("click", (e) => {
-        const target = e.target;
-        const action = target.dataset.action;
-        switch (action) {
-          case "clear":
-            this.clearRequests();
-            break;
-          case "export":
-            this.exportData();
-            break;
-          case "minimize":
-            this.toggleMinimize();
-            break;
-          case "fullscreen":
-            this.toggleFullscreen();
-            break;
-          case "close":
-            this.hide();
-            break;
-        }
-      });
-    }
-    this.saveConfig();
-  }
   toggleFullscreen() {
-    this.container.classList.toggle("fullscreen");
+    if (this.container.classList.contains("fullscreen")) {
+      this.container.classList.remove("fullscreen");
+      this.container.style.top = "";
+      this.container.style.left = "";
+      this.container.style.width = "";
+      this.container.style.height = "";
+      this.loadPosition();
+    } else {
+      this.container.classList.add("fullscreen");
+      this.container.style.top = "0";
+      this.container.style.left = "0";
+      this.container.style.width = "100vw";
+      this.container.style.height = "100vh";
+      this.container.style.right = "auto";
+      this.container.style.bottom = "auto";
+    }
   }
   handleToolAction(tool) {
     const textarea = this.container.querySelector(".tools-content textarea");
@@ -8725,6 +8704,61 @@ Created by Leo (@leeguoo)`);
     this.isResizing = false;
     delete this.container.dataset.resizeDirection;
   }
+  handleWindowResize() {
+    if (this.resizeTimeout) {
+      clearTimeout(this.resizeTimeout);
+    }
+    this.resizeTimeout = window.setTimeout(() => {
+      this.adjustPositionForWindowResize();
+    }, 100);
+  }
+  adjustPositionForWindowResize() {
+    const rect = this.container.getBoundingClientRect();
+    const windowWidth = window.innerWidth;
+    const windowHeight = window.innerHeight;
+    let needsAdjustment = false;
+    let newLeft = rect.left;
+    let newTop = rect.top;
+    let newWidth = rect.width;
+    let newHeight = rect.height;
+    if (rect.right > windowWidth) {
+      newLeft = windowWidth - rect.width;
+      needsAdjustment = true;
+    }
+    if (rect.bottom > windowHeight) {
+      newTop = windowHeight - rect.height;
+      needsAdjustment = true;
+    }
+    if (newLeft < 0) {
+      newLeft = 0;
+      needsAdjustment = true;
+    }
+    if (newTop < 0) {
+      newTop = 0;
+      needsAdjustment = true;
+    }
+    if (rect.width > windowWidth) {
+      newWidth = windowWidth - 20;
+      newLeft = 10;
+      needsAdjustment = true;
+    }
+    if (rect.height > windowHeight) {
+      newHeight = windowHeight - 20;
+      newTop = 10;
+      needsAdjustment = true;
+    }
+    if (needsAdjustment) {
+      this.container.style.left = `${newLeft}px`;
+      this.container.style.top = `${newTop}px`;
+      this.container.style.right = "auto";
+      this.container.style.bottom = "auto";
+      if (rect.width > windowWidth || rect.height > windowHeight) {
+        this.container.style.width = `${newWidth}px`;
+        this.container.style.height = `${newHeight}px`;
+      }
+      this.savePosition();
+    }
+  }
   show() {
     this.container.style.display = "block";
     this.removeReopenButton();
@@ -8738,7 +8772,7 @@ Created by Leo (@leeguoo)`);
     const btn = document.createElement("button");
     btn.id = "network-debugger-reopen-btn";
     btn.className = "debugger-reopen-btn";
-    btn.title = "打开调试面板";
+    btn.title = "打开调试面板 (可拖动)";
     btn.textContent = "PWTK";
     const pos = this.config.position || "bottom-right";
     if (pos.includes("bottom")) {
@@ -8751,7 +8785,55 @@ Created by Leo (@leeguoo)`);
     } else {
       btn.style.left = "20px";
     }
-    btn.addEventListener("click", () => this.show());
+    let isDragging = false;
+    let dragStart = { x: 0, y: 0 };
+    let clickTimer = null;
+    btn.addEventListener("mousedown", (e) => {
+      if (e.button === 0) {
+        isDragging = false;
+        dragStart = { x: e.clientX, y: e.clientY };
+        btn.style.transition = "none";
+        clickTimer = window.setTimeout(() => {
+          isDragging = true;
+          btn.style.cursor = "grabbing";
+        }, 150);
+        e.preventDefault();
+      }
+    });
+    const handleMouseMove = (e) => {
+      if (!isDragging) return;
+      const deltaX = e.clientX - dragStart.x;
+      const deltaY = e.clientY - dragStart.y;
+      const rect = btn.getBoundingClientRect();
+      const newLeft = rect.left + deltaX;
+      const newTop = rect.top + deltaY;
+      const maxX = window.innerWidth - rect.width;
+      const maxY = window.innerHeight - rect.height;
+      const clampedX = Math.max(0, Math.min(maxX, newLeft));
+      const clampedY = Math.max(0, Math.min(maxY, newTop));
+      btn.style.position = "fixed";
+      btn.style.left = `${clampedX}px`;
+      btn.style.top = `${clampedY}px`;
+      btn.style.right = "auto";
+      btn.style.bottom = "auto";
+      dragStart = { x: e.clientX, y: e.clientY };
+    };
+    const handleMouseUp = () => {
+      if (clickTimer) {
+        clearTimeout(clickTimer);
+        clickTimer = null;
+      }
+      if (isDragging) {
+        isDragging = false;
+        btn.style.cursor = "pointer";
+        btn.style.transition = "all 0.3s ease";
+      } else {
+        this.show();
+      }
+    };
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("mouseup", handleMouseUp);
+    btn.style.cursor = "pointer";
     document.body.appendChild(btn);
   }
   removeReopenButton() {
@@ -8915,7 +8997,7 @@ class NetworkDebugger {
       this.initialized = true;
       logger.consoleDirect(`
 ╔════════════════════════════════════════╗
-║  🔓 PWTK 解密小工具 v1.2.20           ║
+║  🔓 PWTK 解密小工具 v1.2.29           ║
 ║  Created by Leo (@leeguoo)             ║
 ║  技术支持: 请联系 Leo                 ║  
 ║  分享服务: curl.bwg.leeguoo.com       ║