A lightweight static HTML5 demo for replaying prepared Water Sort solutions from Cocos guide pages.
This is a visual replay demo, not the full custom JSON solver. Choose a guide level, view the initial bottle layout, and step through the solution move by move.
The demo is designed for static hosting such as GitHub Pages, itch.io, Netlify, or any plain file host. It has no backend, CDN, or runtime dependency beyond local CSS and JavaScript files.
This demo uses real guide data from Cocos Water Sort walkthroughs. Each replay includes:
- Initial bottle layout
- Palette-aware bottle rendering
- Step-by-step solution replay
- Previous, Next, Play, Pause, and Reset controls
- Clickable move list
- Read-only level JSON
- Links back to the full Cocos guide and solver
demo-levels.js is already committed/generated for static deployment. The deployed demo does not need the data build script.
The data generator lives in the full local Cocos repo, not in this standalone demo package. It scans local guide source files for Water Sort share replay URLs, decodes the LZString payloads, normalizes bottles and palette data, runs the solver, validates the generated moves, and writes demo-levels.js.
If this folder is uploaded by itself to GitHub Pages, itch.io, Netlify, or another static host, do not regenerate the data there; use the included demo-levels.js.
Open index.html directly in your browser.
Or start a simple local static server:
python -m http.server 8080