dsh-live2dwaifu 2.1.0 → 2.2.0

package/README.md

@@ -231,6 +231,7 @@ python tools/export-dsh-meme.py
 | 自动播放动作 | 本机 | 开 | 模型带动作文件时，隔一会儿播一个 |
 | 说话带电子音 | 本机 | 开 | 每个字一声短音 |
 | 复述聊天内容 | 本机 | 开 | 聊天窗口出现新回复时，由她念出来 |
+| 表情包出现的位置 | 本机 | 文字左边 | 文字左边 / 文字上方 / 卡片左上角 / 说话不配图 |
 | 闲置主动说话的间隔 | 服务端 | 30 分钟 | 关闭 / 30 分钟 / 1 小时 / 2 小时 / 4 小时 |
 | 回复附带选项按钮 | 服务端 | 开 | 她觉得需要选择时，气泡上方出现可点按钮 |
 | 记住聊过的内容 | 服务端 | 开 | 关掉就不带记忆、不压缩 |
@@ -371,6 +372,12 @@ curl -X POST http://127.0.0.1:<端口>/dsh-live2d/api/push \
 
 版本号怎么走：动了功能和结构就抬第二位（1.2.0），只补洞和小修就抬第三位（1.2.1）。
 
+### 2.2.0
+
+- 加：表情包出在哪儿可以选。默认「文字左边」——图跟文字并排，图不再把文字往下顶。另有三档：「文字上方」（旧样子）、「卡片左上角」（单独浮一张，不挤气泡）、「说话不配图」。⚙ 第一栏就能改，改完正在显示的那张也会挪过去。
+- 修：气泡每 9 秒会被固定台词（「嗯。」「在的。」「今天还行。」）顶掉，她刚说的话、配的图都会被盖没。现在 45 秒内有过新话、或者气泡还挂着，就不插嘴。
+- 修：答题式的固定台词也换成只在她确实安静的时候才冒一句。
+
 ### 2.1.0
 
 「随机主动消息」这一块基本重做了。之前那版有两个毛病，都是真的。

package/assets/viewer.html

@@ -20,7 +20,18 @@
     opacity: 0; transition: opacity .35s ease; cursor: grab; user-select: none;
     max-height: 42%; overflow: hidden; touch-action: none; }
   #bubble:active { cursor: grabbing; }
-  .bub-img { display: block; max-width: 70%; max-height: 88px; border-radius: 10px; margin-bottom: 7px; object-fit: contain; }
+  /* 图跟文字并排：图在左，文字右，文字不被顶下去 */
+  #bubble.img-side { display: flex; align-items: flex-start; gap: 9px; }
+  #bubble.img-above { display: flex; flex-direction: column; gap: 7px; }
+  .bub-txt { flex: 1 1 auto; min-width: 0; }
+  .bub-img { display: block; border-radius: 10px; object-fit: contain; flex: none; }
+  #bubble.img-side .bub-img { max-width: 45%; max-height: 96px; }
+  #bubble.img-above .bub-img { max-width: 70%; max-height: 88px; }
+  /* 单独浮一张，不占气泡 */
+  #sticker { position: absolute; left: 10px; top: 10px; max-width: 38%; max-height: 32%;
+    opacity: 0; transition: opacity .35s ease; pointer-events: none; }
+  #sticker .stk-img { display: block; max-width: 100%; max-height: 100%; border-radius: 12px;
+    box-shadow: 0 8px 22px rgba(0,0,0,.45); object-fit: contain; }
   #hint { position: absolute; inset: 0; display: none; align-items: center; justify-content: center;
     text-align: center; padding: 24px; color: #98a0ad; }
   #hint.show { display: flex; }
@@ -70,6 +81,7 @@
 </head>
 <body>
 <canvas id="stage"></canvas>
+<div id="sticker"></div>
 <div id="bottom">
   <div id="choices"></div>
   <div id="bubble"></div>

package/assets/viewer.js

@@ -44316,6 +44316,7 @@ void main(void)\r
   var gazeY = 0;
   var pokeAt = 0;
   var sayFade = 0;
+  var lastSayAt = 0;
   var motionGroups = [];
   var nextMotionAt = 0;
   var POKE_HEAD = ["\u5514\u3002", "\u522B\u6478\u3002", "\u5934\u53D1\u4E71\u4E86\u3002", "\u55EF\u2026\u2026", "\u4F60\u624B\u51C9\u3002"];
@@ -44383,6 +44384,40 @@ void main(void)\r
       row.appendChild(document.createTextNode(label));
       box.appendChild(row);
     }
+    const hp = document.createElement("h3");
+    hp.textContent = "\u8868\u60C5\u5305\u51FA\u73B0\u7684\u4F4D\u7F6E";
+    box.appendChild(hp);
+    const posWrap = document.createElement("div");
+    posWrap.className = "opt-col";
+    const posSlider = document.createElement("input");
+    posSlider.type = "range";
+    posSlider.min = "0";
+    posSlider.max = String(IMG_POS.length - 1);
+    posSlider.step = "1";
+    const curPos = Math.max(0, IMG_POS.indexOf(imgPos()));
+    posSlider.value = String(curPos);
+    const posLab = document.createElement("div");
+    posLab.className = "opt-lab";
+    posLab.textContent = IMG_POS_LABELS[curPos];
+    posSlider.oninput = () => {
+      posLab.textContent = IMG_POS_LABELS[Number(posSlider.value)];
+    };
+    posSlider.onchange = () => {
+      setImgPos(IMG_POS[Number(posSlider.value)]);
+      const bubble = $2("bubble");
+      const shown = bubble ? bubble.querySelector(".bub-img") : null;
+      const pushed = $2("sticker") ? $2("sticker").querySelector(".stk-img") : null;
+      const src = shown && shown.src || pushed && pushed.src || "";
+      if (shown && shown.parentNode) shown.parentNode.removeChild(shown);
+      if (src && bubble) placeImage(bubble, src);
+    };
+    const posNote = document.createElement("div");
+    posNote.className = "opt-note";
+    posNote.textContent = "\u8BF4\u8BDD\u65F6\u914D\u56FE\u51FA\u5728\u54EA\u513F\u3002\u8D34\u5728\u6587\u5B57\u5DE6\u8FB9\u6216\u4E0A\u65B9\u90FD\u8DDF\u6C14\u6CE1\u4E00\u8D77\u8D70\uFF1B\u5361\u7247\u5DE6\u4E0A\u89D2\u662F\u5355\u72EC\u6D6E\u4E00\u5F20\uFF0C\u4E0D\u6324\u6C14\u6CE1\u3002";
+    posWrap.appendChild(posSlider);
+    posWrap.appendChild(posLab);
+    posWrap.appendChild(posNote);
+    box.appendChild(posWrap);
     const h2 = document.createElement("h3");
     h2.textContent = "\u5BF9\u8BDD\u4E0E\u884C\u4E3A\uFF08\u5B58\u670D\u52A1\u7AEF\uFF09";
     box.appendChild(h2);
@@ -44704,6 +44739,47 @@ void main(void)\r
     await refresh(true);
     $2("drawer").classList.remove("show");
   }
+  var IMG_POS = ["side", "above", "corner", "off"];
+  var IMG_POS_LABELS = ["\u6587\u5B57\u5DE6\u8FB9", "\u6587\u5B57\u4E0A\u65B9", "\u5361\u7247\u5DE6\u4E0A\u89D2", "\u8BF4\u8BDD\u4E0D\u914D\u56FE"];
+  function imgPos() {
+    let v2 = "";
+    try {
+      v2 = localStorage.getItem("dsh-l2d-imgpos") || "";
+    } catch {
+      v2 = "";
+    }
+    return IMG_POS.indexOf(v2) >= 0 ? v2 : "side";
+  }
+  function setImgPos(v2) {
+    try {
+      localStorage.setItem("dsh-l2d-imgpos", v2);
+    } catch {
+    }
+  }
+  function hideSticker() {
+    const st = $2("sticker");
+    if (st) st.style.opacity = "0";
+  }
+  function placeImage(bubble, image) {
+    const pos = imgPos();
+    hideSticker();
+    bubble.classList.toggle("img-above", pos === "above");
+    bubble.classList.toggle("img-side", pos === "side");
+    if (!image || pos === "off") return;
+    const img = document.createElement("img");
+    img.src = String(image);
+    if (pos === "corner") {
+      const st = $2("sticker");
+      if (!st) return;
+      img.className = "stk-img";
+      st.innerHTML = "";
+      st.appendChild(img);
+      st.style.opacity = "1";
+      return;
+    }
+    img.className = "bub-img";
+    bubble.insertBefore(img, bubble.firstChild);
+  }
   function say(text, m2, image) {
     if (m2) applyMood(m2);
     const bubble = $2("bubble");
@@ -44711,14 +44787,11 @@ void main(void)\r
     if (s2.length > 180) s2 = s2.slice(0, 178) + "\u2026";
     bubble.textContent = "";
     bubble.style.opacity = "1";
+    lastSayAt = Date.now();
     clearTimeout(sayFade);
-    if (image) {
-      const img = document.createElement("img");
-      img.className = "bub-img";
-      img.src = String(image);
-      bubble.appendChild(img);
-    }
+    placeImage(bubble, image);
     const holder = document.createElement("div");
+    holder.className = "bub-txt";
     bubble.appendChild(holder);
     const chars = Array.from(s2);
     let i2 = 0;
@@ -44729,6 +44802,7 @@ void main(void)\r
         if (chars.length) blip(tone.base * 0.82, tone.dur * 1.6, tone.type);
         sayFade = setTimeout(() => {
           bubble.style.opacity = "0";
+          hideSticker();
         }, Math.min(14e3, 4e3 + chars.length * 110));
         return;
       }
@@ -44743,6 +44817,9 @@ void main(void)\r
   }
   var idleIdx = 0;
   function idleTick() {
+    const bubble = $2("bubble");
+    if (Date.now() - lastSayAt < 45e3) return;
+    if (bubble && bubble.style.opacity !== "0" && bubble.textContent.trim()) return;
     const line = IDLE_LINES[idleIdx++ % IDLE_LINES.length];
     if (line) say(line, mood);
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-live2dwaifu",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "给 DSH 网页右下角请一个 Live2D 角色：会眨眼、会呼吸、视线跟着鼠标、点她有反应、说话时嘴动、心情变了眉毛跟着动。模型不用内置——谁装谁放自己的文件夹；支持自定义 .exp3.json 表情和 .motion3.json 动作，卡片能拖能缩，背景可换。",
   "type": "module",
   "main": "lib/index.js",