🎛️ - Your PRs are always welcome! Accepting anything that extends vanilla shadertoy.com functionality.
This extension just includes:
- A firefox/chromium extension to easily preview your shadertoy.com shaders on 3D objects.
- Free, public-domain/CC0-1.0, opensource.
- New button to trigger 3D preview
- This add-on injects JavaScript into https://shadertoy.com pages so it can add new UX and features.
- Powered by popular open-source libs THREE.js and Camera-Controls.
- Under the hood it uses the the THREE.CanvasTexture to easily map the live-rendered shader onto 3D objects.
git clone [email protected]:SoundSafari/ShaderBalls.git
cd Shaderballs
npm install
To run the shaderballs extension:
- Install the
web-ext
tool. At the command line, open the ShaderBall's folder and type
web-ext run
. This launches Firefox and installs the extension automatically. This tool provides some additional development features, such as automatic reloading.
Or..
- Open Firefox and load the
about:debugging
page. Click Load Temporary Add-on and select themanifest.json
file within the ShaderBalls folder. Here is a video that demonstrates how to do this.
git clone [email protected]:SoundSafari/ShaderBalls.git
cd Shaderballs
npm install
- In your browser navigate to
chrome://extensions
. - Enable developer-mode (top-right).
- Load unpacked extension button > select the ShaderBalls folder.
For chrome, each time you make a code update, you'll need to manually refresh the extension from the chrome://extensions
page and refresh any active tab(s) that were running ShaderBalls.