@aiyiran/myclaw 1.0.249 → 1.0.251

package/assets/myclaw-artifacts.js

@@ -426,10 +426,18 @@
     });
   }
 
-  // ═══ 预览弹框（iframe） ═══
+  // ═══ 预览弹框 ═══
+  var IMAGE_TYPES = ['png', 'jpg', 'jpeg', 'gif', 'svg', 'webp', 'bmp', 'avif', 'ico'];
+
+  function isImageAsset(asset) {
+    return asset.type && IMAGE_TYPES.indexOf(asset.type.toLowerCase()) !== -1;
+  }
+
   function openPreviewModal(data, asset) {
     if (document.querySelector('#myclaw-artifacts-preview')) return;
 
+    var previewUrl = buildPreviewUrl(data, asset.path);
+
     var overlay = document.createElement('div');
     overlay.id = 'myclaw-artifacts-preview';
     overlay.style.cssText = [
@@ -438,85 +446,124 @@
       'left: 0',
       'width: 100vw',
       'height: 100vh',
-      'background: rgba(0, 0, 0, 0.4)',
+      'background: rgba(0, 0, 0, 0.7)',
       'z-index: 99999',
       'display: flex',
       'align-items: center',
       'justify-content: center',
       'animation: myclaw-fade-in 0.15s ease',
     ].join(';');
+    overlay.onclick = function (e) { if (e.target === overlay) closePreviewModal(); };
 
-    var box = document.createElement('div');
-    box.style.cssText = [
-      'width: 98vw',
-      'height: 96vh',
-      'background: #1e1e2e',
-      'border-radius: 8px',
-      'overflow: hidden',
-      'display: flex',
-      'flex-direction: column',
-      'box-shadow: 0 8px 32px rgba(0,0,0,0.5)',
-    ].join(';');
+    // 标题栏（共用）
+    function makeHeader(label) {
+      var header = document.createElement('div');
+      header.style.cssText = [
+        'display: flex',
+        'align-items: center',
+        'justify-content: space-between',
+        'padding: 8px 14px',
+        'background: #2d2d3f',
+        'color: #cdd6f4',
+        'font-size: 13px',
+        'font-family: monospace',
+        'user-select: none',
+        'flex-shrink: 0',
+        'border-radius: 8px 8px 0 0',
+      ].join(';');
+      header.innerHTML = '<span>' + label + '</span>';
+
+      var right = document.createElement('span');
+      right.style.cssText = 'display:flex;align-items:center;gap:10px;';
+
+      var openBtn = document.createElement('span');
+      openBtn.textContent = '\u5728\u65B0\u9875\u9762\u6253\u5F00';
+      openBtn.style.cssText = 'cursor:pointer;padding:4px 10px;border-radius:4px;font-size:12px;background:rgba(255,255,255,0.08);transition:background 0.15s;';
+      openBtn.onmouseenter = function () { openBtn.style.background = 'rgba(255,255,255,0.18)'; };
+      openBtn.onmouseleave = function () { openBtn.style.background = 'rgba(255,255,255,0.08)'; };
+      openBtn.onclick = function () {
+        window.open(previewUrl, '_blank');
+        navigator.clipboard.writeText(previewUrl).then(function () {
+          openBtn.textContent = '\u2713 \u5DF2\u590D\u5236';
+          setTimeout(function () { openBtn.textContent = '\u5728\u65B0\u9875\u9762\u6253\u5F00'; }, 1500);
+        });
+      };
+      right.appendChild(openBtn);
+
+      var closeBtn = document.createElement('span');
+      closeBtn.textContent = '\u2715';
+      closeBtn.style.cssText = 'cursor:pointer;padding:4px 10px;border-radius:4px;font-size:18px;font-weight:bold;transition:background 0.15s;';
+      closeBtn.onmouseenter = function () { closeBtn.style.background = 'rgba(255,255,255,0.15)'; };
+      closeBtn.onmouseleave = function () { closeBtn.style.background = 'none'; };
+      closeBtn.onclick = function () { closePreviewModal(); };
+      right.appendChild(closeBtn);
+      header.appendChild(right);
+      return header;
+    }
 
-    // 标题栏
-    var header = document.createElement('div');
-    header.style.cssText = [
-      'display: flex',
-      'align-items: center',
-      'justify-content: space-between',
-      'padding: 8px 14px',
-      'background: #2d2d3f',
-      'color: #cdd6f4',
-      'font-size: 13px',
-      'font-family: monospace',
-      'user-select: none',
-      'flex-shrink: 0',
-    ].join(';');
-    header.innerHTML = '<span>\uD83C\uDFA8 ' + (asset.name || '预览') + '</span>';
+    if (isImageAsset(asset)) {
+      // ── 图片模式：img 弹框，自适应尺寸 ──
+      var imgBox = document.createElement('div');
+      imgBox.style.cssText = [
+        'display: flex',
+        'flex-direction: column',
+        'background: #1e1e2e',
+        'border-radius: 8px',
+        'box-shadow: 0 8px 32px rgba(0,0,0,0.6)',
+        'max-width: 92vw',
+        'max-height: 92vh',
+        'overflow: hidden',
+      ].join(';');
 
-    var headerRight = document.createElement('span');
-    headerRight.style.cssText = 'display:flex;align-items:center;gap:10px;';
+      imgBox.appendChild(makeHeader('\uD83D\uDDBC\uFE0F ' + (asset.name || asset.path)));
+
+      var img = document.createElement('img');
+      img.src = previewUrl;
+      img.alt = asset.name || asset.path;
+      img.style.cssText = [
+        'display: block',
+        'max-width: 92vw',
+        'max-height: calc(92vh - 44px)',
+        'width: auto',
+        'height: auto',
+        'object-fit: contain',
+      ].join(';');
 
-    var openBtn = document.createElement('span');
-    openBtn.textContent = '\u5728\u65B0\u9875\u9762\u6253\u5F00';
-    openBtn.style.cssText = 'cursor:pointer;padding:4px 10px;border-radius:4px;font-size:12px;background:rgba(255,255,255,0.08);transition:background 0.15s;';
-    openBtn.onmouseenter = function () { openBtn.style.background = 'rgba(255,255,255,0.18)'; };
-    openBtn.onmouseleave = function () { openBtn.style.background = 'rgba(255,255,255,0.08)'; };
-    var previewUrl = buildPreviewUrl(data, asset.path);
-    openBtn.onclick = function () {
-      window.open(previewUrl, '_blank');
-      navigator.clipboard.writeText(previewUrl).then(function () {
-        openBtn.textContent = '\u2713 \u5DF2\u590D\u5236';
-        setTimeout(function () { openBtn.textContent = '\u5728\u65B0\u9875\u9762\u6253\u5F00'; }, 1500);
-      });
-    };
-    headerRight.appendChild(openBtn);
+      imgBox.appendChild(img);
+      overlay.appendChild(imgBox);
+    } else {
+      // ── 非图片：iframe 全屏模式 ──
+      var box = document.createElement('div');
+      box.style.cssText = [
+        'width: 98vw',
+        'height: 96vh',
+        'background: #1e1e2e',
+        'border-radius: 8px',
+        'overflow: hidden',
+        'display: flex',
+        'flex-direction: column',
+        'box-shadow: 0 8px 32px rgba(0,0,0,0.5)',
+      ].join(';');
 
-    var closeBtn = document.createElement('span');
-    closeBtn.textContent = '\u2715';
-    closeBtn.style.cssText = 'cursor:pointer;padding:4px 10px;border-radius:4px;font-size:18px;font-weight:bold;transition:background 0.15s;';
-    closeBtn.onmouseenter = function () { closeBtn.style.background = 'rgba(255,255,255,0.15)'; };
-    closeBtn.onmouseleave = function () { closeBtn.style.background = 'none'; };
-    closeBtn.onclick = function () { closePreviewModal(); };
-    headerRight.appendChild(closeBtn);
-    header.appendChild(headerRight);
+      box.appendChild(makeHeader('\uD83C\uDFA8 ' + (asset.name || '预览')));
 
-    // iframe
-    var iframe = document.createElement('iframe');
-    iframe.src = buildPreviewUrl(data, asset.path) + '?t=' + Date.now();
-    iframe.style.cssText = [
-      'flex: 1',
-      'width: 100%',
-      'border: none',
-      'background: #fff',
-    ].join(';');
+      var iframe = document.createElement('iframe');
+      iframe.src = previewUrl + '?t=' + Date.now();
+      iframe.style.cssText = [
+        'flex: 1',
+        'width: 100%',
+        'border: none',
+        'background: #fff',
+      ].join(';');
 
-    box.appendChild(header);
-    box.appendChild(iframe);
-    overlay.appendChild(box);
+      box.appendChild(iframe);
+      overlay.appendChild(box);
+      document.body.appendChild(overlay);
+      iframe.focus();
+      return;
+    }
 
     document.body.appendChild(overlay);
-    iframe.focus();
   }
 
   function closePreviewModal() {

package/assets/myclaw-inject.js

@@ -538,10 +538,27 @@ btn.addEventListener("click", function () {
       "  animation: myclaw-ring 1.5s ease-out infinite;",
       "  pointer-events: none;",
       "}",
-      /* 按钮处理中态：灰色半透明，禁止点击 */
+      /* 按钮处理中态：半透明 + 2秒红圈收缩动画 */
       ".myclaw-voice-stopping {",
-      "  opacity: 0.4 !important;",
-      "  cursor: not-allowed !important;",
+      "  opacity: 0.5 !important;",
+      "  position: relative;",
+      "}",
+      ".myclaw-voice-stopping::after {",
+      "  content: '';",
+      "  position: absolute;",
+      "  top: 50%;",
+      "  left: 50%;",
+      "  width: 100%;",
+      "  height: 100%;",
+      "  border-radius: 50%;",
+      "  border: 2px solid #ff4444;",
+      "  transform: translate(-50%, -50%) scale(1.5);",
+      "  animation: myclaw-countdown 2s linear forwards;",
+      "  pointer-events: none;",
+      "}",
+      "@keyframes myclaw-countdown {",
+      "  0%   { transform: translate(-50%, -50%) scale(1.5); opacity: 1; }",
+      "  100% { transform: translate(-50%, -50%) scale(0);   opacity: 0; }",
       "}",
       /* textarea 录音态：左侧红色竖线 + 微弱红色背景 */
       ".myclaw-voice-active {",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiyiran/myclaw",
-  "version": "1.0.249",
+  "version": "1.0.251",
   "description": "",
   "main": "index.js",
   "bin": {