dsh-wisp 1.36.0 → 1.42.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.
- package/README.md +372 -7
- package/cordis.patch.yml +14 -19
- package/lib/client.js +629 -20
- package/lib/client.template.js +629 -20
- package/lib/index.js +211 -29
- package/package.json +2 -1
- package/tools/engine-probe.mjs +421 -0
- package/tools/smoke.mjs +272 -0
- package/verify-wisp.mjs +4457 -3683
package/lib/client.template.js
CHANGED
|
@@ -51,7 +51,7 @@ window.__ModuleLoader__.load({
|
|
|
51
51
|
var exports = module.exports
|
|
52
52
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' })
|
|
53
53
|
|
|
54
|
-
const VERSION = '1.
|
|
54
|
+
const VERSION = '1.42.0'
|
|
55
55
|
|
|
56
56
|
/* 每一版一句话。**必须写当前版本** —— 预检里有一条断言盯着它,
|
|
57
57
|
忘了更新就会红,不会静默过期。 */
|
|
@@ -80,6 +80,12 @@ const WHATS_NEW = {
|
|
|
80
80
|
'1.34.1': '菜单改成紧凑刻度,占屏幕小了三成。',
|
|
81
81
|
'1.35.0': '她开始替你值班:你走开时看着,回来报账;还能说今日小结。',
|
|
82
82
|
'1.36.0': '她会说英文了(跟随界面语言/系统语言,也能强制);音效与"汇报"姿势已就位。',
|
|
83
|
+
'1.37.0': '菜单里能直接选台词语言(跟随界面 / 中文 / English),选一次就记住。',
|
|
84
|
+
'1.38.0': '她有身体了:按下去会压一下弹回来、拖着会侧身、落地会顿一下,指针靠近会朝你倾过来。',
|
|
85
|
+
'1.39.0': '她会看你的余额了(菜单里点一下),未登录或查不到时如实说。',
|
|
86
|
+
'1.40.0': '她的透明处真的点不到了:按轮廓命中,站在按钮上也不挡你点它。',
|
|
87
|
+
'1.41.0': '检查更新更耐得住:一个源连不上不再把另一个拖死,失败时 doctor() 会说清是哪个源、为什么。',
|
|
88
|
+
'1.42.0': '查更新失败时她会直接说清是哪一种:没通道 / 连不上 / 宿主没应答。',
|
|
83
89
|
}
|
|
84
90
|
|
|
85
91
|
/* 更新这件事**这个插件自己做不到**,如实写在代码里,免得以后有人以为能:
|
|
@@ -162,11 +168,63 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
162
168
|
const WAKE_THROTTLE_MS = 1000
|
|
163
169
|
const WORRIED_MS = 3500 // 出错表情持续多久
|
|
164
170
|
|
|
171
|
+
/* ---------------------------------------------------------------------
|
|
172
|
+
动作(motion)。
|
|
173
|
+
|
|
174
|
+
在这之前,"她的动作"只有两件事:换一张精灵图,以及一条常驻的呼吸
|
|
175
|
+
循环动画。按下、拖动、松手这些**手势**在画面上没有任何回应 —— 她像
|
|
176
|
+
一张贴在屏幕上的图,而不是一个被碰到会有反应的东西。
|
|
177
|
+
|
|
178
|
+
这里补的是"身体感",而且刻意只用 CSS 关键帧 + 一个样式变量:插件
|
|
179
|
+
的稳态开销承诺是**零动画帧**(见 README 性能表),加一条 rAF 循环
|
|
180
|
+
就等于把那条承诺撤掉。所有动作都是"事件写一次属性,浏览器自己算"。
|
|
181
|
+
|
|
182
|
+
三个层各管一件事。CSS 的 transform 在同一个元素上是**覆盖**而不是
|
|
183
|
+
叠加,所以"分层"不是设计洁癖,是唯一做法:
|
|
184
|
+
|
|
185
|
+
.wisp-body 情绪动画(呼吸 / 跳 / 推 / 担心)—— 既有,不动
|
|
186
|
+
.wisp-motion 一次性动作(按下压一下 / 落地顿一下 / 换表情弹一下)
|
|
187
|
+
由 data-accent 驱动,放外层 → 落地时的压扁是**屏幕坐标**
|
|
188
|
+
里的竖直方向(重力方向),不会跟着侧倾一起歪
|
|
189
|
+
.wisp-lean 持续姿势(拖动速度 / 指针靠近 / 溜达方向)
|
|
190
|
+
由 --wisp-tilt 驱动,旋转原点在脚底 → 像钟摆,不像转盘
|
|
191
|
+
|
|
192
|
+
data-accent 的取值里,pop-a / pop-b 是**同一件事的两个名字**:改
|
|
193
|
+
animation-name 是让同一条动画立刻重播的唯一可靠办法(同一个值再写
|
|
194
|
+
一次不会重播),而连戳两下必须看到两次弹。
|
|
195
|
+
--------------------------------------------------------------------- */
|
|
196
|
+
const MOTION_AMP = { full: 1, subtle: 0.5, off: 0 }
|
|
197
|
+
const TILT_DRAG_MAX = 8 // 拖动时最大侧倾(度)
|
|
198
|
+
const TILT_DRAG_PER_PX = 0.55 // 每一次指针事件横向走 1px 折算多少度(≈速度)
|
|
199
|
+
const TILT_NEAR_MAX = 3.5 // 指针靠近时最大侧倾(度)
|
|
200
|
+
const TILT_NEAR_PX = 170 // 多远算"她注意到你了"
|
|
201
|
+
const TILT_GLIDE_MAX = 2.5 // 溜达时朝行进方向前倾(度)
|
|
202
|
+
const TILT_GLIDE_PER_PX = 0.02 // 溜达距离折算成前倾角的斜率
|
|
203
|
+
/* 变化小于这个数就不写样式 —— pointermove 一秒能来上百次,而 0.05° 在
|
|
204
|
+
屏幕上是看不见的。写一次 = 一次样式重算,阈值就是它的闸门。 */
|
|
205
|
+
const TILT_STEP = 0.05
|
|
206
|
+
|
|
207
|
+
/* 动作时长必须是**代码**里的一份:CSS 只负责怎么动,什么时候收手由这里
|
|
208
|
+
决定(和 glide 的 1700ms 一个路子)。两边对不上就会出现"动画早放完了,
|
|
209
|
+
属性还挂着"或者反过来的空档。
|
|
210
|
+
没有 release:松手之后紧接着就是**点击反应**(换表情 → 弹一下),两者
|
|
211
|
+
抢同一个通道,而反应赢 —— "手指抬起来了"不值得盖过"她换了个表情"。
|
|
212
|
+
通道只留最后发生的那件事,不留一个永远演不到的关键帧。 */
|
|
213
|
+
const ACCENT_MS = { press: 200, land: 560, pop: 380 }
|
|
214
|
+
|
|
215
|
+
/* 换表情时"弹一下"的表情集合。idle / alert / sleep 不在里面:它们要么是
|
|
216
|
+
长时间稳态,要么由轮询反复重算,弹一下就变成抖。 */
|
|
217
|
+
const POPPY_MOODS = ['happy', 'poked', 'proud', 'attn', 'care', 'eat', 'worried', 'report']
|
|
218
|
+
|
|
165
219
|
const DEFAULTS = {
|
|
166
220
|
bottom: GROUND,
|
|
167
221
|
right: 26,
|
|
168
222
|
sleepAfterMs: 90000,
|
|
169
223
|
reactions: true,
|
|
224
|
+
/* 交互动效档位:full 灵动 / subtle 克制(半幅)/ off 静止。
|
|
225
|
+
默认全开 —— 但必须有一个**不用改系统设置**就能让她安静下来的开关,
|
|
226
|
+
prefers-reduced-motion 是给"所有动画"的,不是给"我不想让她动"的。 */
|
|
227
|
+
motion: 'full',
|
|
170
228
|
size: 4, // 560x840 CSS px, drawn from the 2048x3072 tier
|
|
171
229
|
persist: true, // remember where she was dragged to
|
|
172
230
|
celebrate: true, // cheer when a run finishes
|
|
@@ -183,6 +241,14 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
183
241
|
backAfterMs: 120000, // 离开超过这么久,回来时她会说一句(2 分钟;0 = 关)
|
|
184
242
|
milestones: true, // 今日轮次到达里程碑时得意一下
|
|
185
243
|
memory: true, // 她记着你:一起多少天 / 常放哪个角 / 常穿哪套
|
|
244
|
+
/* lang 与 soundVolume 曾经**只在 CONFIG_SPEC 里声明、DEFAULTS 里没有**:
|
|
245
|
+
前者靠 isZhNow() 把非字符串兜成 'auto' 侥幸没事,后者直接是 undefined →
|
|
246
|
+
`Number(undefined)` = NaN → `clip.volume = NaN` 在浏览器里抛,被
|
|
247
|
+
playSound 的 try/catch 吞掉 —— 于是"打开音效"整条路静默失效。
|
|
248
|
+
配置键的两个"端"(声明 / 默认值)现在由预检钉住。 */
|
|
249
|
+
lang: 'auto', // 'auto' 跟随界面语言;'zh' / 'en' 强制
|
|
250
|
+
sound: false, // 音效默认关(无故出声是最招人烦的交互之一),且要有素材
|
|
251
|
+
soundVolume: 0.7, // 音效音量(音效本身默认关,且要有 assets/audio 才存在)
|
|
186
252
|
happyMs: 1100,
|
|
187
253
|
wander: true, // stroll around on her own while idle
|
|
188
254
|
wanderMs: 45000, // how often she considers moving
|
|
@@ -341,6 +407,11 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
341
407
|
updateCurrent: ['已经是最新的了。', '我就是最新的。', '没有更新的。'],
|
|
342
408
|
updateAvailable: ['有新版本了:', '有新版:', '更新来了:'],
|
|
343
409
|
updateFailed: ['更新没查成。', '这次没查到更新。', '更新检查没成功。'],
|
|
410
|
+
/* 失败不是一个笼统的状态:「这个壳里没有联网的通道」「两个源都没连上」
|
|
411
|
+
「宿主那边没应答」是三件事,含糊地说成"没查到"就没人能追下去 ——
|
|
412
|
+
而用户看到的恰恰只有那一句。 */
|
|
413
|
+
updateNoChannel: ['这个壳里我没有联网的通道,查不了更新。', '这里没有能出去的网络通道。'],
|
|
414
|
+
updateNoHost: ['宿主那边没应答,更新没查成。', '问不到宿主,更新没查成。'],
|
|
344
415
|
milestone: [
|
|
345
416
|
'今天第 {n} 轮了。', '{n} 轮了,还不错。', '已经 {n} 轮了,你挺能撑。',
|
|
346
417
|
'第 {n} 轮 —— 我数着呢。', '{n} 轮,进度可观。', '今天 {n} 轮,记上了。',
|
|
@@ -352,6 +423,17 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
352
423
|
'去窗边看看。', '我在这儿等你回来。', '坐太久了,动一下。', '你不动,我就一直看着你。',
|
|
353
424
|
],
|
|
354
425
|
hint: ['右键我一下试试。', '右键我有菜单。', '拖我,或者右键我。'],
|
|
426
|
+
|
|
427
|
+
/* 余额。数字由客户端拼好({n}),台词只管口气 —— 她报的是账户,
|
|
428
|
+
不是她自己的钱,所以既不邀功也不夸张。 */
|
|
429
|
+
balanceChecking: ['看一下……', '等等,我查查。', '让我看看。'],
|
|
430
|
+
balance: ['余额 {n}。', '还有 {n}。', '{n},暂时够用。', '账上是 {n}。'],
|
|
431
|
+
balanceBonus: ['其中赠送 {n}。', '还有 {n} 是赠送的。'],
|
|
432
|
+
balanceEmpty: ['没查到余额记录。', '账上没有额度记录。'],
|
|
433
|
+
balanceSignedOut: ['没登录,看不到余额。', '这个得先登录才行。', '还没登录,余额在平台那边。'],
|
|
434
|
+
balanceUnavailable: ['刚才没读到,一会儿再看。', '这一下没读到,稍后再试。'],
|
|
435
|
+
balanceFailed: ['余额没查成。', '这个没读出来,稍后再试。'],
|
|
436
|
+
balanceUnsupported: ['这个壳里我查不了余额。', '这里没有查余额的通道。'],
|
|
355
437
|
}
|
|
356
438
|
|
|
357
439
|
/* 英文台词。**只翻译她说的话**(菜单按钮文案仍由 DSH 界面语言决定,不在这一层)。
|
|
@@ -386,6 +468,17 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
386
468
|
backSoon: ['Back already?', 'There you are.'],
|
|
387
469
|
backLong: ['You were gone a while.', 'Long break. Welcome back.'],
|
|
388
470
|
streak: ['{n} days in a row.', 'Day {n} together.'],
|
|
471
|
+
updateFailed: ["The update check didn't work.", "Couldn't reach the update sources."],
|
|
472
|
+
updateNoChannel: ["This shell gives me no network channel, so I can't check for updates.", 'No way out to the network from here.'],
|
|
473
|
+
updateNoHost: ["The host side didn't answer — the update check failed.", 'No answer from the host.'],
|
|
474
|
+
balanceChecking: ['One moment…', 'Let me check.'],
|
|
475
|
+
balance: ['Balance: {n}.', "You've got {n}.", '{n} on the account.'],
|
|
476
|
+
balanceBonus: [' {n} of that is credit.', ' ({n} is credit.)'],
|
|
477
|
+
balanceEmpty: ['No balance record came back.', 'Nothing on the account.'],
|
|
478
|
+
balanceSignedOut: ["You're signed out — I can't see the balance.", 'Sign in first and I can read it.'],
|
|
479
|
+
balanceUnavailable: ["Couldn't read it just now — try again in a bit.", 'That read did not go through.'],
|
|
480
|
+
balanceFailed: ["The balance lookup didn't work.", "Couldn't read that — try again later."],
|
|
481
|
+
balanceUnsupported: ["I can't reach the balance from this shell.", 'No balance channel here.'],
|
|
389
482
|
}
|
|
390
483
|
|
|
391
484
|
/* 语言:中文环境(或读不到语言)用中文,其余走英文覆盖层。
|
|
@@ -406,8 +499,35 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
406
499
|
if (langHtml !== '') return langHtml
|
|
407
500
|
try { return String(navigator.language || navigator.userLanguage || 'zh') } catch (e) { return 'zh' }
|
|
408
501
|
})()
|
|
409
|
-
|
|
410
|
-
const
|
|
502
|
+
/* 进页面时的默认判定(用户没显式选过就用它) */
|
|
503
|
+
const IS_ZH_DEFAULT = LANG_TAG.toLowerCase().indexOf('zh') === 0
|
|
504
|
+
|
|
505
|
+
/* 现在用哪种语言:① 设置里显式选过就听它 ② 否则用进页面时的判定。
|
|
506
|
+
—— 做成**函数**而不是常量,这样菜单里切换立刻生效,不用刷新。 */
|
|
507
|
+
const isZhNow = () => {
|
|
508
|
+
/* cfg 是后面才声明的 const:取词可能发生在它初始化之前,
|
|
509
|
+
而那时访问它会抛 TDZ 错误(不是 undefined)—— 所以这里必须兜住。 */
|
|
510
|
+
let forced = 'auto'
|
|
511
|
+
try { forced = (cfg && typeof cfg.lang === 'string') ? cfg.lang : 'auto' } catch (e) { forced = 'auto' }
|
|
512
|
+
if (forced === 'zh') return true
|
|
513
|
+
if (forced === 'en') return false
|
|
514
|
+
return IS_ZH_DEFAULT
|
|
515
|
+
}
|
|
516
|
+
|
|
517
|
+
/* LINES 是一个**视图**:取词的那一刻才决定用中文还是英文覆盖层。
|
|
518
|
+
用 Proxy 而不是"提前合并成一个对象" —— 后者在切换语言时是死值,必须刷新页面。
|
|
519
|
+
覆盖层缺哪条就退回中文,所以可以慢慢补齐,永远不会出现半句话。 */
|
|
520
|
+
const LINES = new Proxy({}, {
|
|
521
|
+
get(_target, key) {
|
|
522
|
+
const zh = LINES_ZH[key]
|
|
523
|
+
if (isZhNow()) return zh
|
|
524
|
+
const en = LINES_EN[key]
|
|
525
|
+
return en === undefined ? zh : en
|
|
526
|
+
},
|
|
527
|
+
has(_target, key) { return key in LINES_ZH },
|
|
528
|
+
ownKeys() { return Reflect.ownKeys(LINES_ZH) },
|
|
529
|
+
getOwnPropertyDescriptor() { return { enumerable: true, configurable: true } },
|
|
530
|
+
})
|
|
411
531
|
|
|
412
532
|
/* 深夜窗口。bedtime > wake 时它跨零点(默认 23→5);不跨也能用(比如 1→5)。 */
|
|
413
533
|
const isNightHour = (hour, from, to) => {
|
|
@@ -501,7 +621,10 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
501
621
|
if (Ctor === null) return
|
|
502
622
|
try {
|
|
503
623
|
const clip = new Ctor(src)
|
|
504
|
-
|
|
624
|
+
/* 音量必须落到 [0,1] 内的有限数:给媒体元素设 NaN/Infinity 会**抛异常**,
|
|
625
|
+
而这一整段是被 catch 包住的 —— 一个坏值会让音效静默消失,看起来像"开关没反应"。 */
|
|
626
|
+
const volume = Number(cfg.soundVolume)
|
|
627
|
+
clip.volume = isFinite(volume) ? clamp(volume, 0, 1) : 0.7
|
|
505
628
|
const started = clip.play()
|
|
506
629
|
if (started && typeof started.catch === 'function') started.catch(() => { /* 自动播放被拦下就作罢 */ })
|
|
507
630
|
} catch (e) { /* 音效永远不该打断别的事 */ }
|
|
@@ -518,6 +641,7 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
518
641
|
hungry: { kind: 'bool' },
|
|
519
642
|
hungerMs: { kind: 'num', lo: 0, hi: 86400000 },
|
|
520
643
|
focusMinutes: { kind: 'num', lo: 1, hi: 600 },
|
|
644
|
+
lang: { kind: 'str' },
|
|
521
645
|
sound: { kind: 'bool' },
|
|
522
646
|
soundVolume: { kind: 'num', lo: 0, hi: 1 },
|
|
523
647
|
night: { kind: 'bool' },
|
|
@@ -531,6 +655,7 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
531
655
|
wanderMs: { kind: 'num', lo: 5000, hi: 3600000 },
|
|
532
656
|
wanderRange: { kind: 'num', lo: 0, hi: 2000 },
|
|
533
657
|
reactions: { kind: 'bool' },
|
|
658
|
+
motion: { kind: 'one', of: Object.keys(MOTION_AMP) },
|
|
534
659
|
persist: { kind: 'bool' },
|
|
535
660
|
celebrate: { kind: 'bool' },
|
|
536
661
|
wander: { kind: 'bool' },
|
|
@@ -543,6 +668,9 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
543
668
|
const spec = CONFIG_SPEC[key]
|
|
544
669
|
if (spec.kind === 'num') return num(value, spec.lo, spec.hi, fallback)
|
|
545
670
|
if (spec.kind === 'str') return typeof value === 'string' ? value : fallback
|
|
671
|
+
/* 枚举:认不出来的值一律退回 fallback。写错一个档位名不该让她变成
|
|
672
|
+
"动也不动、也没有报错"的那种坏状态。 */
|
|
673
|
+
if (spec.kind === 'one') return spec.of.indexOf(value) >= 0 ? value : fallback
|
|
546
674
|
return bool(value, fallback)
|
|
547
675
|
}
|
|
548
676
|
|
|
@@ -719,8 +847,13 @@ const UPDATE_HINT = '在 DSH 的插件列表里按包名安装:dsh-wisp'
|
|
|
719
847
|
.wisp-root{position:absolute;width:${BOX_W}px;height:${BOX_H}px;pointer-events:none;transform-origin:top center;--wisp-aura:rgba(110,200,255,.42)}
|
|
720
848
|
.wisp-root[data-dragging="true"]{will-change:transform}
|
|
721
849
|
.wisp-root[data-gliding="true"]{transition:transform 1.6s cubic-bezier(.4,0,.2,1)}
|
|
722
|
-
.wisp-body{position:absolute;inset:0;pointer-events:
|
|
723
|
-
|
|
850
|
+
.wisp-body{position:absolute;inset:0;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none;animation:wisp-bob 5.6s ease-in-out infinite}
|
|
851
|
+
/* 命中层:一个**不画任何东西**的空盒子,只负责被鼠标点到。它带一层由 alpha 蒙版
|
|
852
|
+
生成的 clip-path —— 于是"透明处点不到"是**浏览器**做的,而不是 JS 事后补救:
|
|
853
|
+
事件根本不会派到她身上,下面的应用照常收到 hover / 点击 / 右键 / 滚轮。
|
|
854
|
+
(只写 pointer-events:none 是不够的:那只是不拦她自己的事,盒子仍然盖在应用上面。) */
|
|
855
|
+
.wisp-hit{position:absolute;inset:0;pointer-events:auto;cursor:grab}
|
|
856
|
+
.wisp-hit:active{cursor:grabbing}
|
|
724
857
|
.wisp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:bottom center;filter:drop-shadow(0 6px 14px rgba(0,0,0,.30));transition:opacity .28s ease,filter .5s ease}
|
|
725
858
|
.wisp-shine{position:absolute;left:50%;bottom:-8px;width:68%;height:16px;margin-left:-34%;border-radius:50%;background:radial-gradient(ellipse at center,var(--wisp-aura) 0%,transparent 70%);filter:blur(4px);pointer-events:none;transition:background .5s ease}
|
|
726
859
|
.wisp-zzz{position:absolute;right:6px;top:8px;font-size:calc(13px * var(--wisp-scale));font-weight:600;color:var(--wisp-ink);text-shadow:0 0 8px var(--wisp-aura);animation:wisp-zzz 2.6s ease-out infinite;pointer-events:none}
|
|
@@ -743,6 +876,29 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
743
876
|
.wisp-root[data-mood="attn"] .wisp-body{animation-name:wisp-nudge;animation-duration:1.5s;animation-iteration-count:4}
|
|
744
877
|
@keyframes wisp-nudge{0%,100%{transform:translate3d(0,0,0)}25%{transform:translate3d(-7px,0,0)}75%{transform:translate3d(7px,0,0)}}
|
|
745
878
|
@keyframes wisp-hop{0%,100%{transform:translate3d(0,0,0)}45%{transform:translate3d(0,-16px,0)}}
|
|
879
|
+
/* ---- 动作层(见文件上方 motion 常量处的说明)----
|
|
880
|
+
两层都是**空盒子**:绝对定位铺满、不吃指针。姿势与一次性动作分别只碰自己
|
|
881
|
+
那一层的 transform,所以它们永远不会互相覆盖。
|
|
882
|
+
transform-origin 放在脚底:压扁是"踩在地上压下去",侧倾是"钟摆",不是"转盘"。 */
|
|
883
|
+
.wisp-motion,.wisp-lean{position:absolute;inset:0;pointer-events:none;transform-origin:50% 100%}
|
|
884
|
+
.wisp-lean{transform:rotate(var(--wisp-tilt,0deg));transition:transform .5s cubic-bezier(.22,1.2,.36,1)}
|
|
885
|
+
/* 拖动中姿势必须**跟手**:一有过渡,拖起来就像拽着一根橡皮筋。 */
|
|
886
|
+
.wisp-root[data-dragging="true"] .wisp-lean{transition:none}
|
|
887
|
+
/* 幅度档位:一个变量管住所有一次性动作的幅度(关键帧里用 calc 乘它),
|
|
888
|
+
指针侧倾的幅度在 JS 里读同一张表 —— 两边不会各调各的。 */
|
|
889
|
+
.wisp-root{--wisp-amp:1}
|
|
890
|
+
.wisp-root[data-motion="subtle"]{--wisp-amp:.5}
|
|
891
|
+
.wisp-root[data-motion="off"]{--wisp-amp:0}
|
|
892
|
+
/* 静止档:连呼吸和 z 都停 —— 她说"我不想让她动"时,是最彻底的静止。 */
|
|
893
|
+
.wisp-root[data-motion="off"] .wisp-body,.wisp-root[data-motion="off"] .wisp-zzz{animation:none}
|
|
894
|
+
.wisp-root[data-accent="press"] .wisp-motion{animation:wisp-press .2s ease-out}
|
|
895
|
+
.wisp-root[data-accent="land"] .wisp-motion{animation:wisp-land .56s cubic-bezier(.2,1.15,.35,1)}
|
|
896
|
+
.wisp-root[data-accent="pop-a"] .wisp-motion{animation:wisp-pop-a .38s ease-out}
|
|
897
|
+
.wisp-root[data-accent="pop-b"] .wisp-motion{animation:wisp-pop-b .38s ease-out}
|
|
898
|
+
@keyframes wisp-press{0%{transform:scale(1,1)}60%{transform:scale(calc(1 + .045*var(--wisp-amp,1)),calc(1 - .06*var(--wisp-amp,1)))}100%{transform:scale(1,1)}}
|
|
899
|
+
@keyframes wisp-land{0%{transform:scale(calc(1 + .06*var(--wisp-amp,1)),calc(1 - .085*var(--wisp-amp,1)))}42%{transform:scale(calc(1 - .022*var(--wisp-amp,1)),calc(1 + .028*var(--wisp-amp,1)))}74%{transform:scale(calc(1 + .01*var(--wisp-amp,1)),calc(1 - .012*var(--wisp-amp,1)))}100%{transform:scale(1,1)}}
|
|
900
|
+
@keyframes wisp-pop-a{0%{transform:scale(1)}46%{transform:scale(calc(1 + .035*var(--wisp-amp,1)))}100%{transform:scale(1)}}
|
|
901
|
+
@keyframes wisp-pop-b{0%{transform:scale(1)}46%{transform:scale(calc(1 + .03*var(--wisp-amp,1)),calc(1 - .025*var(--wisp-amp,1)))}100%{transform:scale(1,1)}}
|
|
746
902
|
/* 菜单与级联子面板共用一套外观变量 —— 面板是菜单的"上一层",只改阴影与浮起量。
|
|
747
903
|
尺寸走**紧凑刻度**:这是陪伴插件的浮层,不该占掉屏幕的观感重心。 */
|
|
748
904
|
.wisp-menu{--wisp-surface:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));--wisp-line:var(--dsw-alias-border-l1,var(--wisp-say-line));--wisp-hover:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.2));--wisp-accent:var(--dsw-alias-brand-primary,#4a7cf7);position:absolute;min-width:164px;max-width:196px;padding:4px;border-radius:9px;font-size:11px;line-height:1.2;color:var(--dsw-alias-label-primary,var(--wisp-say-fg));background:var(--wisp-surface);border:1px solid var(--wisp-line);box-shadow:0 10px 28px rgba(0,0,0,.3);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);pointer-events:auto;animation:wisp-menu .13s ease}
|
|
@@ -768,6 +924,11 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
768
924
|
.wisp-menu-glyph{display:inline-block;width:12px;margin-right:4px;text-align:center;font-size:10.5px;opacity:.72;font-weight:400}
|
|
769
925
|
.wisp-menu-item[data-accent="true"] .wisp-menu-glyph{opacity:1}
|
|
770
926
|
.wisp-menu-caret{opacity:.5;font-size:8px;flex:0 0 auto}
|
|
927
|
+
/* 三选一的胶囊组:选中的那颗有强调色,其余是淡底 —— 一眼看出"只能选一个、现在选的是哪个" */
|
|
928
|
+
.wisp-choice{display:flex;gap:2px;flex:0 0 auto;padding:1px;border-radius:999px;background:rgba(140,160,190,.18)}
|
|
929
|
+
.wisp-choice-opt{padding:1px 6px;border:0;border-radius:999px;background:none;color:inherit;font:inherit;font-size:9.5px;line-height:13px;cursor:pointer;opacity:.7;transition:background .1s ease,opacity .1s ease}
|
|
930
|
+
.wisp-choice-opt:hover{opacity:1}
|
|
931
|
+
.wisp-choice-opt[data-on="true"]{background:var(--wisp-accent,#4a7cf7);color:#fff;opacity:1}
|
|
771
932
|
.wisp-switch{flex:0 0 auto;width:22px;height:12px;border-radius:6px;background:rgba(140,160,190,.4);position:relative;transition:background .16s ease}
|
|
772
933
|
.wisp-switch[data-on="true"]{background:var(--wisp-accent,#4a7cf7);box-shadow:0 0 0 2px rgba(74,124,247,.14)}
|
|
773
934
|
.wisp-switch i{position:absolute;top:2px;left:2px;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.28);transition:transform .16s ease}
|
|
@@ -815,7 +976,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
815
976
|
.wisp-credits{font-size:11px;opacity:.8;margin:6px 0 0}
|
|
816
977
|
.wisp-dialog-action{display:block;width:100%;margin:4px 0 2px;padding:7px 10px;border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));border-radius:8px;background:none;color:inherit;font:inherit;cursor:pointer}
|
|
817
978
|
.wisp-dialog-action:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.2))}
|
|
818
|
-
@media (prefers-reduced-motion:reduce){.wisp-body{animation:none!important}.wisp-menu,.wisp-submenu,.wisp-switch,.wisp-switch i,.wisp-slider-knob,.wisp-menu-item,.wisp-corner{animation:none!important;transition:none!important}}`
|
|
979
|
+
@media (prefers-reduced-motion:reduce){.wisp-body{animation:none!important}.wisp-motion{animation:none!important}.wisp-lean{transform:none!important;transition:none!important}.wisp-menu,.wisp-submenu,.wisp-switch,.wisp-switch i,.wisp-slider-knob,.wisp-menu-item,.wisp-corner{animation:none!important;transition:none!important}}`
|
|
819
980
|
|
|
820
981
|
const installStyles = (styles) => {
|
|
821
982
|
if (styles && typeof styles.insert === 'function') {
|
|
@@ -880,8 +1041,11 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
880
1041
|
return null
|
|
881
1042
|
}
|
|
882
1043
|
|
|
883
|
-
const buildMask = (key, url) => {
|
|
884
|
-
if (masks[key])
|
|
1044
|
+
const buildMask = (key, url, onReady) => {
|
|
1045
|
+
if (masks[key]) {
|
|
1046
|
+
if (typeof onReady === 'function') onReady(key)
|
|
1047
|
+
return
|
|
1048
|
+
}
|
|
885
1049
|
try {
|
|
886
1050
|
const canvas = document.createElement('canvas')
|
|
887
1051
|
if (!canvas || typeof canvas.getContext !== 'function') return
|
|
@@ -912,12 +1076,62 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
912
1076
|
// the aura, so without this a click that looks like it is on her
|
|
913
1077
|
// edge falls into the pass-through margin.
|
|
914
1078
|
masks[key] = dilate(raw)
|
|
1079
|
+
if (typeof onReady === 'function') onReady(key)
|
|
915
1080
|
} catch (e) { /* tainted or unsupported: the full box stays hittable */ }
|
|
916
1081
|
}
|
|
917
1082
|
probe.src = url
|
|
918
1083
|
} catch (e) { /* no canvas: the full box stays hittable */ }
|
|
919
1084
|
}
|
|
920
1085
|
|
|
1086
|
+
/* ---------------------------------------------------------------------
|
|
1087
|
+
蒙版 → clip-path。
|
|
1088
|
+
|
|
1089
|
+
蒙版是 96×144 的格,这里把每行连续的不透明格合并成矩形(再和上一行同列同宽的
|
|
1090
|
+
矩形纵向合并),输出一条 SVG path。段数通常在几十段(实测某套皮肤 40 段),
|
|
1091
|
+
一次设置、只在换皮肤或改大小时重算 —— 不是每帧的事。
|
|
1092
|
+
|
|
1093
|
+
为什么非要交给浏览器:`pointer-events:none` 只能让她自己不拦事件,她那个
|
|
1094
|
+
560×840 的盒子仍然盖在应用上面 —— 事件**先派给她**,JS 再 return 已经晚了。
|
|
1095
|
+
有了 clip-path,命中判定在浏览器里就按她的轮廓做,透明处是真的穿透。
|
|
1096
|
+
--------------------------------------------------------------------- */
|
|
1097
|
+
const clipPathOf = (mask, width, height) => {
|
|
1098
|
+
if (!mask || !(width > 0) || !(height > 0)) return ''
|
|
1099
|
+
const rects = []
|
|
1100
|
+
let prev = new Map() // 上一行里"可能继续往下长"的矩形
|
|
1101
|
+
for (let y = 0; y < MASK_H; y++) {
|
|
1102
|
+
const next = new Map()
|
|
1103
|
+
let x = 0
|
|
1104
|
+
while (x < MASK_W) {
|
|
1105
|
+
if (mask[y * MASK_W + x] <= MASK_MIN_ALPHA) { x++; continue }
|
|
1106
|
+
const start = x
|
|
1107
|
+
while (x < MASK_W && mask[y * MASK_W + x] > MASK_MIN_ALPHA) x++
|
|
1108
|
+
const key = start + ':' + (x - start)
|
|
1109
|
+
const carried = prev.get(key)
|
|
1110
|
+
if (carried && carried.y + carried.h === y) {
|
|
1111
|
+
carried.h++
|
|
1112
|
+
next.set(key, carried)
|
|
1113
|
+
} else {
|
|
1114
|
+
const rect = { x: start, y, w: x - start, h: 1 }
|
|
1115
|
+
rects.push(rect)
|
|
1116
|
+
next.set(key, rect)
|
|
1117
|
+
}
|
|
1118
|
+
}
|
|
1119
|
+
prev = next
|
|
1120
|
+
}
|
|
1121
|
+
if (rects.length === 0) return ''
|
|
1122
|
+
const sx = width / MASK_W
|
|
1123
|
+
const sy = height / MASK_H
|
|
1124
|
+
let d = ''
|
|
1125
|
+
for (const rect of rects) {
|
|
1126
|
+
const rx = (rect.x * sx).toFixed(1)
|
|
1127
|
+
const ry = (rect.y * sy).toFixed(1)
|
|
1128
|
+
const rw = (rect.w * sx).toFixed(1)
|
|
1129
|
+
const rh = (rect.h * sy).toFixed(1)
|
|
1130
|
+
d += 'M' + rx + ' ' + ry + 'h' + rw + 'v' + rh + 'h-' + rw + 'z'
|
|
1131
|
+
}
|
|
1132
|
+
return 'path("' + d + '")'
|
|
1133
|
+
}
|
|
1134
|
+
|
|
921
1135
|
/* ---------------------------------------------------------------------
|
|
922
1136
|
WHAT THE APP IS DOING — read from the DOM, deliberately.
|
|
923
1137
|
|
|
@@ -1225,6 +1439,22 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1225
1439
|
sayEl.style.top = Math.round(Math.max(coords.y, SAY_CLEARANCE)) + 'px'
|
|
1226
1440
|
}
|
|
1227
1441
|
|
|
1442
|
+
/* ---- 姿势角 --------------------------------------------------------
|
|
1443
|
+
tiltScreen 是**屏幕坐标**里的角度:正数 = 顶朝右。
|
|
1444
|
+
但她在左半边时整个 root 是镜像的(scaleX(-1)),镜像会把里面的旋转
|
|
1445
|
+
一起翻过去 —— 所以写进样式前先乘一次 facing。少了这一步,"她朝指针
|
|
1446
|
+
倾"在她跨过屏幕中线之后会变成朝反方向倾,而且只在半张屏幕上错。
|
|
1447
|
+
它必须写在 paint() 里,因为 facing 只在 paint() 里算。 */
|
|
1448
|
+
let tiltScreen = 0
|
|
1449
|
+
let tiltWritten = null
|
|
1450
|
+
let facingNow = 1
|
|
1451
|
+
const applyTilt = () => {
|
|
1452
|
+
const text = (Math.round(tiltScreen * facingNow * 10) / 10) + 'deg'
|
|
1453
|
+
if (text === tiltWritten) return // 同一个值不重复写:写一次就是一次样式重算
|
|
1454
|
+
tiltWritten = text
|
|
1455
|
+
root.style.setProperty('--wisp-tilt', text)
|
|
1456
|
+
}
|
|
1457
|
+
|
|
1228
1458
|
const paint = () => {
|
|
1229
1459
|
const facing = coords.x + boxW() / 2 < vw() / 2 ? -1 : 1
|
|
1230
1460
|
// The translate places the box's TOP-LEFT corner, so it is `coords.x`,
|
|
@@ -1232,7 +1462,9 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1232
1462
|
// feeding it a centre offset put the whole box half a box-width to the
|
|
1233
1463
|
// right, off the edge of the viewport. The mirror still pivots in place
|
|
1234
1464
|
// because `transform-origin` is the top CENTRE.
|
|
1465
|
+
facingNow = facing
|
|
1235
1466
|
root.style.transform = 'translate3d(' + coords.x + 'px,' + coords.y + 'px,0) scaleX(' + facing + ')'
|
|
1467
|
+
applyTilt()
|
|
1236
1468
|
placeSay()
|
|
1237
1469
|
}
|
|
1238
1470
|
paint()
|
|
@@ -1244,7 +1476,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1244
1476
|
bodyEl.style.left = '0'
|
|
1245
1477
|
bodyEl.style.right = '0'
|
|
1246
1478
|
bodyEl.style.bottom = '0'
|
|
1247
|
-
bodyEl.style.pointerEvents = '
|
|
1479
|
+
bodyEl.style.pointerEvents = 'none'
|
|
1248
1480
|
bodyEl.setAttribute('role', 'button')
|
|
1249
1481
|
/* tabindex 是 0 而不是 -1:菜单已经支持键盘导航(↑↓/Home/End/Esc),但如果她本身
|
|
1250
1482
|
不可聚焦,键盘用户就**没有办法打开它** —— 声明了 role="menu" 却没有入口,与
|
|
@@ -1254,6 +1486,38 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1254
1486
|
bodyEl.setAttribute('aria-label', 'DeepSeek娘')
|
|
1255
1487
|
bodyEl.setAttribute('aria-haspopup', 'menu')
|
|
1256
1488
|
|
|
1489
|
+
/* 命中层(见 clipPathOf 上面的说明):空盒子 + 由蒙版生成的 clip-path。
|
|
1490
|
+
关键样式同样行内再写一遍 —— 样式表缺失时它必须仍然是"铺满、吃指针"的那个。 */
|
|
1491
|
+
const hitEl = document.createElement('div')
|
|
1492
|
+
hitEl.className = 'wisp-hit'
|
|
1493
|
+
hitEl.setAttribute('aria-hidden', 'true')
|
|
1494
|
+
hitEl.style.position = 'absolute'
|
|
1495
|
+
hitEl.style.top = '0'
|
|
1496
|
+
hitEl.style.left = '0'
|
|
1497
|
+
hitEl.style.right = '0'
|
|
1498
|
+
hitEl.style.bottom = '0'
|
|
1499
|
+
hitEl.style.pointerEvents = 'auto'
|
|
1500
|
+
hitEl.style.cursor = 'grab'
|
|
1501
|
+
|
|
1502
|
+
/* 动作层(见文件上方 motion 常量处的说明):两个空盒子,把"姿势"与
|
|
1503
|
+
"一次性动作"从情绪动画里分出来。关键样式同样**行内再写一遍** ——
|
|
1504
|
+
理由和 layer/root 一样:样式表缺失时它们是 position:static 的普通
|
|
1505
|
+
div,会把精灵图挤成两个叠着的方块。 */
|
|
1506
|
+
const motionEl = document.createElement('div')
|
|
1507
|
+
motionEl.className = 'wisp-motion'
|
|
1508
|
+
const leanEl = document.createElement('div')
|
|
1509
|
+
leanEl.className = 'wisp-lean'
|
|
1510
|
+
for (const box of [motionEl, leanEl]) {
|
|
1511
|
+
box.style.position = 'absolute'
|
|
1512
|
+
box.style.top = '0'
|
|
1513
|
+
box.style.left = '0'
|
|
1514
|
+
box.style.right = '0'
|
|
1515
|
+
box.style.bottom = '0'
|
|
1516
|
+
box.style.pointerEvents = 'none'
|
|
1517
|
+
/* 旋转/压扁的原点在脚底:否则侧倾像转盘,压扁像从头顶往下缩。 */
|
|
1518
|
+
box.style.transformOrigin = '50% 100%'
|
|
1519
|
+
}
|
|
1520
|
+
|
|
1257
1521
|
const shine = document.createElement('div')
|
|
1258
1522
|
shine.className = 'wisp-shine'
|
|
1259
1523
|
|
|
@@ -1284,9 +1548,23 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1284
1548
|
return skin.idle
|
|
1285
1549
|
}
|
|
1286
1550
|
|
|
1551
|
+
/* 把当前精灵图的蒙版变成命中层的形状。蒙版是异步来的(图片解码完才有),
|
|
1552
|
+
所以它由 buildMask 的回调触发;换皮肤、改大小的时候各再调一次。 */
|
|
1553
|
+
let hitClip = null
|
|
1554
|
+
const applyHitClip = (key) => {
|
|
1555
|
+
if (key !== currentSprite) return // 过期的回调:那张图已经不是现在这张
|
|
1556
|
+
const mask = masks[activeSkin + '/' + key]
|
|
1557
|
+
const path = mask ? clipPathOf(mask, boxW(), boxH()) : ''
|
|
1558
|
+
if (path === hitClip) return // 同一个形状不重复写
|
|
1559
|
+
hitClip = path
|
|
1560
|
+
hitEl.style.clipPath = path
|
|
1561
|
+
hitEl.style.webkitClipPath = path
|
|
1562
|
+
}
|
|
1563
|
+
|
|
1287
1564
|
const setSprite = (key) => {
|
|
1565
|
+
currentSprite = key
|
|
1288
1566
|
const url = resolveSprite(spriteOf(key))
|
|
1289
|
-
buildMask(activeSkin + '/' + key, url)
|
|
1567
|
+
buildMask(activeSkin + '/' + key, url, () => applyHitClip(key))
|
|
1290
1568
|
currentSprite = key
|
|
1291
1569
|
/* Cross-fade rather than swapping `src` outright: a hard swap makes every
|
|
1292
1570
|
mood change read as a glitch. The outgoing sprite keeps its own layer
|
|
@@ -1310,7 +1588,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1310
1588
|
outgoing.draggable = false
|
|
1311
1589
|
outgoing.setAttribute('aria-hidden', 'true')
|
|
1312
1590
|
outgoing.src = previous
|
|
1313
|
-
|
|
1591
|
+
leanEl.insertBefore(outgoing, img)
|
|
1314
1592
|
img.src = url
|
|
1315
1593
|
img.style.opacity = '0'
|
|
1316
1594
|
clock.after(16, () => {
|
|
@@ -1321,8 +1599,13 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1321
1599
|
clock.after(340, () => { if (outgoing.parentNode) outgoing.parentNode.removeChild(outgoing) })
|
|
1322
1600
|
}
|
|
1323
1601
|
|
|
1324
|
-
|
|
1325
|
-
|
|
1602
|
+
/* 结构:body(情绪动画)> motion(一次性动作)> lean(姿势)> shine/img,
|
|
1603
|
+
外加一个兄弟节点 hit(命中层)。 */
|
|
1604
|
+
leanEl.appendChild(shine)
|
|
1605
|
+
leanEl.appendChild(img)
|
|
1606
|
+
motionEl.appendChild(leanEl)
|
|
1607
|
+
bodyEl.appendChild(motionEl)
|
|
1608
|
+
bodyEl.appendChild(hitEl)
|
|
1326
1609
|
root.appendChild(bodyEl)
|
|
1327
1610
|
layer.appendChild(root)
|
|
1328
1611
|
setSprite('idle')
|
|
@@ -1379,10 +1662,86 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1379
1662
|
return true
|
|
1380
1663
|
}
|
|
1381
1664
|
|
|
1665
|
+
/* ---- 动作层的三个入口 -------------------------------------------------
|
|
1666
|
+
amp() :幅度档位(full 1 / subtle .5 / off 0),CSS 那边读的是同一个
|
|
1667
|
+
区间 —— 关键帧里用 calc 乘 --wisp-amp,指针侧倾在这里乘。
|
|
1668
|
+
reduced():prefers-reduced-motion。CSS 已经把动画关掉了,但**姿势是 JS
|
|
1669
|
+
写进去的**,样式表关不掉它,所以这里必须再问一次系统。
|
|
1670
|
+
matchMedia 不存在的壳里返回 false:拿不到就不假装系统说了什么。
|
|
1671
|
+
accent() :放一次"一次性动作"。它只写一个属性,什么时候收手由这里的
|
|
1672
|
+
时钟决定(CSS 只管怎么动)—— 所以不会出现"动画早放完了、
|
|
1673
|
+
属性还挂着"那种半截状态。 */
|
|
1674
|
+
let reducedMql = null
|
|
1675
|
+
const reduced = () => {
|
|
1676
|
+
try {
|
|
1677
|
+
if (reducedMql === null && typeof window.matchMedia === 'function') {
|
|
1678
|
+
reducedMql = window.matchMedia('(prefers-reduced-motion: reduce)')
|
|
1679
|
+
}
|
|
1680
|
+
return !!(reducedMql && reducedMql.matches)
|
|
1681
|
+
} catch (e) { return false }
|
|
1682
|
+
}
|
|
1683
|
+
const amp = () => {
|
|
1684
|
+
const value = MOTION_AMP[cfg.motion]
|
|
1685
|
+
return typeof value === 'number' ? value : 1
|
|
1686
|
+
}
|
|
1687
|
+
|
|
1688
|
+
let accentHandle = null
|
|
1689
|
+
let accentFlip = false
|
|
1690
|
+
const accent = (name) => {
|
|
1691
|
+
if (destroyed) return
|
|
1692
|
+
/* 静止档与"系统要求别动"都不放动作。CSS 那边也关着(媒体查询 +
|
|
1693
|
+
--wisp-amp:0),但**属性本身也不该被写上** —— 否则 doctor() 会报一个
|
|
1694
|
+
根本没发生的动作,读代码的人也会以为这条路是活的。 */
|
|
1695
|
+
if (amp() === 0 || reduced()) return
|
|
1696
|
+
/* pop-a / pop-b 是同一件事的两个名字。**同一个值再写一次不会重播动画**,
|
|
1697
|
+
而连戳两下必须看到两次弹 —— 换名字是这里最可靠的强制重播办法
|
|
1698
|
+
(靠读一次 offsetWidth 强制重排也能做到,但那要在替身里也装一个
|
|
1699
|
+
布局引擎,而替身没有布局)。 */
|
|
1700
|
+
const value = name === 'pop'
|
|
1701
|
+
? ((accentFlip = !accentFlip) ? 'pop-b' : 'pop-a')
|
|
1702
|
+
: name
|
|
1703
|
+
root.dataset.accent = value
|
|
1704
|
+
if (accentHandle) clock.cancel(accentHandle)
|
|
1705
|
+
accentHandle = clock.after(ACCENT_MS[name] || 400, () => {
|
|
1706
|
+
accentHandle = null
|
|
1707
|
+
if (!destroyed) delete root.dataset.accent
|
|
1708
|
+
})
|
|
1709
|
+
}
|
|
1710
|
+
|
|
1711
|
+
/* 姿势:° 是**屏幕坐标**里的角度(正 = 顶朝右),乘镜像由 applyTilt 做。
|
|
1712
|
+
这里是所有姿势的唯一闸门 —— 静止档与"系统要求别动"都在这一个地方归零,
|
|
1713
|
+
调用点不必各自记得判断。 */
|
|
1714
|
+
const setTilt = (deg) => {
|
|
1715
|
+
const next = (amp() === 0 || reduced()) ? 0 : clamp(deg, -TILT_DRAG_MAX, TILT_DRAG_MAX)
|
|
1716
|
+
if (Math.abs(next - tiltScreen) < TILT_STEP) return
|
|
1717
|
+
tiltScreen = next
|
|
1718
|
+
applyTilt()
|
|
1719
|
+
}
|
|
1720
|
+
|
|
1721
|
+
/* 档位改动要**当场**生效,不用刷新:属性一改,CSS 那边的全部幅度规则
|
|
1722
|
+
(关键帧里的 --wisp-amp、静止档关掉呼吸与 z)立刻跟上。
|
|
1723
|
+
另外把姿势归零 —— 从"灵动"切到"静止"时她还歪着,就成了半截状态。 */
|
|
1724
|
+
const applyMotion = () => {
|
|
1725
|
+
root.dataset.motion = cfg.motion
|
|
1726
|
+
if (amp() === 0 || reduced()) setTilt(0)
|
|
1727
|
+
}
|
|
1728
|
+
applyMotion()
|
|
1729
|
+
|
|
1382
1730
|
const setMood = (next) => {
|
|
1383
|
-
if (destroyed
|
|
1731
|
+
if (destroyed) return
|
|
1732
|
+
if (mood === next) return
|
|
1384
1733
|
mood = next
|
|
1385
1734
|
root.dataset.mood = next
|
|
1735
|
+
/* 换表情 = 弹一下(只给有表情的那几个状态配,理由见 POPPY_MOODS)。
|
|
1736
|
+
它必须在"真的换了表情"**之后**:`attn` 也在 POPPY_MOODS 里,而
|
|
1737
|
+
poll 只要看到待处理面板就每一轮重算 setMood('attn') —— 放在去重之前,
|
|
1738
|
+
她会在你盯着审批卡片等的时候每 1.2 秒抽一下(真机上 6 秒 5 次)。
|
|
1739
|
+
"连戳两下第二下也要弹"是**手势**的要求,由 flashHappy/flashPoked
|
|
1740
|
+
自己补(见那两处),不该让稳态重算也走这条路。 */
|
|
1741
|
+
if (POPPY_MOODS.indexOf(next) >= 0) accent('pop')
|
|
1742
|
+
/* 睡着时不该还朝着你的指针倾 —— 那和一个"睡着了还跟着你转头"的人一样怪。
|
|
1743
|
+
在**进入** sleep 时归零,而不是在指针处理器里每帧都判一次。 */
|
|
1744
|
+
if (next === 'sleep') setTilt(0)
|
|
1386
1745
|
const want = SPRITE_OF[next] || 'idle'
|
|
1387
1746
|
if (want !== currentSprite) setSprite(want)
|
|
1388
1747
|
const zs = root.querySelectorAll('.wisp-zzz')
|
|
@@ -1410,6 +1769,10 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1410
1769
|
const el = document.createElement('div')
|
|
1411
1770
|
el.className = 'wisp-say'
|
|
1412
1771
|
el.style.position = 'absolute'
|
|
1772
|
+
/* 气泡的淡出时长跟着**它的寿命**走,而不是跟着样式表里那个数:
|
|
1773
|
+
两边各写一份就会漂(样式表里写 4.2s、代码里活 4.4s —— 气泡会提前
|
|
1774
|
+
200ms 淡完再干等)。和 ACCENT_MS 一个道理:CSS 管怎么动,代码管多久。 */
|
|
1775
|
+
el.style.animationDuration = (SAY_MS / 1000) + 's'
|
|
1413
1776
|
el.textContent = text
|
|
1414
1777
|
// Into the LAYER, not the root: a child of the root would be mirrored
|
|
1415
1778
|
// with her and scaled by `size`.
|
|
@@ -1643,6 +2006,10 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1643
2006
|
}
|
|
1644
2007
|
|
|
1645
2008
|
const flashHappy = (text) => {
|
|
2009
|
+
/* 手势驱动的反应:**已经是这个表情时也要弹**。setMood 的弹一下挂在
|
|
2010
|
+
"真的换了表情"后面(否则轮询重算的 attn 会变成 1.2 秒一次的抽搐),
|
|
2011
|
+
所以"连戳两下"这条要求由这里补上 —— 它只由用户的手势触发。 */
|
|
2012
|
+
if (mood === 'happy') accent('pop')
|
|
1646
2013
|
setMood('happy')
|
|
1647
2014
|
say(text)
|
|
1648
2015
|
if (happyHandle) clock.cancel(happyHandle)
|
|
@@ -1654,6 +2021,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1654
2021
|
const POKED_MS = 1800
|
|
1655
2022
|
let pokedHandle = null
|
|
1656
2023
|
const flashPoked = (text) => {
|
|
2024
|
+
if (mood === 'poked') accent('pop') // 同上:连戳到底也要每次都弹
|
|
1657
2025
|
setMood('poked')
|
|
1658
2026
|
say(text)
|
|
1659
2027
|
if (pokedHandle) clock.cancel(pokedHandle)
|
|
@@ -1926,18 +2294,23 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1926
2294
|
`data-gliding`,由 CSS 过渡接管 transform;一旦按下就立刻摘掉,
|
|
1927
2295
|
否则拖动会被过渡拖后腿。 */
|
|
1928
2296
|
let glideHandle = null
|
|
1929
|
-
const glideTo = () => {
|
|
2297
|
+
const glideTo = (dx) => {
|
|
1930
2298
|
root.dataset.gliding = 'true'
|
|
1931
2299
|
paint()
|
|
2300
|
+
/* 朝行进方向微微前倾。整段 1.6 秒的滑行里,这一点倾斜就是"她往那边去"
|
|
2301
|
+
与"她被平移到那边"的区别 —— 归零那一半由 .wisp-lean 的过渡做。 */
|
|
2302
|
+
setTilt(clamp((Number(dx) || 0) * TILT_GLIDE_PER_PX, -TILT_GLIDE_MAX, TILT_GLIDE_MAX) * amp())
|
|
1932
2303
|
if (glideHandle) clock.cancel(glideHandle)
|
|
1933
2304
|
glideHandle = clock.after(1700, () => {
|
|
1934
2305
|
glideHandle = null
|
|
1935
2306
|
delete root.dataset.gliding
|
|
2307
|
+
setTilt(0)
|
|
1936
2308
|
})
|
|
1937
2309
|
}
|
|
1938
2310
|
const stopGlide = () => {
|
|
1939
2311
|
if (glideHandle) { clock.cancel(glideHandle); glideHandle = null }
|
|
1940
2312
|
delete root.dataset.gliding
|
|
2313
|
+
setTilt(0)
|
|
1941
2314
|
}
|
|
1942
2315
|
|
|
1943
2316
|
let wanderHandle = null
|
|
@@ -1951,9 +2324,10 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1951
2324
|
// a real stroll rather than a rounding error in a random direction.
|
|
1952
2325
|
const angle = Math.random() * Math.PI * 2
|
|
1953
2326
|
const dist = cfg.wanderRange * (0.45 + Math.random() * 0.55)
|
|
2327
|
+
const fromX = coords.x
|
|
1954
2328
|
coords.x = clamp(coords.x + Math.cos(angle) * dist, 0, maxX())
|
|
1955
2329
|
coords.y = clamp(coords.y + Math.sin(angle) * dist * 0.6, 0, maxY())
|
|
1956
|
-
glideTo()
|
|
2330
|
+
glideTo(coords.x - fromX)
|
|
1957
2331
|
// 故意不 rememberPosition():记忆的是"用户把她放在哪",她自己的溜达
|
|
1958
2332
|
// 不该覆盖那个意图,否则刷新后她会出现在一个用户从没选过的位置。
|
|
1959
2333
|
})
|
|
@@ -2009,13 +2383,15 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2009
2383
|
if (destroyed) return
|
|
2010
2384
|
hidden = next === true
|
|
2011
2385
|
root.dataset.hidden = hidden ? 'true' : 'false'
|
|
2012
|
-
if (hidden) { closeMenu(); hideTab(); clearSay(); showTab() }
|
|
2386
|
+
if (hidden) { closeMenu(); hideTab(); clearSay(); showTab(); setTilt(0) }
|
|
2013
2387
|
else { hideTab(); paint() }
|
|
2014
2388
|
if (cfg.persist) writeStored(HIDDEN_KEY, { hidden })
|
|
2015
2389
|
}
|
|
2016
2390
|
|
|
2017
2391
|
/* ---- drag & click ---- */
|
|
2018
2392
|
let start = null, origin = null, moved = false, lastClick = 0
|
|
2393
|
+
/* 上一次指针的横坐标:拖动中的侧倾是"这一段的位移",不是"从按下算起的总位移" */
|
|
2394
|
+
let lastDragX = 0
|
|
2019
2395
|
/* 连戳计数:POKE_WINDOW_MS 内累计到 POKE_ANNOYED_AT 次就抗议一次 */
|
|
2020
2396
|
const POKE_WINDOW_MS = 3000
|
|
2021
2397
|
const POKE_ANNOYED_AT = 3
|
|
@@ -2050,12 +2426,23 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2050
2426
|
if (!moved) return
|
|
2051
2427
|
coords.x = clamp(origin.x + dx, 0, maxX())
|
|
2052
2428
|
coords.y = clamp(origin.y + dy, 0, maxY())
|
|
2429
|
+
/* 拖动时她朝**运动的反方向**倾:被拎着走的东西,顶是往后倒的。
|
|
2430
|
+
只看"这一次事件走了多远"就等价于速度,不用存历史、不用积分 ——
|
|
2431
|
+
而且它天然跟着指针事件的频率走,慢拖就是小角度。 */
|
|
2432
|
+
setTilt(-(e.clientX - lastDragX) * TILT_DRAG_PER_PX * amp())
|
|
2433
|
+
lastDragX = e.clientX
|
|
2053
2434
|
paint()
|
|
2054
2435
|
}
|
|
2055
2436
|
const onUp = () => {
|
|
2056
2437
|
window.removeEventListener('pointermove', onMove)
|
|
2057
2438
|
window.removeEventListener('pointerup', onUp)
|
|
2058
2439
|
delete root.dataset.dragging
|
|
2440
|
+
/* 松手分两种:真拖过 = 落地(顿一下);只按了一下 = 什么都不放 ——
|
|
2441
|
+
紧接着的点击反应会自己弹一下(见 ACCENT_MS 的说明:通道只留
|
|
2442
|
+
最后发生的那件事)。姿势则一律由 CSS 过渡归零(拖动中它被
|
|
2443
|
+
data-dragging 关掉了,现在恢复了)。 */
|
|
2444
|
+
if (moved) accent('land')
|
|
2445
|
+
setTilt(0)
|
|
2059
2446
|
start = null
|
|
2060
2447
|
if (moved) {
|
|
2061
2448
|
rememberPosition()
|
|
@@ -2095,15 +2482,50 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2095
2482
|
if (!hitsBody(e)) return
|
|
2096
2483
|
stopGlide() // a stroll must not fight the drag
|
|
2097
2484
|
e.preventDefault(); e.stopPropagation()
|
|
2485
|
+
/* 点她 = 把键盘焦点给她。以前这是浏览器的默认行为(她自己就是那个被点的
|
|
2486
|
+
tabindex=0 元素);命中层接管点击之后默认焦点会落到 <body>,于是
|
|
2487
|
+
"点一下她、再按 Enter 开菜单"就断了 —— 显式补回来。 */
|
|
2488
|
+
focusHer()
|
|
2098
2489
|
start = { x: e.clientX, y: e.clientY }
|
|
2099
2490
|
origin = { x: coords.x, y: coords.y }
|
|
2100
2491
|
moved = false
|
|
2492
|
+
lastDragX = e.clientX
|
|
2101
2493
|
root.dataset.dragging = 'true'
|
|
2494
|
+
/* 按下去就压一下 —— 触摸反馈要在**按下**那一刻发生,等到松手才动
|
|
2495
|
+
就已经晚了(那正是"拖动"与"点击"共同的起点)。 */
|
|
2496
|
+
accent('press')
|
|
2102
2497
|
window.addEventListener('pointermove', onMove)
|
|
2103
2498
|
window.addEventListener('pointerup', onUp)
|
|
2104
2499
|
}
|
|
2105
2500
|
bodyEl.addEventListener('pointerdown', onDown)
|
|
2106
2501
|
|
|
2502
|
+
/* ---- 姿势:她注意到你的指针 -------------------------------------------
|
|
2503
|
+
指针进到 170px 的圈里,她朝指针方向侧身;贴得越近倾得越多,出圈归零。
|
|
2504
|
+
|
|
2505
|
+
这是全插件唯一一处"持续读指针"的逻辑,所以它必须便宜:
|
|
2506
|
+
· 纯算术,不查 DOM、不读布局(读一次 getBoundingClientRect 就是一次强制重排)
|
|
2507
|
+
· 出圈就走 setTilt(0),而 setTilt 自己挡掉"变化不到 0.05°"的写入
|
|
2508
|
+
· 拖动中直接返回 —— 那时候姿势由速度接管
|
|
2509
|
+
window 上本来就挂着 pointermove(wake:她得能被碰醒),所以这里不是
|
|
2510
|
+
新开一条全局热路径,只是同一条路上的第二个判断。 */
|
|
2511
|
+
const leanToPointer = (e) => {
|
|
2512
|
+
if (destroyed || paused || hidden || start !== null) return
|
|
2513
|
+
if (mood === 'sleep') return
|
|
2514
|
+
if (cfg.motion === 'off' || reduced()) return
|
|
2515
|
+
if (typeof e.clientX !== 'number' || typeof e.clientY !== 'number') return
|
|
2516
|
+
const dx = e.clientX - (coords.x + boxW() / 2)
|
|
2517
|
+
const dy = e.clientY - (coords.y + boxH() / 2)
|
|
2518
|
+
if (Math.abs(dx) > TILT_NEAR_PX || Math.abs(dy) > TILT_NEAR_PX) { setTilt(0); return }
|
|
2519
|
+
const near = 1 - Math.abs(dx) / TILT_NEAR_PX
|
|
2520
|
+
const level = 1 - Math.abs(dy) / TILT_NEAR_PX // 从她正上方路过不该让她倾
|
|
2521
|
+
setTilt((dx < 0 ? -1 : 1) * TILT_NEAR_MAX * near * level * amp())
|
|
2522
|
+
}
|
|
2523
|
+
window.addEventListener('pointermove', leanToPointer, { passive: true })
|
|
2524
|
+
/* 指针移出窗口、或者你切走应用之后,不会再有点事件来把它归零 ——
|
|
2525
|
+
没有这一下,她会一直朝着最后那个位置歪着。 */
|
|
2526
|
+
const resetTilt = () => setTilt(0)
|
|
2527
|
+
window.addEventListener('blur', resetTilt)
|
|
2528
|
+
|
|
2107
2529
|
/* 键盘入口:Enter / Space / 菜单键 / Shift+F10 打开菜单。
|
|
2108
2530
|
Space 默认会滚动页面,Enter 在表单里会提交 —— 都要拦。 */
|
|
2109
2531
|
/* 方向键微调位置。
|
|
@@ -2202,6 +2624,45 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2202
2624
|
|
|
2203
2625
|
/* 开关行:真开关的样子 + role=menuitemcheckbox + aria-checked。
|
|
2204
2626
|
点完**不关菜单** —— 拨开关时菜单消失是最烦人的交互之一。 */
|
|
2627
|
+
/* 三选一(语言)。做成一行里的一排小胶囊:比三个开关清楚 ——
|
|
2628
|
+
"同时只能选一个"这件事,胶囊组是自明的,开关组不是。 */
|
|
2629
|
+
const choiceRow = (spec, into) => {
|
|
2630
|
+
const row = document.createElement('div')
|
|
2631
|
+
row.className = 'wisp-menu-item wisp-menu-row wisp-choice-row'
|
|
2632
|
+
row.dataset.choice = spec.key
|
|
2633
|
+
const label = document.createElement('span')
|
|
2634
|
+
label.textContent = spec.label
|
|
2635
|
+
row.appendChild(glyph(spec.glyph || ''))
|
|
2636
|
+
row.appendChild(label)
|
|
2637
|
+
const group = document.createElement('span')
|
|
2638
|
+
group.className = 'wisp-choice'
|
|
2639
|
+
group.setAttribute('role', 'radiogroup')
|
|
2640
|
+
group.setAttribute('aria-label', spec.label)
|
|
2641
|
+
const current = cfg[spec.key] === undefined ? 'auto' : String(cfg[spec.key])
|
|
2642
|
+
for (const opt of spec.options) {
|
|
2643
|
+
const btn = document.createElement('button')
|
|
2644
|
+
btn.className = 'wisp-choice-opt'
|
|
2645
|
+
btn.setAttribute('type', 'button')
|
|
2646
|
+
btn.setAttribute('role', 'radio')
|
|
2647
|
+
btn.setAttribute('tabindex', '-1')
|
|
2648
|
+
btn.setAttribute('aria-checked', opt.value === current ? 'true' : 'false')
|
|
2649
|
+
btn.dataset.value = opt.value
|
|
2650
|
+
btn.dataset.on = opt.value === current ? 'true' : 'false'
|
|
2651
|
+
btn.textContent = opt.label
|
|
2652
|
+
btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
|
|
2653
|
+
btn.addEventListener('click', (ev) => {
|
|
2654
|
+
ev.preventDefault(); ev.stopPropagation()
|
|
2655
|
+
try { applyConfig({ [spec.key]: opt.value }) } catch (err) { /* ignore */ }
|
|
2656
|
+
refreshSurfaces() // 立刻重画:语言切换要当场看得见
|
|
2657
|
+
})
|
|
2658
|
+
group.appendChild(btn)
|
|
2659
|
+
menuButtons.push(btn)
|
|
2660
|
+
}
|
|
2661
|
+
row.appendChild(group)
|
|
2662
|
+
into.appendChild(row)
|
|
2663
|
+
return row
|
|
2664
|
+
}
|
|
2665
|
+
|
|
2205
2666
|
const switchRow = (spec, into) => {
|
|
2206
2667
|
const on = cfg[spec.key] === true
|
|
2207
2668
|
const btn = document.createElement('button')
|
|
@@ -2343,6 +2804,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2343
2804
|
const renderChildren = (children, into) => {
|
|
2344
2805
|
for (const child of children) {
|
|
2345
2806
|
if (child.kind === 'switch') { switchRow(child, into); continue }
|
|
2807
|
+
if (child.kind === 'choice') { choiceRow(child, into); continue }
|
|
2346
2808
|
if (child.kind === 'corners') { cornerGrid(into); continue }
|
|
2347
2809
|
actionRow(child, into)
|
|
2348
2810
|
}
|
|
@@ -2770,6 +3232,28 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2770
3232
|
{ label: '说句话', glyph: '✦', run: () => { wake(true); say(pick(LINES.click)) } },
|
|
2771
3233
|
{ label: '睡一会儿', glyph: '☾', run: () => setMood('sleep') },
|
|
2772
3234
|
{ label: '今天做了什么', glyph: '✎', run: () => saySummary() },
|
|
3235
|
+
/* 余额:按需查,查完她自己说 —— 不做轮询(稳态零开销那条承诺不破)。 */
|
|
3236
|
+
{ label: '看看余额', glyph: '¥', run: () => { checkBalance() } },
|
|
3237
|
+
/* 语言:三选一。切换**立刻生效**(LINES 是视图,不是死值)。 */
|
|
3238
|
+
{
|
|
3239
|
+
kind: 'choice', key: 'lang', label: '台词语言', glyph: '文',
|
|
3240
|
+
options: [
|
|
3241
|
+
{ value: 'auto', label: '跟随界面' },
|
|
3242
|
+
{ value: 'zh', label: '中文' },
|
|
3243
|
+
{ value: 'en', label: 'English' },
|
|
3244
|
+
],
|
|
3245
|
+
},
|
|
3246
|
+
/* 动作幅度:三选一。同样立刻生效 —— 它只改一个属性,CSS 全挂在上面。
|
|
3247
|
+
给这一档的理由:prefers-reduced-motion 是**系统级**的"所有动画都别放",
|
|
3248
|
+
而"我不想让这只桌宠动来动去"是另一件事,不该逼人去改系统设置。 */
|
|
3249
|
+
{
|
|
3250
|
+
kind: 'choice', key: 'motion', label: '动作幅度', glyph: '≈',
|
|
3251
|
+
options: [
|
|
3252
|
+
{ value: 'full', label: '灵动' },
|
|
3253
|
+
{ value: 'subtle', label: '克制' },
|
|
3254
|
+
{ value: 'off', label: '静止' },
|
|
3255
|
+
],
|
|
3256
|
+
},
|
|
2773
3257
|
/* 没有音效文件就不摆这个开关 —— 点了没反应的开关比没有开关更糟 */
|
|
2774
3258
|
...(HAS_SOUNDS ? [{ kind: 'switch', key: 'sound', label: '音效', glyph: '♪' }] : []),
|
|
2775
3259
|
/* 开关是**真正的开关行**:带 aria-checked,点完菜单不关(就在原地更新) */
|
|
@@ -3172,11 +3656,21 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
3172
3656
|
if (cfg.persist && partial && typeof partial === 'object' && partial.size !== undefined) {
|
|
3173
3657
|
writeStored(PREFS_KEY, { size: cfg.size })
|
|
3174
3658
|
}
|
|
3659
|
+
/* 语言选择存到**语言键**上(不是 PREFS_KEY):它在**加载时**就会被读,
|
|
3660
|
+
所以下次打开才生效。菜单里的胶囊切的是"以后说哪种话"。 */
|
|
3661
|
+
if (partial && typeof partial === 'object' && typeof partial.lang === 'string') {
|
|
3662
|
+
try { window.localStorage.setItem('dsh-wisp-lang', cfg.lang) } catch (e) { /* 存不了就算了 */ }
|
|
3663
|
+
}
|
|
3175
3664
|
// A bigger companion occupies a bigger box, so the stored position has
|
|
3176
3665
|
// to be re-clamped or she would grow off the edge.
|
|
3177
3666
|
root.style.width = Math.round(boxW()) + 'px'
|
|
3178
3667
|
root.style.height = Math.round(boxH()) + 'px'
|
|
3179
3668
|
layer.style.setProperty('--wisp-scale', String(cfg.size))
|
|
3669
|
+
/* 尺寸变了,命中层的形状也要跟着缩放(clip-path 里的坐标是 px,不是百分比)。 */
|
|
3670
|
+
applyHitClip(currentSprite)
|
|
3671
|
+
/* 动作档位也要当场生效(菜单里的胶囊就靠这一行):它只改一个属性,
|
|
3672
|
+
CSS 那边所有幅度规则都挂在它上面。 */
|
|
3673
|
+
if (partial && typeof partial === 'object' && partial.motion !== undefined) applyMotion()
|
|
3180
3674
|
coords.x = clamp(coords.x, 0, maxX())
|
|
3181
3675
|
coords.y = clamp(coords.y, 0, maxY())
|
|
3182
3676
|
paint()
|
|
@@ -3234,7 +3728,15 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
3234
3728
|
.then(() => seat.call('checkUpdate', { current: VERSION }))
|
|
3235
3729
|
.then((res) => {
|
|
3236
3730
|
if (!res || res.ok !== true || typeof res.latest !== 'string') {
|
|
3237
|
-
|
|
3731
|
+
/* 失败时也要把**每个源各自的原因**留下来。用户看到的是"没查成",
|
|
3732
|
+
而 doctor() 必须能说清是"这个壳里没有网络服务"还是"两个源都没连上" ——
|
|
3733
|
+
以前这里把 sources 丢了,失败就变成一句无法追问的话。 */
|
|
3734
|
+
updateCheck = {
|
|
3735
|
+
state: 'failed',
|
|
3736
|
+
reason: (res && res.reason) || 'no-result',
|
|
3737
|
+
sources: (res && res.sources) || null,
|
|
3738
|
+
at: nowMs(),
|
|
3739
|
+
}
|
|
3238
3740
|
} else if (compareVersions(VERSION, res.latest) < 0) {
|
|
3239
3741
|
/* from / sources 一起留着:两个源不一致时(npm 暂存、GitHub 已更新),
|
|
3240
3742
|
"这个数字是哪儿来的"比数字本身更需要能查。 */
|
|
@@ -3255,9 +3757,95 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
3255
3757
|
})
|
|
3256
3758
|
}
|
|
3257
3759
|
|
|
3760
|
+
/* ---- 看余额 -------------------------------------------------------------
|
|
3761
|
+
和"检查更新"走同一条路,但服务不同:宿主半包 inject 'deepseekAccount',
|
|
3762
|
+
用平台自己的账户服务取余额。**插件从头到尾不碰 API key** —— 凭据在平台
|
|
3763
|
+
手里,浏览器半包连读都读不到(它没有网络,fetch 是陷阱)。
|
|
3764
|
+
|
|
3765
|
+
未登录、读不到、这个壳里没有那个服务,是三句不同的话:
|
|
3766
|
+
说是"查不到"但其实是"没登录",就是在骗人。 */
|
|
3767
|
+
let balanceCheck = { state: 'idle', at: 0 }
|
|
3768
|
+
|
|
3769
|
+
/* 金额由客户端拼,台词只管口气。货币符号认不出来就原样写代码。 */
|
|
3770
|
+
const balanceAmount = (wallets) => {
|
|
3771
|
+
const bits = []
|
|
3772
|
+
for (const w of (Array.isArray(wallets) ? wallets : [])) {
|
|
3773
|
+
if (!w || typeof w.balance !== 'string') continue
|
|
3774
|
+
const sign = w.currency === 'CNY' ? '¥' : (w.currency === 'USD' ? '$' : '')
|
|
3775
|
+
bits.push(sign === '' ? (w.balance + (w.currency ? ' ' + w.currency : '')) : sign + w.balance)
|
|
3776
|
+
}
|
|
3777
|
+
return bits.join(' + ')
|
|
3778
|
+
}
|
|
3779
|
+
|
|
3780
|
+
const balanceLine = (res) => {
|
|
3781
|
+
if (res.state === 'ready') {
|
|
3782
|
+
const main = balanceAmount(res.wallets)
|
|
3783
|
+
if (main === '') return pick(LINES.balanceEmpty)
|
|
3784
|
+
const text = pick(LINES.balance).split('{n}').join(main)
|
|
3785
|
+
const bonus = balanceAmount(res.bonusWallets)
|
|
3786
|
+
return bonus === '' ? text : text + pick(LINES.balanceBonus).split('{n}').join(bonus)
|
|
3787
|
+
}
|
|
3788
|
+
if (res.state === 'signed-out') return pick(LINES.balanceSignedOut)
|
|
3789
|
+
if (res.state === 'unavailable') return pick(LINES.balanceUnavailable)
|
|
3790
|
+
if (res.state === 'unsupported') return pick(LINES.balanceUnsupported)
|
|
3791
|
+
return pick(LINES.balanceFailed)
|
|
3792
|
+
}
|
|
3793
|
+
|
|
3794
|
+
/* 按需查:菜单里那一行和 `__wisp.checkBalance()` 都走这里。
|
|
3795
|
+
它**自己说话**(先"看一下……"再报结果)—— 菜单点完就关了,留一个
|
|
3796
|
+
只返回状态、不出声的函数,用户会以为没反应。 */
|
|
3797
|
+
const checkBalance = () => {
|
|
3798
|
+
const seat = hostSeat()
|
|
3799
|
+
if (seat === null) {
|
|
3800
|
+
balanceCheck = { state: 'unsupported', at: nowMs() }
|
|
3801
|
+
wake(true)
|
|
3802
|
+
say(balanceLine(balanceCheck))
|
|
3803
|
+
return Promise.resolve(balanceCheck)
|
|
3804
|
+
}
|
|
3805
|
+
balanceCheck = { state: 'checking', at: nowMs() }
|
|
3806
|
+
wake(true)
|
|
3807
|
+
say(pick(LINES.balanceChecking))
|
|
3808
|
+
return Promise.resolve()
|
|
3809
|
+
.then(() => seat.call('checkBalance', { locale: LANG_TAG }))
|
|
3810
|
+
.then((res) => {
|
|
3811
|
+
if (!res || res.ok !== true) {
|
|
3812
|
+
balanceCheck = { state: 'failed', reason: (res && res.reason) || 'no-result', at: nowMs() }
|
|
3813
|
+
} else if (res.status === 'ready') {
|
|
3814
|
+
balanceCheck = {
|
|
3815
|
+
state: 'ready',
|
|
3816
|
+
wallets: Array.isArray(res.wallets) ? res.wallets : [],
|
|
3817
|
+
bonusWallets: Array.isArray(res.bonusWallets) ? res.bonusWallets : [],
|
|
3818
|
+
at: nowMs(),
|
|
3819
|
+
}
|
|
3820
|
+
} else if (res.status === 'signed-out' || res.status === 'unavailable') {
|
|
3821
|
+
balanceCheck = { state: res.status, at: nowMs() }
|
|
3822
|
+
} else {
|
|
3823
|
+
/* 平台答了,答案是 failed —— 是结果,不是异常。 */
|
|
3824
|
+
balanceCheck = { state: 'failed', reason: 'service-failed', at: nowMs() }
|
|
3825
|
+
}
|
|
3826
|
+
say(balanceLine(balanceCheck))
|
|
3827
|
+
return balanceCheck
|
|
3828
|
+
})
|
|
3829
|
+
.catch((err) => {
|
|
3830
|
+
balanceCheck = {
|
|
3831
|
+
state: 'failed',
|
|
3832
|
+
reason: 'call-failed',
|
|
3833
|
+
detail: String(err && err.message ? err.message : err),
|
|
3834
|
+
at: nowMs(),
|
|
3835
|
+
}
|
|
3836
|
+
say(balanceLine(balanceCheck))
|
|
3837
|
+
return balanceCheck
|
|
3838
|
+
})
|
|
3839
|
+
}
|
|
3840
|
+
|
|
3258
3841
|
const updateLine = (res) => {
|
|
3259
3842
|
if (res.state === 'available') return pick(LINES.updateAvailable) + res.latest
|
|
3260
3843
|
if (res.state === 'current') return pick(LINES.updateCurrent)
|
|
3844
|
+
/* 失败要说清是哪一种:没有通道 / 连不上 / 宿主没应答。
|
|
3845
|
+
`no-web-service` 是"这个壳根本没有联网入口",不是"网络不好"——
|
|
3846
|
+
以前两者共用一句"没查到更新",于是诊断只能靠猜。 */
|
|
3847
|
+
if (res.state === 'unsupported' || res.reason === 'no-web-service') return pick(LINES.updateNoChannel)
|
|
3848
|
+
if (res.reason === 'call-failed') return pick(LINES.updateNoHost)
|
|
3261
3849
|
return pick(LINES.updateFailed)
|
|
3262
3850
|
}
|
|
3263
3851
|
|
|
@@ -3323,6 +3911,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
3323
3911
|
startFocus,
|
|
3324
3912
|
stopFocus,
|
|
3325
3913
|
saySummary,
|
|
3914
|
+
checkBalance,
|
|
3326
3915
|
get today() { return { ...watchToday() } },
|
|
3327
3916
|
get focus() { return focusState() },
|
|
3328
3917
|
openAbout: () => aboutDialog(),
|
|
@@ -3417,6 +4006,21 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
3417
4006
|
error: { selector: ERROR_SELECTOR, matches: probe(ERROR_SELECTOR) },
|
|
3418
4007
|
},
|
|
3419
4008
|
dark: !!(body && body.hasAttribute('data-ds-dark-theme')),
|
|
4009
|
+
/* 余额:最后一次查的结果 + 有没有 host 座位。**凭据从不经过这里** ——
|
|
4010
|
+
插件拿不到 key,也就不可能被谁从 doctor() 里读走。 */
|
|
4011
|
+
balance: Object.assign({ hostSeat: hostSeat() !== null }, balanceCheck),
|
|
4012
|
+
/* 动作层的实时状态。姿势角是**屏幕坐标**里的角度(未乘镜像),
|
|
4013
|
+
accent 是当下挂着的一次性动作 —— "她为什么歪着/弹了一下"
|
|
4014
|
+
在 Console 里一眼能看出来,不用去读样式。 */
|
|
4015
|
+
motion: {
|
|
4016
|
+
level: cfg.motion,
|
|
4017
|
+
amp: amp(),
|
|
4018
|
+
reduced: reduced(),
|
|
4019
|
+
tilt: Math.round(tiltScreen * 100) / 100,
|
|
4020
|
+
tiltLocal: tiltWritten,
|
|
4021
|
+
accent: root.dataset.accent || null,
|
|
4022
|
+
pressed: root.dataset.dragging === 'true',
|
|
4023
|
+
},
|
|
3420
4024
|
tokens,
|
|
3421
4025
|
/* 窗口背景:Mica 能不能露出来,取决于页面有没有在背景处画不透明像素。
|
|
3422
4026
|
blockers 是"每个采样点上最上面那个铺满视口的画底色的元素",
|
|
@@ -3454,7 +4058,10 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
3454
4058
|
},
|
|
3455
4059
|
streak: streakOf(memory.days),
|
|
3456
4060
|
/* 语言判定的输入与结果 —— 中英文走岔时能一眼看清是哪一层不对 */
|
|
3457
|
-
lang: {
|
|
4061
|
+
lang: {
|
|
4062
|
+
tag: LANG_TAG, zh: isZhNow(), choice: (cfg && typeof cfg.lang === 'string') ? cfg.lang : 'auto',
|
|
4063
|
+
stored: langStored, html: langHtml, pools: Object.keys(LINES_EN).length,
|
|
4064
|
+
},
|
|
3458
4065
|
awaySince: Math.round(awayAt),
|
|
3459
4066
|
/* 今天记了什么 —— 不用猜"她为什么说今天跑了 7 轮" */
|
|
3460
4067
|
today: { ...watchToday() },
|
|
@@ -3516,6 +4123,8 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
3516
4123
|
}
|
|
3517
4124
|
window.removeEventListener('pointermove', onMove)
|
|
3518
4125
|
window.removeEventListener('pointerup', onUp)
|
|
4126
|
+
window.removeEventListener('pointermove', leanToPointer)
|
|
4127
|
+
window.removeEventListener('blur', resetTilt)
|
|
3519
4128
|
bodyEl.removeEventListener('pointerdown', onDown)
|
|
3520
4129
|
bodyEl.removeEventListener('keydown', onBodyKey)
|
|
3521
4130
|
bodyEl.removeEventListener('contextmenu', onContext)
|