npm - claude-opencode-viewer - Versions diffs - 2.4.2 → 2.5.0 - Mend

claude-opencode-viewer 2.4.2 → 2.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2) hide show

package/index.html +228 -2
package/package.json +1 -1

package/index.html CHANGED Viewed

@@ -487,6 +487,93 @@
       border-color: #555;
       color: #fff;
     }
+    /* 选择模式：原位文本层 */
+    #terminal.select-mode .xterm-screen {
+      visibility: hidden;
+    }
+    #select-text-layer {
+      display: none;
+      position: absolute;
+      top: 0; left: 0; right: 0; bottom: 0;
+      overflow-y: auto;
+      -webkit-overflow-scrolling: touch;
+      background: #0a0a0a;
+      padding: 4px 8px;
+      touch-action: auto;
+      z-index: 10;
+    }
+    #select-text-layer.visible {
+      display: block;
+    }
+    #select-hint {
+      position: sticky;
+      top: 0;
+      background: rgba(30,30,30,0.95);
+      color: #888;
+      font-size: 11px;
+      text-align: center;
+      padding: 6px 0;
+      border-bottom: 1px solid #333;
+      z-index: 1;
+      -webkit-user-select: none;
+      user-select: none;
+    }
+    #select-text-layer pre {
+      margin: 0;
+      color: #d4d4d4;
+      font-family: Menlo, Monaco, "Courier New", monospace;
+      font-size: 11px;
+      line-height: 1.4;
+      white-space: pre-wrap;
+      word-break: break-all;
+      -webkit-user-select: text;
+      user-select: text;
+    }
+    #select-mode-close {
+      position: absolute;
+      top: 6px;
+      right: 6px;
+      z-index: 20;
+      display: none;
+      background: rgba(50,50,50,0.9);
+      border: 1px solid #555;
+      color: #ccc;
+      width: 28px;
+      height: 28px;
+      border-radius: 50%;
+      font-size: 14px;
+      line-height: 26px;
+      text-align: center;
+      cursor: pointer;
+      -webkit-user-select: none;
+      user-select: none;
+    }
+    /* 复制成功提示 */
+    #copy-toast {
+      display: none;
+      position: fixed;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      background: rgba(40, 167, 69, 0.9);
+      color: #fff;
+      padding: 10px 24px;
+      border-radius: 8px;
+      font-size: 14px;
+      z-index: 9999;
+      pointer-events: none;
+    }
+    #copy-toast.show {
+      display: block;
+    }
   </style>
 </head>
 <body>
@@ -510,7 +597,7 @@
         </button>
       </div>
       <div id="mode-switcher">
-        <span id="mode-label">Mode:</span>
+        <span id="mode-label"></span>
         <select id="mode-select">
           <option value="opencode">OpenCode</option>
           <option value="claude">Claude</option>
@@ -584,7 +671,13 @@
     <div id="content">
       <div id="terminal-container">
-        <div id="terminal"></div>
+        <div id="terminal">
+          <div id="select-text-layer">
+            <div id="select-hint">长按选择文本 · 点右上角 ✕ 返回终端</div>
+            <pre id="select-text-pre"></pre>
+          </div>
+          <button id="select-mode-close">✕</button>
+        </div>
         <div id="virtual-keybar">
           <div class="virtual-key" data-key="up">↑</div>
           <div class="virtual-key" data-key="down">↓</div>
@@ -596,11 +689,13 @@
           <div class="virtual-key" data-key="ctrlc">Ctrl+C</div>
           <div class="virtual-key scroll-key" data-scroll="-5">⇡ 滚动</div>
           <div class="virtual-key scroll-key" data-scroll="5">⇣ 滚动</div>
+          <div class="virtual-key" id="btn-copy">复制</div>
         </div>
       </div>
     </div>
   </div>
+  <div id="copy-toast">已复制</div>
   <script src="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/lib/xterm.min.js"></script>
   <script>
     (function() {
@@ -837,17 +932,40 @@
         }
       }
+      // 长按检测
+      var longPressTimer = null;
+      var longPressTriggered = false;
+      var LONG_PRESS_DELAY = 500; // ms
+      function clearLongPress() {
+        if (longPressTimer) {
+          clearTimeout(longPressTimer);
+          longPressTimer = null;
+        }
+      }
       function handleTouchStart(e) {
         console.log('[scroll] touchstart');
         stopMomentum();
+        longPressTriggered = false;
+        clearLongPress();
         if (e.touches.length !== 1) return;
         lastY = e.touches[0].clientY;
         lastTime = performance.now();
         velocitySamples = [];
+        // 启动长按计时器
+        longPressTimer = setTimeout(function() {
+          longPressTriggered = true;
+          longPressTimer = null;
+          openSelectMode();
+        }, LONG_PRESS_DELAY);
       }
       function handleTouchMove(e) {
         if (e.touches.length !== 1) return;
+        // 有移动则取消长按
+        clearLongPress();
         var y = e.touches[0].clientY;
         var now = performance.now();
         var dt = now - lastTime;
@@ -871,6 +989,16 @@
       function handleTouchEnd() {
         console.log('[scroll] touchend');
+        clearLongPress();
+        // 长按已触发，不执行滚动惯性
+        if (longPressTriggered) {
+          longPressTriggered = false;
+          pendingDy = 0;
+          pixelAccum = 0;
+          velocitySamples = [];
+          return;
+        }
         if (scrollRaf) {
           cancelAnimationFrame(scrollRaf);
@@ -1563,6 +1691,104 @@
         }
       });
+      // 提取终端缓冲区文本
+      function getTerminalText() {
+        var buf = term.buffer.active;
+        var lines = [];
+        for (var i = 0; i < buf.length; i++) {
+          var line = buf.getLine(i);
+          if (line) lines.push(line.translateToString(true));
+        }
+        // 去除尾部空行
+        while (lines.length > 0 && lines[lines.length - 1].trim() === '') {
+          lines.pop();
+        }
+        return lines.join('\n');
+      }
+      // 复制到剪贴板
+      function copyToClipboard(text) {
+        if (navigator.clipboard && navigator.clipboard.writeText) {
+          navigator.clipboard.writeText(text).then(showCopyToast).catch(function() {
+            fallbackCopy(text);
+          });
+        } else {
+          fallbackCopy(text);
+        }
+      }
+      function fallbackCopy(text) {
+        var ta = document.createElement('textarea');
+        ta.value = text;
+        ta.style.cssText = 'position:fixed;left:-9999px;top:-9999px';
+        document.body.appendChild(ta);
+        ta.select();
+        document.execCommand('copy');
+        document.body.removeChild(ta);
+        showCopyToast();
+      }
+      function showCopyToast() {
+        var toast = document.getElementById('copy-toast');
+        toast.classList.add('show');
+        setTimeout(function() { toast.classList.remove('show'); }, 1200);
+      }
+      // "复制" 按钮
+      document.getElementById('btn-copy').addEventListener('touchend', function(e) {
+        e.preventDefault();
+        var text = getTerminalText();
+        if (text) copyToClipboard(text);
+      });
+      document.getElementById('btn-copy').addEventListener('click', function(e) {
+        e.preventDefault();
+        var text = getTerminalText();
+        if (text) copyToClipboard(text);
+      });
+      // 方案2: 长按进入选择模式 — 原位显示可选纯文本
+      var selectTextLayer = document.getElementById('select-text-layer');
+      var selectTextPre = document.getElementById('select-text-pre');
+      var selectModeClose = document.getElementById('select-mode-close');
+      var inSelectMode = false;
+      function openSelectMode() {
+        if (inSelectMode) return;
+        inSelectMode = true;
+        // 收起键盘
+        var xtermTa = terminalEl.querySelector('.xterm-helper-textarea');
+        if (xtermTa) xtermTa.blur();
+        document.activeElement && document.activeElement.blur();
+        var text = getTerminalText();
+        selectTextPre.textContent = text || '(终端内容为空)';
+        terminalEl.classList.add('select-mode');
+        selectTextLayer.classList.add('visible');
+        selectModeClose.style.display = 'block';
+        unbindTouchScroll();
+      }
+      function closeSelectMode() {
+        if (!inSelectMode) return;
+        inSelectMode = false;
+        terminalEl.classList.remove('select-mode');
+        selectTextLayer.classList.remove('visible');
+        selectModeClose.style.display = 'none';
+        window.getSelection().removeAllRanges();
+        rebindTouchScroll();
+      }
+      selectModeClose.addEventListener('click', function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        closeSelectMode();
+      });
+      selectModeClose.addEventListener('touchend', function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        closeSelectMode();
+      });
       // 初始化虚拟按键事件
       setupVirtualKeyEvents();

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "claude-opencode-viewer",
-  "version": "2.4.2",
+  "version": "2.5.0",
   "description": "A unified terminal viewer for Claude Code and OpenCode with seamless switching",
   "type": "module",
   "main": "server.js",