@aidget-community/deepseek-whale-pendant 0.1.0 → 0.2.1
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/agents.md +6 -3
- package/config.json +1 -0
- package/index.html +24 -12
- package/package.json +1 -1
package/agents.md
CHANGED
|
@@ -46,11 +46,14 @@
|
|
|
46
46
|
- `.pendant-shine` 内含 `.shine-spot`(径向柔光)与 `.shine-streak`(斜向高光带),位置由
|
|
47
47
|
`--mx` / `--my` 决定,整层被 `--sil` 遮罩限制在轮廓内,用 `mix-blend-mode: screen` 提亮,
|
|
48
48
|
`isolation: isolate` 防止溢出到透明区。
|
|
49
|
-
- `index.html`
|
|
50
|
-
`--
|
|
49
|
+
- `index.html` 末尾的内联脚本通过 `window.aidget.onPointer` 接收宿主 hover 事件;
|
|
50
|
+
`enter` / `move` 把 viewport 局部坐标写入 `--mx` / `--my` 并升到全亮,`leave` 回到
|
|
51
|
+
静止位 `(30%, 20%)`、亮度 `0.42`。不要改回 DOM `pointermove`,也不要在窗口 `blur`
|
|
52
|
+
时收掉高光,否则非活动窗口会失去跟随效果。
|
|
51
53
|
- `--shine` 初值必须保持 `0`:脚本未执行时挂件呈无高光降级态,截图里能否看到柔光也用来
|
|
52
54
|
判断脚本是否运行。
|
|
53
|
-
-
|
|
55
|
+
- 扫光动画使用 `window.aidget.requestAnimationFrame`,按经过时间插值;收敛后停止申请帧。
|
|
56
|
+
需要宿主提供该动画 API,不要改用 iframe 的原生帧时钟或增加常驻循环。
|
|
54
57
|
- `prefers-reduced-motion: reduce` 时脚本直接跳到目标值,不做插值跟随。
|
|
55
58
|
|
|
56
59
|
## 权限与外观
|
package/config.json
CHANGED
package/index.html
CHANGED
|
@@ -30,6 +30,7 @@
|
|
|
30
30
|
let pos = { ...REST };
|
|
31
31
|
let glow = { value: 0, target: IDLE_GLOW };
|
|
32
32
|
let running = false;
|
|
33
|
+
let previousTime = null;
|
|
33
34
|
|
|
34
35
|
function paint() {
|
|
35
36
|
root.style.setProperty('--mx', `${(pos.x * 100).toFixed(2)}%`);
|
|
@@ -37,11 +38,18 @@
|
|
|
37
38
|
root.style.setProperty('--shine', glow.value.toFixed(3));
|
|
38
39
|
}
|
|
39
40
|
|
|
40
|
-
function tick() {
|
|
41
|
-
const
|
|
41
|
+
function tick(timestamp) {
|
|
42
|
+
const elapsed =
|
|
43
|
+
previousTime === null
|
|
44
|
+
? 1000 / 60
|
|
45
|
+
: Math.min(100, Math.max(0, timestamp - previousTime));
|
|
46
|
+
previousTime = timestamp;
|
|
47
|
+
const ease = reduceMotion.matches ? 1 : 1 - Math.pow(0.82, elapsed / (1000 / 60));
|
|
42
48
|
pos.x += (target.x - pos.x) * ease;
|
|
43
49
|
pos.y += (target.y - pos.y) * ease;
|
|
44
|
-
glow.value +=
|
|
50
|
+
glow.value +=
|
|
51
|
+
(glow.target - glow.value) *
|
|
52
|
+
(reduceMotion.matches ? 1 : 1 - Math.pow(0.88, elapsed / (1000 / 60)));
|
|
45
53
|
paint();
|
|
46
54
|
const settled =
|
|
47
55
|
Math.abs(target.x - pos.x) < 0.002 &&
|
|
@@ -52,23 +60,24 @@
|
|
|
52
60
|
glow.value = glow.target;
|
|
53
61
|
paint();
|
|
54
62
|
running = false;
|
|
63
|
+
previousTime = null;
|
|
55
64
|
return;
|
|
56
65
|
}
|
|
57
|
-
requestAnimationFrame(tick);
|
|
66
|
+
window.aidget.requestAnimationFrame(tick);
|
|
58
67
|
}
|
|
59
68
|
|
|
60
69
|
function wake() {
|
|
61
70
|
if (!running) {
|
|
62
71
|
running = true;
|
|
63
|
-
requestAnimationFrame(tick);
|
|
72
|
+
window.aidget.requestAnimationFrame(tick);
|
|
64
73
|
}
|
|
65
74
|
}
|
|
66
75
|
|
|
67
|
-
function follow(
|
|
76
|
+
function follow(x, y) {
|
|
68
77
|
const rect = stage.getBoundingClientRect();
|
|
69
78
|
if (!rect.width || !rect.height) return;
|
|
70
|
-
target.x = clamp((
|
|
71
|
-
target.y = clamp((
|
|
79
|
+
target.x = clamp((x - rect.left) / rect.width, 0, 1);
|
|
80
|
+
target.y = clamp((y - rect.top) / rect.height, 0, 1);
|
|
72
81
|
glow.target = 1;
|
|
73
82
|
wake();
|
|
74
83
|
}
|
|
@@ -79,10 +88,13 @@
|
|
|
79
88
|
wake();
|
|
80
89
|
}
|
|
81
90
|
|
|
82
|
-
window.
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
91
|
+
window.aidget.onPointer((event) => {
|
|
92
|
+
if (event.type === 'leave') {
|
|
93
|
+
rest();
|
|
94
|
+
return;
|
|
95
|
+
}
|
|
96
|
+
follow(event.x, event.y);
|
|
97
|
+
});
|
|
86
98
|
document.addEventListener('visibilitychange', () => {
|
|
87
99
|
if (document.hidden) rest();
|
|
88
100
|
});
|