悄悄话流星七改：去中线、细体字、首次一闪提示、内容卡流星划完再出且改小 (v26100171)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

js/app.js

@@ -3,7 +3,7 @@
 (function () {
   'use strict';
   /* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */
-  var VER = '26100170';
+  var VER = '26100171';
   const $ = (s, c) => (c || document).querySelector(s);
   const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
 
@@ -3387,7 +3387,7 @@
       }).join('');
     }
     function paintCard(it, i) {
-      card.innerHTML = '<p class="wsc-q">' + (it.mine ? '<em>我说的</em>' : '') + esc(it.text) + '</p>' +
+      card.innerHTML = '<span class="wsc-k">' + (it.mine ? '我说的' : '刚划过的那颗星说') + '</span><p class="wsc-q">' + esc(it.text) + '</p>' +
         '<div class="wsc-m"><span>孕 ' + it.week + ' 周的妈妈 · ' + esc(it.ago) + '</span>' + hugBtn(it) + '</div>' +
         '<button type="button" class="wsc-next" data-next="1">下一颗 <svg viewBox="0 0 24 24" width="13" height="13"><path d="M9 5l7 7-7 7" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"/></svg></button>';
       card.classList.remove('show');
@@ -3397,13 +3397,25 @@
       const au = $$('#whvAura i');
       au[0].style.backgroundColor = pal[0]; au[1].style.backgroundColor = pal[1];
     }
-    function stopMeteor() {
+    /* 七改（用户：「点一个流星底下就出现文字，好像就不用看流星上面写什么了」）：
+       内容卡改到流星划完才浮出来（小字回放 + 抱抱），先看流星、再看卡；中途换星就不出旧卡。 */
+    function stopMeteor(done) {
       if (!mt) return;
       cancelAnimationFrame(mt.raf);
       mt.el.remove();
       mt.btn.classList.remove('flare', 'gone');
       mt.btn.classList.add('seen');
+      const m = mt;
       mt = null;
+      if (done) paintCard(m.it, m.i);
+    }
+    /* 第一次进来：一闪一闪的提示，点过一次星星就永久收起 */
+    const TIP = 'mmbox.whtip.v1';
+    const tipEl = $('#wskTip');
+    function tip(on) {
+      if (on) { try { on = !localStorage.getItem(TIP); } catch (e) {} }
+      else { try { localStorage.setItem(TIP, '1'); } catch (e) {} }
+      tipEl.classList.toggle('show', !!on);
     }
     function launch(i) {
       const it = list()[i - 1];
@@ -3412,12 +3424,13 @@
       cur = i;
       seen.add(it.id);
       $$('.wsk-st.hint', page).forEach(x => x.classList.remove('hint'));
+      tip(false);
+      card.classList.remove('show');
       $$('.wsk-st.cur', page).forEach(x => x.classList.remove('cur'));
-      paintCard(it, i);
       const btn = $('.wsk-st[data-go="' + i + '"]', page);
-      if (!btn) return;
+      if (!btn) { paintCard(it, i); return; }
       btn.classList.add('cur');
-      if (RM) { btn.classList.add('seen'); return; }
+      if (RM) { btn.classList.add('seen'); paintCard(it, i); return; }
       const pr = page.getBoundingClientRect(), br = btn.getBoundingClientRect();
       const x0 = br.left + br.width / 2 - pr.left, y0 = br.top + br.height / 2 - pr.top;
       /* 瞄准左下（屏幕左边外、六成高处）：越靠左起步角度越陡，保证在屏幕里拖得够长 */
@@ -3434,9 +3447,9 @@
       const body = off.length ? off[n - 1] + fs[n - 1] * .6 : gap;
       const el = document.createElement('div');
       el.className = 'wmt' + (it.mine ? ' mine' : '');
-      el.innerHTML = '<i class="wmt-l"></i><i class="wmt-c"></i><i class="wmt-h"></i>' + chars.map((c, k) => '<span style="font-size:' + fs[k].toFixed(1) + 'px">' + esc(c) + '</span>').join('');
+      el.innerHTML = '<i class="wmt-l"></i><i class="wmt-h"></i>' + chars.map((c, k) => '<span style="font-size:' + fs[k].toFixed(1) + 'px">' + esc(c) + '</span>').join('');
       page.insertBefore(el, card);
-      const line = el.children[0], core = el.children[1], head = el.children[2], sp = $$('span', el);
+      const line = el.children[0], head = el.children[1], sp = $$('span', el);
       line.style.height = (f1 * 1.9).toFixed(0) + 'px';
       line.style.marginTop = (-f1 * .95).toFixed(0) + 'px';
       /* 节奏：星闪 420ms → 以约 90px/s 起步并缓缓提速，整句拖出来后再留 0.7 秒给眼睛 → 加速度猛增，1.3 秒内唰出屏幕 */
@@ -3454,8 +3467,8 @@
         const st = Math.min(1.6, Math.max(0, (v - .25) / .5));
         head.style.transform = at + ' scaleX(' + (1 + st * 1.6).toFixed(2) + ')';
         const tl = Math.min(s, body + 70 + 260 * st);
-        line.style.width = core.style.width = tl.toFixed(0) + 'px';
-        line.style.transform = core.style.transform = at;
+        line.style.width = tl.toFixed(0) + 'px';
+        line.style.transform = at;
         const fade = u < .6 ? 1 : Math.max(0, 1 - (u - .6) / .4);
         el.style.setProperty('--bl', (st * 1.6).toFixed(1) + 'px');
         sp.forEach((c, k) => {
@@ -3464,10 +3477,10 @@
           c.style.opacity = (Math.min(1, d / 26) * fade).toFixed(2);
           c.style.transform = 'translate(' + (x0 + dx * d).toFixed(1) + 'px,' + (y0 + dy * d).toFixed(1) + 'px) translate(-50%,-50%) rotate(' + rot.toFixed(1) + 'deg)';
         });
-        if (u >= 1) { stopMeteor(); return; }
+        if (u >= 1) { stopMeteor(true); return; }
         mt.raf = requestAnimationFrame(frame);
       };
-      mt = { el, btn, raf: requestAnimationFrame(frame) };
+      mt = { el, btn, it, i, raf: requestAnimationFrame(frame) };
     }
     function nextStar() {
       const l = list(), n = l.length;
@@ -3507,6 +3520,7 @@
       cur = 0;
       card.classList.remove('show');
       paintPage();
+      tip(true);
       page.classList.add('show');
       page.setAttribute('aria-hidden', 'false');
       drawer(false);