A web-based remake of the Windows 3D Pipes screensaver (3D Pipes.scr or sspipes.scr) using Three.js
Includes both Utah Teapots and candy cane easter eggs! (with increased chances 😏)
(This screen capture GIF is outdated. It now operates on a global grid, and avoids collisions.)
Add back smooth fade out as an option, now that a dissolve effect is implemented
Add control for speed
Animate sections into existence, emulating CPU graphics where the triangles were drawn progressively and the screen updated in between "frames" (optionally)
Improve lighting (the original was less shiny), or at least avoid unflattering camera angles
Use a palette (what palette? please help with this)
Extra camera functions like continuous rotation, maybe even following the pipes like a rollercoaster
Allow moving camera during dissolve transition (it's kinda unpleasant how it stops you (abruptly), and the effect is implemented as an overlay anyways)
Save options to local storage, or maybe in the URL
Custom textures with drag and drop (and also a file input) (can accept multiple textures, for it to choose from randomly (pulling from a bag and not replacing them))
Proper elbow joints (currently uses a sphere (smaller than the ball joint so it doesn't stick out) rather than a section of a torus); could use spline extrusion rather than trying to align a torus section every which way (if it actually helps)
Implement different behavioral characteristics between pipes
Update README GIF
An API maybe?
MIT-licensed; see LICENSE for details
You just need an HTTP server, but Live Server is a great option, automatically reloading when you make changes.
Prettier is used for code formatting.
To set up, including a pre-commit hook:
npm iin the project directory
A pre-commit hook can be surprising tho; formatting on save might be better...
The source code for the original OpenGL screensavers can be found in a version of the Windows SDK (for Windows NT 4.0), in
(If you have a later version of the code, please let me know.)
All the good stuff is in