demo_gsap API

Luna-Flow/geometry3d/demo_gsap 是面向 js 目标的浏览器可执行程序。它不导出任何 MoonBit 项；它的接口是它所需要的 HTML 页面，以及它用 GSAP SVG 后端构建的播放器。

构建与服务

just gsap-build   # moon build src/demo_gsap --target js, then copy files
just gsap-serve   # build, then serve target/gsap-demo on http://localhost:8081

gsap-build 把 src/demo_gsap/index.html 和编译得到的 demo_gsap.js（重命名为 demo.js）复制到 target/gsap-demo/。页面从 jsDelivr 加载 GSAP 3.13.0，设置 globalThis.gsap，然后导入 demo.js。

页面约定

geometry3d-svg

<svg id="geometry3d-svg"> 元素接收渲染出的多边形，尺寸为 640 × 480。

play-toggle, reverse, restart

这些按钮用于暂停或继续、反向播放以及重新开始时间轴。程序会把 play-toggle 的文字设为 PLAY 或 PAUSE。

progress, time-readout

范围输入 progress（0 到 1）显示并跳转时间轴位置；元素 time-readout 以 t / 8.00s 的形式显示时间。

demo-select

选择框用于选择场景：值 dolly 选择滑动变焦，其他任何值选择圆环。

speed, loop

speed 选择框设置播放速度因子，loop 复选框在无限重复与只播放一次之间切换。

如果缺少其中任何一个元素，程序会在启动时中止。

时间轴

时间轴长 8 秒，默认无限重复。每次更新都会按当前时间 $t$ 渲染所选场景。

圆环

圆环场景让 Canvas 演示中的圆环绕 $y$ 旋转 $1.8\,t$ 弧度（绕 $x$ 和 $z$ 分别为其 $0.7$ 和 $0.25$ 倍），相机距离 6.2 个单位，使用 35 mm 镜头。

滑动变焦

滑动变焦场景使用相机距离 $d(t) = 3.2 + 66.37 \cdot \tfrac12\big(1 + \sin(\pi t / 2)\big)$，因此每个 8 秒循环完成两个推拉周期。焦距为 $23 \cdot d / 3.2$ mm，立方体分别以 $1.23$、$1.71$ 和 $0.69$ rad/s 旋转。