DSH 桌宠 · Demo

右下角就是桌宠本体 —— 可以拖动、点一下会跳、鼠标悬停冒泡。下面的按钮切换它的数据源状态。

数据源

无数据源时只显示形象;接上 provider 后自动显示余额 / 本次消耗 / Tokens。

动作

模拟宿主页面的用量胶囊

桌宠会读取 [data-composer-stats] 里的文字作为 Tokens 一行。 DSH 网页版的输入框旁就有这个元素;下面这个就是照着它做的假数据。

给这段代码加个注释… 1,284 tokens · 上下文 6%

接入代码(就这么多)

<script src="src/pet.js"></script>
<script>
  DshPet.create({
    asset: 'assets/chibi-full.png',
    left: 10, bottom: 52,
    provider: async () => ({
      ok: true, balance: 42.5, currency: 'CNY',
      runSpent: 0.83, daySpent: 1.26
    })
  });
</script>
DSH 桌宠 · MIT License