tasks.md 2.0 KB
1. Change Scaffold and Shader Plan
- 1.1 Create the OpenSpec change artifacts for
dreamyFluidPanelComponentand document which parts of the reference demo are preserved versus removed. (Verifiable: proposal, design, tasks, and spec files exist under the new change directory.) - 1.2 Define a ground-panel implementation that uses a single plane mesh, independent length/width sizing, and component-scoped shader files. (Verifiable: the design documents describe the plane + shader architecture and default ground usage.)
2. Component and Shader Implementation
- 2.1 Add
src/components/dreamyFluidPanelComponent.vuewith safe prop clamping, shader material setup, and time-driven uniform updates. (Verifiable: the component renders through tresjs/three and updates over time without inline DOM effects.) - 2.2 Add
src/shader/dreamyFluidPanelComponent/panel.vertandpanel.fragto implement the hex/sequin tiling, layered waves, and specular flash composition. (Verifiable: shader source is externalized and imported by the component.) - 2.3 Remove interactive light behavior from the ported effect. (Verifiable: the component does not listen for pointer, touch, or click events to change the visual behavior.)
3. Service Integration
- 3.1 Register the component in
src/dcsConfig.tswith a preview asset, defaults, default object transform, and a concise config panel. (Verifiable: the component appears in the registry and can be tuned through the existing preview pipeline.) - 3.2 Add a preview asset under
public/preview/for the new component. (Verifiable: the preview path resolves to a local asset.)
4. Validation
- 4.1 Run
npm run buildand confirm the new component does not break the project build. (Verifiable: build completes successfully or only reports unrelated repository issues.) - 4.2 Update this task list to reflect completion state after implementation and validation. (Verifiable: completed items are checked in the change tasks file.)