From ec97586afcdbed19661e31a68439cf560344b355 Mon Sep 17 00:00:00 2001
From: Karlcarlo <karlcarlo@163.com>
Date: Sat, 3 Oct 2026 16:41:57 +0000
Subject: [PATCH] =?UTF-8?q?demo/bump=20v3.1=EF=BC=9A=E5=8F=B3=E4=BE=A7?=
 =?UTF-8?q?=E5=8D=A1=E7=89=87=E5=8E=BB=E6=8E=89=E6=95=B0=E8=83=8E=E5=8A=A8?=
 =?UTF-8?q?=EF=BC=8C=E6=94=B9=E6=88=90=E3=80=8C=E8=BF=99=E5=91=A8=E5=AE=9D?=
 =?UTF-8?q?=E5=AE=9D=E5=AD=A6=E4=BC=9A=E4=BA=86=E3=80=8D+=20=E5=AE=9D?=
 =?UTF-8?q?=E5=AE=9D=E6=82=84=E6=82=84=E8=AF=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 demo/bump/index.html | 51 ++++++++++++++++++++++----------------------
 1 file changed, 25 insertions(+), 26 deletions(-)

diff --git a/demo/bump/index.html b/demo/bump/index.html
index d0f9399..f4d3b62 100644
--- a/demo/bump/index.html
+++ b/demo/bump/index.html
@@ -5,8 +5,8 @@
 <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
 <title>宝宝在肚子里动 · 创意预览</title>
 <!-- 2026-10-03 创意预览（不进正式首页）：「整块头图是妈妈的肚皮」v3。
-     头图纹理改为 JS 现场合成（canvas）：肚皮底 belly_bg.jpg + LOGO + 倒计时 + 周数 + 进度条 + 右侧「今日胎动」玻璃卡。
-     右侧原来是胎儿插画，现在放胎动卡：宝宝每动一下，次数 +1，下面一行写「刚刚 · 小拳头顶了一下」；
+     头图纹理改为 JS 现场合成（canvas）：肚皮底 belly_bg.jpg + LOGO + 倒计时 + 周数 + 进度条 + 右侧「这周的宝宝」玻璃卡。
+     右侧原来是胎儿插画，现在放「这周宝宝学会了 · 睁眼看光」+ 宝宝的一句悄悄话，顶出来/被摁回去时换话；
      卡片也画在纹理里，所以被顶到时会和字一起鼓起来变形。
      WebGL 把纹理当一层肉肉的肚皮：
        · 宝宝时不时用不同部位往外顶：小脚丫（尖一点的小帐篷，顶上隐约几个脚趾）、小拳头（小而圆）、
@@ -145,14 +145,14 @@ void main(){
   const uS = U('S'), uF = U('F'), uK = U('K'), uG = U('G'), uP = U('P'), uJ = U('J'), uT = U('Tm');
   gl.uniform2f(uS, W, H);
 
-  /* ---------- 纹理：canvas 现场合成，胎动卡的数字和文案会变 ---------- */
+  /* ---------- 纹理：canvas 现场合成，宝宝卡的悄悄话会变 ---------- */
   const tc = document.createElement('canvas'); tc.width = W * SC; tc.height = H * SC;
   const cx = tc.getContext('2d');
   const SRC = { bg: 'belly_bg.jpg', top: 'top.png', pill: '../_hero/pill.png', week: '../_hero/week.png', prog: '../_hero/prog.png' };
   const IMG = {}; let loaded = 0;
   const tex = gl.createTexture(); let ready = false;
   const FONT = '-apple-system,"PingFang SC","Noto Sans SC",sans-serif';
-  const card = { n: 12, line: '宝宝醒着，正在活动', ago: '' };
+  const card = { line: '我认得妈妈的声音' };
   function rr(x, y, w, h, r) { cx.beginPath(); cx.moveTo(x + r, y); cx.arcTo(x + w, y, x + w, y + h, r); cx.arcTo(x + w, y + h, x, y + h, r); cx.arcTo(x, y + h, x, y, r); cx.arcTo(x, y, x + w, y, r); cx.closePath(); }
   function compose() {
     cx.setTransform(SC, 0, 0, SC, 0, 0);
@@ -173,33 +173,32 @@ void main(){
     cx.shadowColor = 'transparent';
     cx.drawImage(IMG.week, 14, 86, 110.9, 70);
     cx.drawImage(IMG.prog, 14, 150, 192, 36);
-    // 「今日胎动」玻璃卡
-    const X = 232, Y = 62, CW = 128, CH = 118;
+    // 「这周宝宝学会了」玻璃卡：30周的发育小变化 + 宝宝的一句悄悄话（被顶/被摁时换话）
+    const X = 228, Y = 60, CW = 134, CH = 122;
     cx.save();
     cx.shadowColor = 'rgba(150,55,30,.16)'; cx.shadowBlur = 18; cx.shadowOffsetY = 8;
     rr(X, Y, CW, CH, 20); cx.fillStyle = 'rgba(255,255,255,.17)'; cx.fill();
     cx.restore();
-    const hl = cx.createLinearGradient(X, Y, X, Y + CH); hl.addColorStop(0, 'rgba(255,255,255,.22)'); hl.addColorStop(1, 'rgba(255,255,255,.04)');
+    const hl = cx.createLinearGradient(X, Y, X, Y + CH); hl.addColorStop(0, 'rgba(255,255,255,.24)'); hl.addColorStop(1, 'rgba(255,255,255,.05)');
     rr(X, Y, CW, CH, 20); cx.fillStyle = hl; cx.fill();
     cx.lineWidth = 1; cx.strokeStyle = 'rgba(255,255,255,.55)'; rr(X + .5, Y + .5, CW - 1, CH - 1, 19.5); cx.stroke();
     cx.shadowColor = 'rgba(120,30,10,.25)'; cx.shadowBlur = 4; cx.shadowOffsetY = 1;
-    cx.fillStyle = '#FFF3C4'; cx.beginPath(); cx.arc(X + 17, Y + 20, 3.2, 0, 7); cx.fill();
-    cx.fillStyle = 'rgba(255,255,255,.95)'; cx.font = '700 12px ' + FONT; cx.fillText('今日胎动', X + 26, Y + 20.5);
-    cx.font = '900 40px ' + FONT; cx.fillStyle = '#fff';
-    const ns = String(card.n); cx.fillText(ns, X + 14, Y + 55);
-    const nw = cx.measureText(ns).width;
-    cx.font = '700 13px ' + FONT; cx.fillText('次', X + 18 + nw, Y + 62);
+    cx.fillStyle = 'rgba(255,255,255,.9)'; cx.font = '600 11px ' + FONT; cx.fillText('这周宝宝学会了', X + 14, Y + 19);
+    cx.font = '900 25px ' + FONT; cx.fillStyle = '#fff'; cx.fillText('睁眼看光', X + 13, Y + 45);
+    cx.font = '600 10.5px ' + FONT; cx.fillStyle = 'rgba(255,255,255,.9)'; cx.fillText('晒太阳时，我能感觉到亮', X + 14, Y + 68);
     cx.shadowColor = 'transparent';
-    cx.fillStyle = 'rgba(255,255,255,.28)'; cx.fillRect(X + 14, Y + 82, CW - 28, 1);
+    cx.fillStyle = 'rgba(255,255,255,.28)'; cx.fillRect(X + 14, Y + 81, CW - 28, 1);
+    // 悄悄话：小气泡尾巴 + 一句话
+    cx.fillStyle = 'rgba(255,255,255,.92)'; cx.beginPath(); cx.arc(X + 18, Y + 101, 2.6, 0, 7); cx.fill();
     cx.shadowColor = 'rgba(120,30,10,.22)'; cx.shadowBlur = 3; cx.shadowOffsetY = 1;
-    cx.font = '600 11px ' + FONT; cx.fillStyle = 'rgba(255,255,255,.92)';
-    let ln = card.line; while (cx.measureText(ln).width > CW - 28 && ln.length > 2) ln = ln.slice(0, -1);
-    cx.fillText(ln, X + 14, Y + 99);
+    cx.font = '600 11px ' + FONT; cx.fillStyle = 'rgba(255,255,255,.95)';
+    let ln = card.line; while (cx.measureText(ln).width > CW - 40 && ln.length > 2) ln = ln.slice(0, -1);
+    cx.fillText(ln, X + 26, Y + 101.5);
     cx.shadowColor = 'transparent';
     gl.bindTexture(gl.TEXTURE_2D, tex);
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, tc);
   }
-  function setCard(n, line) { if (n != null) card.n = n; if (line) card.line = line; if (ready) compose(); }
+  function setCard(line) { card.line = line; if (ready) compose(); }
   Object.keys(SRC).forEach(k => {
     const im = new Image(); im.onload = () => {
       IMG[k] = im;
@@ -226,10 +225,10 @@ void main(){
   /* ---------- 宝宝的各个部位：形状不同，动法不同 ---------- */
   // rx/ry 椭圆半径，sharp 尖度，toe 脚趾显隐，amp 高度，dur 停留秒数，roll 是否慢慢拱着挪
   const PARTS = {
-    foot: { name: '小脚丫', verb: '蹬了一下', rx: 64, ry: 72, sharp: 1.7, toe: 1, amp: 9.5, dur: [2.4, 3.4] },
-    fist: { name: '小拳头', verb: '顶了一下', rx: 46, ry: 46, sharp: 1.9, toe: 0, amp: 8, dur: [1.8, 2.6] },
-    knee: { name: '小膝盖', verb: '拱了一下', rx: 50, ry: 86, sharp: 1.6, toe: 0, amp: 8.5, dur: [2.2, 3] },
-    butt: { name: '小屁股', verb: '拱起来了', rx: 100, ry: 84, sharp: 1.25, toe: 0, amp: 7, dur: [3, 3.8], roll: true },
+    foot: { name: '小脚丫', say: ['妈妈，我在伸腿', '踢一脚打个招呼'], caught: '脚丫被你抓到啦', rx: 64, ry: 72, sharp: 1.7, toe: 1, amp: 9.5, dur: [2.4, 3.4] },
+    fist: { name: '小拳头', say: ['我在挥小拳头', '妈妈看我力气大'], caught: '小拳头被你握住啦', rx: 46, ry: 46, sharp: 1.9, toe: 0, amp: 8, dur: [1.8, 2.6] },
+    knee: { name: '小膝盖', say: ['我在翻个身', '这里有点挤哦'], caught: '膝盖被摁回去啦', rx: 50, ry: 86, sharp: 1.6, toe: 0, amp: 8.5, dur: [2.2, 3] },
+    butt: { name: '小屁股', say: ['我在伸懒腰～', '换个姿势睡觉'], caught: '屁股被你拍到了', rx: 100, ry: 84, sharp: 1.25, toe: 0, amp: 7, dur: [3, 3.8], roll: true },
   };
   const ORDER = ['foot', 'fist', 'butt', 'knee'];
   const found = {};
@@ -242,8 +241,8 @@ void main(){
   const jg = { x: { v: 0, vel: 0, to: 0, k: 210, c: 4.2 }, y: { v: 0, vel: 0, to: 0, k: 210, c: 4.2 } };
   let mode = 'wait', wait = .5, t = 0, seq = 0;
 
-  // 一半以上的概率专挑字和卡片顶（大字「30」、倒计时胶囊、进度条、slogan、胎动卡），字会被撑起来变形
-  const TEXT_SPOTS = [[62, 120], [100, 74], [104, 124], [96, 166], [230, 26], [292, 112], [300, 84], [150, 168]];
+  // 一半以上的概率专挑字和卡片顶（大字「30」、倒计时胶囊、进度条、slogan、宝宝卡），字会被撑起来变形
+  const TEXT_SPOTS = [[62, 120], [100, 74], [104, 124], [96, 166], [230, 26], [292, 104], [300, 80], [150, 168]];
   function pickSpot() {
     for (let i = 0; i < 40; i++) {
       let x, y;
@@ -264,7 +263,7 @@ void main(){
     ft.h.to = P.amp; ft.h.k = P.roll ? 70 : 140; ft.h.c = P.roll ? 9 : 9; ft.h.vel += P.roll ? 30 : 120;
     ft.life = 0; ft.dur = P.dur[0] + Math.random() * (P.dur[1] - P.dur[0]); ft.kicked = false;
     mode = 'show';
-    setCard(card.n + 1, '刚刚' + P.name + P.verb);
+    setCard(P.say[Math.floor(Math.random() * P.say.length)]);
   }
   function hide(fast) {
     ft.h.to = 0;
@@ -283,7 +282,7 @@ void main(){
         ft.flee = { dx: dx / l, dy: dy / l, t: 0 };
         hide(true); mode = 'flee'; wait = 1.1 + Math.random() * .8;
         if (navigator.vibrate) navigator.vibrate(15);
-        setCard(null, ft.part.name + '被摁回去啦');
+        setCard(ft.part.caught);
         found[ft.key] = true;
         const chip = hunt.querySelector('[data-k="' + ft.key + '"]'); if (chip) chip.classList.add('on');
         hunt.classList.add('pop'); setTimeout(() => hunt.classList.remove('pop'), 300);