dsh-wisp 1.30.0 → 1.32.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 +88 -0
- package/lib/client.js +378 -46
- package/lib/client.template.js +378 -46
- package/package.json +1 -1
- package/tools/smoke.mjs +1 -1
- package/verify-wisp.mjs +287 -39
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.32.0'
|
|
55
55
|
|
|
56
56
|
/* 每一版一句话。**必须写当前版本** —— 预检里有一条断言盯着它,
|
|
57
57
|
忘了更新就会红,不会静默过期。 */
|
|
@@ -71,6 +71,8 @@ const WHATS_NEW = {
|
|
|
71
71
|
'1.28.0': '菜单分成折叠分组,另外多了「关于她」和「动作一览」两个弹窗。',
|
|
72
72
|
'1.29.0': '夜深了她会劝你去睡;你走开再回来她记得;连续来了几天她也记着。',
|
|
73
73
|
'1.30.0': '会陪你专注计时了;页面藏起来时她会安静下来,不再空转。',
|
|
74
|
+
'1.31.0': '菜单重做:状态一目了然,开关是开关,大小能直接拖。',
|
|
75
|
+
'1.32.0': '分组改成鼠标悬停就展开、移开就收起(点一下则是钉住)。',
|
|
74
76
|
}
|
|
75
77
|
|
|
76
78
|
/* 更新这件事**这个插件自己做不到**,如实写在代码里,免得以后有人以为能:
|
|
@@ -638,10 +640,33 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
638
640
|
.wisp-root[data-mood="attn"] .wisp-body{animation-name:wisp-nudge;animation-duration:1.5s;animation-iteration-count:4}
|
|
639
641
|
@keyframes wisp-nudge{0%,100%{transform:translate3d(0,0,0)}25%{transform:translate3d(-7px,0,0)}75%{transform:translate3d(7px,0,0)}}
|
|
640
642
|
@keyframes wisp-hop{0%,100%{transform:translate3d(0,0,0)}45%{transform:translate3d(0,-16px,0)}}
|
|
641
|
-
.wisp-menu{position:absolute;min-width:
|
|
643
|
+
.wisp-menu{position:absolute;min-width:198px;max-width:240px;padding:6px;border-radius:12px;font-size:12px;line-height:1.25;color:var(--dsw-alias-label-primary,var(--wisp-say-fg));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));box-shadow:0 12px 34px rgba(0,0,0,.3);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);pointer-events:auto;animation:wisp-menu .14s ease}
|
|
642
644
|
.wisp-menu-item{display:block;width:100%;padding:7px 10px;border:0;border-radius:7px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;white-space:nowrap}
|
|
643
645
|
.wisp-menu-item:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.22))}
|
|
644
|
-
.wisp-menu-head{padding:
|
|
646
|
+
.wisp-menu-head{padding:5px 9px 7px}
|
|
647
|
+
.wisp-menu-title{font-size:12.5px;font-weight:600}
|
|
648
|
+
.wisp-menu-sub{font-size:10.5px;opacity:.6;margin-top:1px}
|
|
649
|
+
.wisp-menu-sep{height:1px;margin:4px 6px;background:var(--dsw-alias-border-l1,var(--wisp-say-line));opacity:.45}
|
|
650
|
+
.wisp-menu-hint{padding:5px 9px 3px;font-size:10.5px;opacity:.45}
|
|
651
|
+
.wisp-menu-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
|
|
652
|
+
.wisp-menu-sum{flex:0 1 auto;min-width:0;font-size:11px;opacity:.55;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
|
653
|
+
.wisp-menu-item[data-accent="true"]{font-weight:600;color:var(--dsw-alias-brand-primary,inherit)}
|
|
654
|
+
.wisp-menu-item[data-muted="true"]{opacity:.78}
|
|
655
|
+
.wisp-switch{flex:0 0 auto;width:26px;height:14px;border-radius:8px;background:rgba(140,160,190,.35);position:relative;transition:background .15s ease}
|
|
656
|
+
.wisp-switch[data-on="true"]{background:var(--dsw-alias-brand-primary,#4a7cf7)}
|
|
657
|
+
.wisp-switch i{position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:50%;background:#fff;transition:transform .15s ease}
|
|
658
|
+
.wisp-switch[data-on="true"] i{transform:translateX(12px)}
|
|
659
|
+
.wisp-slider-row{padding:6px 10px 8px}
|
|
660
|
+
.wisp-slider-top{display:flex;justify-content:space-between;font-size:11px;opacity:.8;margin-bottom:3px}
|
|
661
|
+
.wisp-slider{position:relative;height:16px;cursor:pointer;outline:none;touch-action:none}
|
|
662
|
+
.wisp-slider-track{position:absolute;left:0;right:0;top:7px;height:3px;border-radius:2px;background:rgba(140,160,190,.35)}
|
|
663
|
+
.wisp-slider-fill{position:absolute;left:0;top:7px;height:3px;border-radius:2px;background:var(--dsw-alias-brand-primary,#4a7cf7)}
|
|
664
|
+
.wisp-slider-knob{position:absolute;top:3px;width:11px;height:11px;margin-left:-5px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35)}
|
|
665
|
+
.wisp-slider:focus-visible .wisp-slider-knob{outline:2px solid var(--dsw-alias-brand-primary,#4a7cf7);outline-offset:1px}
|
|
666
|
+
.wisp-grid2{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:2px 8px 4px}
|
|
667
|
+
.wisp-grid2 button,.wisp-corner{padding:6px 4px;border:1px solid transparent;border-radius:7px;background:none;color:inherit;font:inherit;font-size:11px;cursor:pointer}
|
|
668
|
+
.wisp-grid2 button:hover,.wisp-corner:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.22))}
|
|
669
|
+
.wisp-grid2 button[data-current="true"],.wisp-corner[data-current="true"]{border-color:var(--dsw-alias-brand-primary,#4a7cf7);font-weight:600}
|
|
645
670
|
.wisp-root[data-hidden="true"]{display:none}
|
|
646
671
|
.wisp-tab{position:absolute;width:56px;height:56px;padding:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:16px;border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));box-shadow:0 6px 18px rgba(0,0,0,.22);cursor:pointer;pointer-events:auto;animation:wisp-menu .16s ease;transition:transform .16s ease}
|
|
647
672
|
.wisp-tab:hover{transform:translateY(-2px)}
|
|
@@ -664,6 +689,8 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
664
689
|
.wisp-cell:hover{border-color:var(--dsw-alias-border-l1,var(--wisp-say-line));background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.18))}
|
|
665
690
|
.wisp-cell img{width:100%;height:52px;object-fit:contain;object-position:bottom center;pointer-events:none}
|
|
666
691
|
.wisp-credits{font-size:11px;opacity:.8;margin:6px 0 0}
|
|
692
|
+
.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}
|
|
693
|
+
.wisp-dialog-action:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.2))}
|
|
667
694
|
@media (prefers-reduced-motion:reduce){.wisp-body{animation:none!important}}`
|
|
668
695
|
|
|
669
696
|
const installStyles = (styles) => {
|
|
@@ -1936,12 +1963,67 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
1936
1963
|
/* 折叠分组要"在原地重开",所以记住这次的落点 */
|
|
1937
1964
|
let menuAtX = 0
|
|
1938
1965
|
let menuAtY = 0
|
|
1966
|
+
/* 悬停展开的延迟:鼠标路过一行就展开会抖(hover intent),
|
|
1967
|
+
关闭的宽限更长一点 —— 斜着往子项移动时才不会中途收起。 */
|
|
1968
|
+
const HOVER_OPEN_MS = 140
|
|
1969
|
+
const HOVER_CLOSE_MS = 260
|
|
1970
|
+
/* 点开的组会被"钉住":鼠标移开也不关。悬停是预览,点击是决定。 */
|
|
1971
|
+
let pinnedGroup = ''
|
|
1972
|
+
let groupOpenTimer = null
|
|
1973
|
+
let groupCloseTimer = null
|
|
1974
|
+
/* 判断"焦点是否在这一组里"不能笼统地看"焦点是否在菜单里" —— 菜单一打开焦点就在
|
|
1975
|
+
第一项上,那样写等于悬停收起永远不会触发。 */
|
|
1976
|
+
|
|
1977
|
+
const clearGroupTimers = () => {
|
|
1978
|
+
if (groupOpenTimer) { clock.cancel(groupOpenTimer); groupOpenTimer = null }
|
|
1979
|
+
if (groupCloseTimer) { clock.cancel(groupCloseTimer); groupCloseTimer = null }
|
|
1980
|
+
}
|
|
1981
|
+
/* 焦点是否在这**一组**里 —— 键盘用户正操作这一组时,鼠标移开不该把它收掉。
|
|
1982
|
+
焦点在别的行、或压根不在菜单里,都不该阻止收起。
|
|
1983
|
+
判法:从焦点向上走,遇到带 data-group-block 的祖先就算命中(不靠外部映射)。 */
|
|
1984
|
+
const focusInsideGroup = (name) => {
|
|
1985
|
+
let el = null
|
|
1986
|
+
try { el = document.activeElement } catch (e) { el = null }
|
|
1987
|
+
let hops = 0
|
|
1988
|
+
while (el && hops < 24) {
|
|
1989
|
+
if (el.dataset && el.dataset.groupBlock === name) return true
|
|
1990
|
+
el = el.parentNode || null
|
|
1991
|
+
hops++
|
|
1992
|
+
}
|
|
1993
|
+
return false
|
|
1994
|
+
}
|
|
1995
|
+
/* 悬停到一组:延迟后展开它,并解除别组的钉住(手风琴 —— 同时开两组会看不清)。 */
|
|
1996
|
+
const scheduleGroupOpen = (name) => {
|
|
1997
|
+
clearGroupTimers()
|
|
1998
|
+
if (activeGroup === name) return
|
|
1999
|
+
groupOpenTimer = clock.after(HOVER_OPEN_MS, () => {
|
|
2000
|
+
groupOpenTimer = null
|
|
2001
|
+
if (destroyed || menuEl === null) return
|
|
2002
|
+
pinnedGroup = ''
|
|
2003
|
+
activeGroup = name
|
|
2004
|
+
openMenu(menuAtX, menuAtY, true)
|
|
2005
|
+
})
|
|
2006
|
+
}
|
|
2007
|
+
const scheduleGroupClose = (name) => {
|
|
2008
|
+
clearGroupTimers()
|
|
2009
|
+
if (activeGroup !== name) return
|
|
2010
|
+
if (pinnedGroup === name) return // 点开的不随鼠标移开关闭
|
|
2011
|
+
groupCloseTimer = clock.after(HOVER_CLOSE_MS, () => {
|
|
2012
|
+
groupCloseTimer = null
|
|
2013
|
+
if (destroyed || menuEl === null) return
|
|
2014
|
+
if (pinnedGroup === name) return
|
|
2015
|
+
if (focusInsideGroup(name)) return // 键盘用户还在这一组里,别关
|
|
2016
|
+
activeGroup = ''
|
|
2017
|
+
openMenu(menuAtX, menuAtY, true)
|
|
2018
|
+
})
|
|
2019
|
+
}
|
|
1939
2020
|
|
|
1940
2021
|
const closeMenu = () => {
|
|
1941
2022
|
if (menuEl && menuEl.parentNode) menuEl.parentNode.removeChild(menuEl)
|
|
1942
2023
|
menuEl = null
|
|
1943
2024
|
menuButtons = []
|
|
1944
2025
|
menuFocusAt = -1
|
|
2026
|
+
clearGroupTimers()
|
|
1945
2027
|
if (menuOff) { menuOff(); menuOff = null }
|
|
1946
2028
|
}
|
|
1947
2029
|
|
|
@@ -2124,6 +2206,17 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2124
2206
|
|
|
2125
2207
|
const aboutDialog = () => {
|
|
2126
2208
|
const note = WHATS_NEW[VERSION]
|
|
2209
|
+
/* 菜单里那条「版本与更新」已经收掉了(版本号现在直接显示在菜单头部),
|
|
2210
|
+
所以检查更新必须有新的入口 —— 放在这里,上下文正合适。 */
|
|
2211
|
+
const checkBtn = document.createElement('button')
|
|
2212
|
+
checkBtn.className = 'wisp-dialog-action'
|
|
2213
|
+
checkBtn.setAttribute('type', 'button')
|
|
2214
|
+
checkBtn.textContent = '检查更新'
|
|
2215
|
+
checkBtn.addEventListener('click', (ev) => {
|
|
2216
|
+
ev.preventDefault()
|
|
2217
|
+
closeDialog()
|
|
2218
|
+
showUpdate()
|
|
2219
|
+
})
|
|
2127
2220
|
return openDialog('about', '关于她', [
|
|
2128
2221
|
para('DeepSeek娘 —— DSH 界面上的浮动桌宠。她会跟着你的状态换表情:你打字她在忙,你闲着她在晃,你跑完一轮她替你高兴。'),
|
|
2129
2222
|
para('她的样子照社区规范来:深蓝色渐变长直发、头顶一个大圆环呆毛、两片鲸鳍耳、女仆装。'),
|
|
@@ -2131,16 +2224,39 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2131
2224
|
para('她还能陪你专注计时:菜单里开一段 25 或 45 分钟,期间她保持"干活中",戳她一下是问还剩多久,到点她替你收工。'),
|
|
2132
2225
|
para('这一版:' + (note || VERSION)),
|
|
2133
2226
|
para('形象与设定参考社区项目 Neko3000/deepseek-whalechan(设定文档 CC BY-NC-SA 4.0,原作者 B站 ZipZipPipe、上善无形)。'),
|
|
2227
|
+
checkBtn,
|
|
2134
2228
|
dialogFoot('非官方同人作品,与 DeepSeek 官方无关', 'v' + VERSION),
|
|
2135
2229
|
])
|
|
2136
2230
|
}
|
|
2137
2231
|
|
|
2138
|
-
/*
|
|
2232
|
+
/* 菜单的结构 ------------------------------------------------------------
|
|
2233
|
+
三段:**动作在上**(专注是最常用的,置顶)、**设置在中间**(三个可折叠分组 +
|
|
2234
|
+
大小滑块)、**信息在下**(动作一览 / 关于她)。每段之间有空行。
|
|
2235
|
+
分组的标题行直接显示当前状态(皮肤名 / 几个开关开着 / 哪个角落),
|
|
2236
|
+
所以收起时也知道里面是什么 —— 这是它和"一个写着外观的按钮"的区别。 */
|
|
2237
|
+
const onToggleCount = () => TOGGLES.filter((t) => cfg[t.key] === true).length
|
|
2238
|
+
const currentCorner = () => {
|
|
2239
|
+
const bw = boxW()
|
|
2240
|
+
const bh = boxH()
|
|
2241
|
+
const hit = CORNERS.find((c) => {
|
|
2242
|
+
const want = c.at(vw(), vh(), bw, bh, cfg)
|
|
2243
|
+
return Math.abs(want.x - coords.x) < 2 && Math.abs(want.y - coords.y) < 2
|
|
2244
|
+
})
|
|
2245
|
+
return hit ? hit.label : '自由'
|
|
2246
|
+
}
|
|
2139
2247
|
const menuItems = () => [
|
|
2140
|
-
{
|
|
2141
|
-
{
|
|
2248
|
+
{ kind: 'head' },
|
|
2249
|
+
{ kind: 'sep' },
|
|
2250
|
+
/* 专注:最常用的动作,放最上面;进行中时这一行本身就是状态 + 结束 */
|
|
2251
|
+
...(focusUntil > 0
|
|
2252
|
+
? [{ label: '专注中 · 还剩 ' + Math.max(1, Math.ceil(focusLeftMs() / 60000)) + ' 分钟', run: () => stopFocus(false), accent: true }]
|
|
2253
|
+
: [
|
|
2254
|
+
{ label: '专注 ' + cfg.focusMinutes + ' 分钟', run: () => startFocus(cfg.focusMinutes), accent: true },
|
|
2255
|
+
{ label: '专注 45 分钟', run: () => startFocus(45) },
|
|
2256
|
+
]),
|
|
2257
|
+
{ kind: 'sep' },
|
|
2142
2258
|
{
|
|
2143
|
-
group: '外观',
|
|
2259
|
+
group: '外观', summary: skinLabel(activeSkin),
|
|
2144
2260
|
children: [
|
|
2145
2261
|
...SKIN_IDS.map((id) => ({
|
|
2146
2262
|
label: (id === activeSkin ? '✓ ' : ' ') + skinLabel(id),
|
|
@@ -2157,26 +2273,27 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2157
2273
|
},
|
|
2158
2274
|
{
|
|
2159
2275
|
group: '行为',
|
|
2276
|
+
summary: onToggleCount() + '/' + TOGGLES.length + ' 开',
|
|
2160
2277
|
children: [
|
|
2161
2278
|
{ label: '说句话', run: () => { wake(true); say(pick(LINES.click)) } },
|
|
2162
2279
|
{ label: '睡一会儿', run: () => setMood('sleep') },
|
|
2163
|
-
|
|
2164
|
-
{
|
|
2165
|
-
/* 只有专注中才出现"结束专注" —— 平时的菜单不该多一个按不动的条目 */
|
|
2166
|
-
...(focusUntil > 0 ? [{ label: '结束专注', run: () => stopFocus(false) }] : []),
|
|
2167
|
-
...TOGGLES.map((t) => ({
|
|
2168
|
-
label: (cfg[t.key] === true ? '✓ ' : ' ') + t.label,
|
|
2169
|
-
run: () => applyConfig({ [t.key]: cfg[t.key] !== true }),
|
|
2170
|
-
})),
|
|
2280
|
+
/* 开关是**真正的开关行**:带 aria-checked,点完菜单不关(就在原地更新) */
|
|
2281
|
+
...TOGGLES.map((t) => ({ kind: 'switch', key: t.key, label: t.label })),
|
|
2171
2282
|
],
|
|
2172
2283
|
},
|
|
2173
2284
|
{
|
|
2174
2285
|
group: '位置',
|
|
2175
|
-
|
|
2286
|
+
summary: currentCorner(),
|
|
2287
|
+
children: [{ kind: 'corners' }],
|
|
2176
2288
|
},
|
|
2177
|
-
{
|
|
2289
|
+
{ kind: 'slider' },
|
|
2290
|
+
{ kind: 'sep' },
|
|
2291
|
+
{ label: '动作一览…', run: () => actionsDialog() },
|
|
2292
|
+
{ label: '关于她…', run: () => aboutDialog() },
|
|
2293
|
+
{ kind: 'sep' },
|
|
2178
2294
|
/* 一个开关,不是一个单向动作:从迷你按钮右键打开菜单时,它必须能把她叫回来。 */
|
|
2179
|
-
{ label: hidden ? '回来吧' : '先躲起来', run: () => setHidden(!hidden) },
|
|
2295
|
+
{ label: hidden ? '回来吧' : '先躲起来', run: () => setHidden(!hidden), muted: true },
|
|
2296
|
+
{ kind: 'hint' },
|
|
2180
2297
|
]
|
|
2181
2298
|
|
|
2182
2299
|
/* ---- 菜单的键盘驱动 ----
|
|
@@ -2215,7 +2332,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2215
2332
|
const openMenu = (x, y, keepGroup) => {
|
|
2216
2333
|
menuAtX = x
|
|
2217
2334
|
menuAtY = y
|
|
2218
|
-
if (keepGroup !== true) activeGroup = ''
|
|
2335
|
+
if (keepGroup !== true) { activeGroup = ''; pinnedGroup = '' }
|
|
2219
2336
|
closeMenu()
|
|
2220
2337
|
stopGlide()
|
|
2221
2338
|
const items = menuItems()
|
|
@@ -2224,13 +2341,16 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2224
2341
|
menu.className = 'wisp-menu'
|
|
2225
2342
|
menu.setAttribute('role', 'menu')
|
|
2226
2343
|
menu.style.position = 'absolute'
|
|
2227
|
-
let
|
|
2228
|
-
|
|
2344
|
+
let extras = 0
|
|
2345
|
+
/* 动作行:点了就执行、然后关菜单。 */
|
|
2346
|
+
const actionRow = (spec, into) => {
|
|
2229
2347
|
const btn = document.createElement('button')
|
|
2230
2348
|
btn.className = 'wisp-menu-item'
|
|
2231
2349
|
btn.setAttribute('type', 'button')
|
|
2232
2350
|
btn.setAttribute('role', 'menuitem')
|
|
2233
2351
|
btn.setAttribute('tabindex', '-1')
|
|
2352
|
+
if (spec.accent === true) btn.dataset.accent = 'true'
|
|
2353
|
+
if (spec.muted === true) btn.dataset.muted = 'true'
|
|
2234
2354
|
btn.textContent = spec.label
|
|
2235
2355
|
// 菜单自己吞掉 pointerdown,否则会被下面那个"点外面就关"的监听判成外部点击
|
|
2236
2356
|
btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
|
|
@@ -2239,26 +2359,202 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2239
2359
|
closeMenu()
|
|
2240
2360
|
try { spec.run() } catch (err) { /* 单个动作失败不该带塌整个菜单 */ }
|
|
2241
2361
|
})
|
|
2242
|
-
|
|
2362
|
+
into.appendChild(btn)
|
|
2243
2363
|
menuButtons.push(btn)
|
|
2244
2364
|
return btn
|
|
2245
2365
|
}
|
|
2366
|
+
|
|
2367
|
+
/* 开关行:真开关的样子 + role=menuitemcheckbox + aria-checked。
|
|
2368
|
+
点完**不关菜单** —— 拨开关时菜单消失是最烦人的交互之一。 */
|
|
2369
|
+
const switchRow = (spec, into) => {
|
|
2370
|
+
const on = cfg[spec.key] === true
|
|
2371
|
+
const btn = document.createElement('button')
|
|
2372
|
+
btn.className = 'wisp-menu-item wisp-menu-row'
|
|
2373
|
+
btn.setAttribute('type', 'button')
|
|
2374
|
+
btn.setAttribute('role', 'menuitemcheckbox')
|
|
2375
|
+
btn.setAttribute('aria-checked', on ? 'true' : 'false')
|
|
2376
|
+
btn.setAttribute('tabindex', '-1')
|
|
2377
|
+
btn.dataset.switchKey = spec.key
|
|
2378
|
+
const label = document.createElement('span')
|
|
2379
|
+
label.textContent = spec.label
|
|
2380
|
+
const toggle = document.createElement('span')
|
|
2381
|
+
toggle.className = 'wisp-switch'
|
|
2382
|
+
toggle.dataset.on = on ? 'true' : 'false'
|
|
2383
|
+
toggle.appendChild(document.createElement('i'))
|
|
2384
|
+
btn.appendChild(label)
|
|
2385
|
+
btn.appendChild(toggle)
|
|
2386
|
+
btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
|
|
2387
|
+
btn.addEventListener('click', (ev) => {
|
|
2388
|
+
ev.preventDefault(); ev.stopPropagation()
|
|
2389
|
+
try { applyConfig({ [spec.key]: cfg[spec.key] !== true }) } catch (err) { /* ignore */ }
|
|
2390
|
+
/* 原地重画:开着的那一组保持开着,菜单不跳走 */
|
|
2391
|
+
openMenu(menuAtX, menuAtY, true)
|
|
2392
|
+
})
|
|
2393
|
+
into.appendChild(btn)
|
|
2394
|
+
menuButtons.push(btn)
|
|
2395
|
+
return btn
|
|
2396
|
+
}
|
|
2397
|
+
|
|
2398
|
+
/* 大小滑块:连续量就该直接拖,而不是一次次点"放大一点"。
|
|
2399
|
+
键盘也能调(←/→ 各 0.25 档)—— 所以它自己是可聚焦的。
|
|
2400
|
+
替身里没有布局,getBoundingClientRect 全是 0,所以宽度为 0 时用固定跨度兜底;
|
|
2401
|
+
测试一律走方向键那条路,不依赖像素。 */
|
|
2402
|
+
const sliderRow = (into) => {
|
|
2403
|
+
const SPEC = CONFIG_SPEC.size
|
|
2404
|
+
const row = document.createElement('div')
|
|
2405
|
+
row.className = 'wisp-slider-row'
|
|
2406
|
+
const top = document.createElement('div')
|
|
2407
|
+
top.className = 'wisp-slider-top'
|
|
2408
|
+
const name = document.createElement('span')
|
|
2409
|
+
name.textContent = '大小'
|
|
2410
|
+
const value = document.createElement('span')
|
|
2411
|
+
value.className = 'wisp-slider-value'
|
|
2412
|
+
value.dataset.sliderValue = '1'
|
|
2413
|
+
value.textContent = Math.round(cfg.size * 100) + '%'
|
|
2414
|
+
top.appendChild(name)
|
|
2415
|
+
top.appendChild(value)
|
|
2416
|
+
row.appendChild(top)
|
|
2417
|
+
const track = document.createElement('div')
|
|
2418
|
+
track.className = 'wisp-slider'
|
|
2419
|
+
track.setAttribute('role', 'slider')
|
|
2420
|
+
track.setAttribute('tabindex', '-1')
|
|
2421
|
+
track.setAttribute('aria-label', '大小')
|
|
2422
|
+
track.dataset.slider = '1'
|
|
2423
|
+
track.setAttribute('aria-valuemin', String(SPEC.lo))
|
|
2424
|
+
track.setAttribute('aria-valuemax', String(SPEC.hi))
|
|
2425
|
+
track.setAttribute('aria-valuenow', String(cfg.size))
|
|
2426
|
+
const bg = document.createElement('div')
|
|
2427
|
+
bg.className = 'wisp-slider-track'
|
|
2428
|
+
const fill = document.createElement('div')
|
|
2429
|
+
fill.className = 'wisp-slider-fill'
|
|
2430
|
+
const knob = document.createElement('div')
|
|
2431
|
+
knob.className = 'wisp-slider-knob'
|
|
2432
|
+
track.appendChild(bg)
|
|
2433
|
+
track.appendChild(fill)
|
|
2434
|
+
track.appendChild(knob)
|
|
2435
|
+
const paintSlider = () => {
|
|
2436
|
+
const ratio = clamp((cfg.size - SPEC.lo) / (SPEC.hi - SPEC.lo), 0, 1)
|
|
2437
|
+
fill.style.width = Math.round(ratio * 100) + '%'
|
|
2438
|
+
knob.style.left = Math.round(ratio * 100) + '%'
|
|
2439
|
+
value.textContent = Math.round(cfg.size * 100) + '%'
|
|
2440
|
+
track.setAttribute('aria-valuenow', String(cfg.size))
|
|
2441
|
+
}
|
|
2442
|
+
paintSlider()
|
|
2443
|
+
const setFromClientX = (clientX) => {
|
|
2444
|
+
let rect = { left: 0, width: 0 }
|
|
2445
|
+
try { rect = track.getBoundingClientRect() } catch (e) { rect = { left: 0, width: 0 } }
|
|
2446
|
+
const span = rect.width > 0 ? rect.width : 120
|
|
2447
|
+
const ratio = clamp((clientX - rect.left) / span, 0, 1)
|
|
2448
|
+
const next = Math.round((SPEC.lo + ratio * (SPEC.hi - SPEC.lo)) * 4) / 4
|
|
2449
|
+
applyConfig({ size: next })
|
|
2450
|
+
paintSlider()
|
|
2451
|
+
}
|
|
2452
|
+
track.addEventListener('pointerdown', (ev) => {
|
|
2453
|
+
ev.preventDefault(); ev.stopPropagation()
|
|
2454
|
+
setFromClientX(ev.clientX)
|
|
2455
|
+
const move = (e) => setFromClientX(e.clientX)
|
|
2456
|
+
const up = () => {
|
|
2457
|
+
window.removeEventListener('pointermove', move)
|
|
2458
|
+
window.removeEventListener('pointerup', up)
|
|
2459
|
+
}
|
|
2460
|
+
window.addEventListener('pointermove', move)
|
|
2461
|
+
window.addEventListener('pointerup', up)
|
|
2462
|
+
})
|
|
2463
|
+
row.appendChild(track)
|
|
2464
|
+
into.appendChild(row)
|
|
2465
|
+
menuButtons.push(track)
|
|
2466
|
+
extras++
|
|
2467
|
+
return track
|
|
2468
|
+
}
|
|
2469
|
+
|
|
2470
|
+
/* 四个角落用 2×2 的方位控件,而不是四个文字条目 —— 空间的事用空间的形式表达。 */
|
|
2471
|
+
const cornerGrid = (into) => {
|
|
2472
|
+
const grid = document.createElement('div')
|
|
2473
|
+
grid.className = 'wisp-grid2'
|
|
2474
|
+
for (const corner of CORNERS) {
|
|
2475
|
+
const b = document.createElement('button')
|
|
2476
|
+
b.className = 'wisp-corner'
|
|
2477
|
+
b.setAttribute('type', 'button')
|
|
2478
|
+
b.setAttribute('tabindex', '-1')
|
|
2479
|
+
b.dataset.corner = corner.label
|
|
2480
|
+
b.textContent = corner.label
|
|
2481
|
+
if (corner.label === currentCorner()) b.dataset.current = 'true'
|
|
2482
|
+
b.addEventListener('pointerdown', (ev) => ev.stopPropagation())
|
|
2483
|
+
b.addEventListener('click', (ev) => {
|
|
2484
|
+
ev.preventDefault(); ev.stopPropagation()
|
|
2485
|
+
closeMenu()
|
|
2486
|
+
try { goCorner(corner.label) } catch (err) { /* ignore */ }
|
|
2487
|
+
})
|
|
2488
|
+
grid.appendChild(b)
|
|
2489
|
+
menuButtons.push(b)
|
|
2490
|
+
}
|
|
2491
|
+
into.appendChild(grid)
|
|
2492
|
+
extras++
|
|
2493
|
+
}
|
|
2494
|
+
|
|
2495
|
+
const renderChildren = (children, into) => {
|
|
2496
|
+
for (const child of children) {
|
|
2497
|
+
if (child.kind === 'switch') { switchRow(child, into); continue }
|
|
2498
|
+
if (child.kind === 'corners') { cornerGrid(into); continue }
|
|
2499
|
+
actionRow(child, into)
|
|
2500
|
+
}
|
|
2501
|
+
}
|
|
2502
|
+
|
|
2246
2503
|
for (let i = 0; i < items.length; i++) {
|
|
2247
2504
|
const spec = items[i]
|
|
2505
|
+
if (spec.kind === 'head') {
|
|
2506
|
+
/* 头部:她是谁、哪一版、现在什么状态。不可聚焦 —— 它不是动作。 */
|
|
2507
|
+
const head = document.createElement('div')
|
|
2508
|
+
head.className = 'wisp-menu-head'
|
|
2509
|
+
const title = document.createElement('div')
|
|
2510
|
+
title.className = 'wisp-menu-title'
|
|
2511
|
+
title.textContent = 'DeepSeek娘'
|
|
2512
|
+
const subline = document.createElement('div')
|
|
2513
|
+
subline.className = 'wisp-menu-sub'
|
|
2514
|
+
const bits = ['v' + VERSION, skinLabel(activeSkin)]
|
|
2515
|
+
if (focusUntil > 0) bits.push('专注中')
|
|
2516
|
+
subline.textContent = bits.join(' · ')
|
|
2517
|
+
head.appendChild(title)
|
|
2518
|
+
head.appendChild(subline)
|
|
2519
|
+
menu.appendChild(head)
|
|
2520
|
+
extras++
|
|
2521
|
+
continue
|
|
2522
|
+
}
|
|
2523
|
+
if (spec.kind === 'sep') {
|
|
2524
|
+
const sep = document.createElement('div')
|
|
2525
|
+
sep.className = 'wisp-menu-sep'
|
|
2526
|
+
menu.appendChild(sep)
|
|
2527
|
+
extras++
|
|
2528
|
+
continue
|
|
2529
|
+
}
|
|
2530
|
+
if (spec.kind === 'hint') {
|
|
2531
|
+
const hint = document.createElement('div')
|
|
2532
|
+
hint.className = 'wisp-menu-hint'
|
|
2533
|
+
hint.textContent = '↑↓ 选择 · ←→ 调大小 · Esc 关闭'
|
|
2534
|
+
menu.appendChild(hint)
|
|
2535
|
+
extras++
|
|
2536
|
+
continue
|
|
2537
|
+
}
|
|
2538
|
+
if (spec.kind === 'slider') { sliderRow(menu); continue }
|
|
2248
2539
|
if (spec.header !== undefined) {
|
|
2249
2540
|
// 小标题是分组标签,不是菜单项 —— 不能被聚焦,否则键盘用户会停在一个按不动的东西上
|
|
2250
2541
|
const head = document.createElement('div')
|
|
2251
2542
|
head.className = 'wisp-menu-head'
|
|
2252
2543
|
head.textContent = spec.header
|
|
2253
2544
|
menu.appendChild(head)
|
|
2254
|
-
|
|
2545
|
+
extras++
|
|
2255
2546
|
continue
|
|
2256
2547
|
}
|
|
2257
2548
|
if (spec.group !== undefined) {
|
|
2258
|
-
/*
|
|
2549
|
+
/* 折叠分组:标题行 + (展开时的)子项,**包在同一个悬停区里**。
|
|
2550
|
+
这是悬停展开能做对的前提 —— 从标题移到子项不该算"移开",
|
|
2551
|
+
否则鼠标一动子菜单就没了(那是这类交互最常见的翻车点)。 */
|
|
2259
2552
|
const open = activeGroup === spec.group
|
|
2553
|
+
const block = document.createElement('div')
|
|
2554
|
+
block.className = 'wisp-menu-group'
|
|
2555
|
+
block.dataset.groupBlock = spec.group
|
|
2260
2556
|
const btn = document.createElement('button')
|
|
2261
|
-
btn.className = 'wisp-menu-item'
|
|
2557
|
+
btn.className = 'wisp-menu-item wisp-menu-row'
|
|
2262
2558
|
btn.setAttribute('type', 'button')
|
|
2263
2559
|
btn.setAttribute('role', 'menuitem')
|
|
2264
2560
|
btn.setAttribute('tabindex', '-1')
|
|
@@ -2268,44 +2564,58 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2268
2564
|
/* 文字直接写在按钮上,不拆成子 span:真 DOM 会汇总子节点的 textContent,
|
|
2269
2565
|
但简化 DOM(预检的替身)不会 —— 依赖那种汇总会让分组名在替身里变成空串。 */
|
|
2270
2566
|
btn.textContent = (open ? '▾ ' : '▸ ') + spec.group
|
|
2567
|
+
if (spec.summary !== undefined) {
|
|
2568
|
+
const sum = document.createElement('span')
|
|
2569
|
+
sum.className = 'wisp-menu-sum'
|
|
2570
|
+
sum.dataset.summary = '1'
|
|
2571
|
+
sum.textContent = spec.summary
|
|
2572
|
+
btn.appendChild(sum)
|
|
2573
|
+
}
|
|
2271
2574
|
btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
|
|
2272
2575
|
btn.addEventListener('click', (ev) => {
|
|
2273
2576
|
ev.preventDefault(); ev.stopPropagation()
|
|
2274
|
-
activeGroup
|
|
2577
|
+
if (activeGroup === spec.group && pinnedGroup === spec.group) {
|
|
2578
|
+
/* 已经点开过:再点一次收起 */
|
|
2579
|
+
pinnedGroup = ''
|
|
2580
|
+
activeGroup = ''
|
|
2581
|
+
} else {
|
|
2582
|
+
/* 点开 = 钉住:之后鼠标移开也不关(键盘、触屏、以及"我就想它开着"都靠这条) */
|
|
2583
|
+
pinnedGroup = spec.group
|
|
2584
|
+
activeGroup = spec.group
|
|
2585
|
+
}
|
|
2275
2586
|
openMenu(menuAtX, menuAtY, true)
|
|
2276
2587
|
})
|
|
2277
|
-
|
|
2588
|
+
/* 悬停展开 / 移开收起。pointerType 不为 mouse 的一律不管 ——
|
|
2589
|
+
触屏没有悬停,不判这个的话手指一碰就会莫名其妙展开。 */
|
|
2590
|
+
const isMouse = (ev) => !(ev && ev.pointerType && ev.pointerType !== 'mouse')
|
|
2591
|
+
block.addEventListener('pointerenter', (ev) => {
|
|
2592
|
+
if (!isMouse(ev)) return
|
|
2593
|
+
scheduleGroupOpen(spec.group)
|
|
2594
|
+
})
|
|
2595
|
+
block.addEventListener('pointerleave', (ev) => {
|
|
2596
|
+
if (!isMouse(ev)) return
|
|
2597
|
+
scheduleGroupClose(spec.group)
|
|
2598
|
+
})
|
|
2599
|
+
block.appendChild(btn)
|
|
2600
|
+
menu.appendChild(block)
|
|
2278
2601
|
menuButtons.push(btn)
|
|
2279
2602
|
if (!open) continue
|
|
2280
2603
|
const wrap = document.createElement('div')
|
|
2281
2604
|
wrap.className = 'wisp-menu-sub'
|
|
2282
|
-
|
|
2283
|
-
|
|
2284
|
-
|
|
2285
|
-
cb.setAttribute('type', 'button')
|
|
2286
|
-
cb.setAttribute('role', 'menuitem')
|
|
2287
|
-
cb.setAttribute('tabindex', '-1')
|
|
2288
|
-
cb.textContent = child.label
|
|
2289
|
-
cb.addEventListener('pointerdown', (ev) => ev.stopPropagation())
|
|
2290
|
-
cb.addEventListener('click', (ev) => {
|
|
2291
|
-
ev.preventDefault(); ev.stopPropagation()
|
|
2292
|
-
closeMenu()
|
|
2293
|
-
try { child.run() } catch (err) { /* 同上 */ }
|
|
2294
|
-
})
|
|
2295
|
-
wrap.appendChild(cb)
|
|
2296
|
-
menuButtons.push(cb)
|
|
2297
|
-
}
|
|
2298
|
-
menu.appendChild(wrap)
|
|
2605
|
+
renderChildren(spec.children, wrap)
|
|
2606
|
+
/* 子项进 block(悬停区),不是直接进 menu */
|
|
2607
|
+
block.appendChild(wrap)
|
|
2299
2608
|
continue
|
|
2300
2609
|
}
|
|
2301
|
-
|
|
2610
|
+
actionRow(spec, menu)
|
|
2302
2611
|
}
|
|
2612
|
+
|
|
2303
2613
|
// 先挂上去再定位:定位要用最终尺寸,而尺寸只有渲染后才知道
|
|
2304
2614
|
layer.appendChild(menu)
|
|
2305
2615
|
menuEl = menu
|
|
2306
2616
|
const w = MENU_W
|
|
2307
2617
|
// 高度只用于夹取落点,所以按**实际渲染出来的行数**估算即可(假 DOM 里没有布局可测)
|
|
2308
|
-
const hs = MENU_PAD +
|
|
2618
|
+
const hs = MENU_PAD + extras * 24 + menuButtons.length * MENU_ITEM_H
|
|
2309
2619
|
menu.style.left = Math.round(clamp(x, 8, Math.max(8, vw() - w - 8))) + 'px'
|
|
2310
2620
|
menu.style.top = Math.round(clamp(y, 8, Math.max(8, vh() - hs - 8))) + 'px'
|
|
2311
2621
|
|
|
@@ -2317,6 +2627,28 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
|
|
|
2317
2627
|
return
|
|
2318
2628
|
}
|
|
2319
2629
|
if (menuButtons.length === 0) return
|
|
2630
|
+
/* 焦点在滑块上:←/→ 调大小,不移动焦点(这是滑块的常规键盘交互)。 */
|
|
2631
|
+
const focused = menuFocusAt >= 0 ? menuButtons[menuFocusAt] : null
|
|
2632
|
+
if (focused && focused.dataset && focused.dataset.slider === '1'
|
|
2633
|
+
&& (ev.key === 'ArrowLeft' || ev.key === 'ArrowRight')) {
|
|
2634
|
+
if (typeof ev.preventDefault === 'function') ev.preventDefault()
|
|
2635
|
+
const step = ev.shiftKey ? 1 : 0.25
|
|
2636
|
+
applyConfig({ size: cfg.size + (ev.key === 'ArrowRight' ? step : -step) })
|
|
2637
|
+
/* 只更新滑块自身,不重画整张菜单 —— 焦点和展开状态都不动 */
|
|
2638
|
+
try {
|
|
2639
|
+
const SPEC = CONFIG_SPEC.size
|
|
2640
|
+
const ratio = clamp((cfg.size - SPEC.lo) / (SPEC.hi - SPEC.lo), 0, 1)
|
|
2641
|
+
const knob = focused.querySelector('.wisp-slider-knob')
|
|
2642
|
+
const fill = focused.querySelector('.wisp-slider-fill')
|
|
2643
|
+
if (knob) knob.style.left = Math.round(ratio * 100) + '%'
|
|
2644
|
+
if (fill) fill.style.width = Math.round(ratio * 100) + '%'
|
|
2645
|
+
focused.setAttribute('aria-valuenow', String(cfg.size))
|
|
2646
|
+
const row = focused.parentNode
|
|
2647
|
+
const label = row && row.querySelector ? row.querySelector('[data-slider-value]') : null
|
|
2648
|
+
if (label) label.textContent = Math.round(cfg.size * 100) + '%'
|
|
2649
|
+
} catch (err) { /* 画不出来也不该挡住改大小 */ }
|
|
2650
|
+
return
|
|
2651
|
+
}
|
|
2320
2652
|
let at = menuFocusAt
|
|
2321
2653
|
if (ev.key === 'ArrowDown') at = at < 0 ? 0 : at + 1
|
|
2322
2654
|
else if (ev.key === 'ArrowUp') at = at < 0 ? menuButtons.length - 1 : at - 1
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "dsh-wisp",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.32.0",
|
|
4
4
|
"description": "DeepSeek娘 — an unofficial floating desktop companion for the DeepSeek Harness UI. Zero dependencies; sprites inlined as data URIs; schedules on the Client timer service instead of the trapped browser timer globals.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "lib/index.js",
|
package/tools/smoke.mjs
CHANGED
|
@@ -258,7 +258,7 @@ const skinCount = await page.evaluate(() => {
|
|
|
258
258
|
const s = window.__wisp.skins
|
|
259
259
|
return Array.isArray(s) ? s.length : Object.keys(s ?? {}).length
|
|
260
260
|
})
|
|
261
|
-
check(menu !== null && menu.items.length ===
|
|
261
|
+
check(menu !== null && menu.items.length === 8, 'the menu lists every entry',
|
|
262
262
|
`${menu?.items.length} items at the top level`)
|
|
263
263
|
|
|
264
264
|
// 键盘:打开即聚焦第一项,方向键移动,Esc 关闭并把焦点还给她
|