60 lines
1.2 KiB
Markdown
60 lines
1.2 KiB
Markdown
# Bitfielder
|
|
|
|
A minimalist live shader editor for bitfield patterns.
|
|
|
|
## Features
|
|
|
|
- **Live coding** - Real-time shader compilation and rendering
|
|
- **Performance controls** - Adjustable FPS (15/30/60) and resolution scaling
|
|
- **Shader library** - Save, search, and organize shaders
|
|
- **Live performance mode** - Minimal UI for fullscreen presentations
|
|
- **URL sharing** - Share shaders via encoded URLs
|
|
|
|
## Installation
|
|
|
|
```bash
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
## Usage
|
|
|
|
### Basic Controls
|
|
|
|
- **Ctrl+Enter** - Execute shader code
|
|
- **H** - Toggle minimal UI mode
|
|
- **F11** - Fullscreen
|
|
- **R** - Random shader
|
|
- **M** - Cycle value modes
|
|
- **S** - Share URL
|
|
|
|
### Shader Variables
|
|
|
|
- `x, y` - Pixel coordinates
|
|
- `t` - Time (enables animation)
|
|
- `i` - Pixel index
|
|
|
|
### Operators
|
|
|
|
- `^ & |` - XOR, AND, OR
|
|
- `<< >>` - Bit shift
|
|
- `+ - * / %` - Math operations
|
|
|
|
### Library
|
|
|
|
Hover the right edge of the screen to access the shader library. Save shaders with custom names and search through your collection.
|
|
|
|
## Examples
|
|
|
|
```javascript
|
|
x^y // Basic XOR pattern
|
|
(x*y)%256 // Multiplication pattern
|
|
(x+y+t*10)%256 // Animated pattern
|
|
((x>>4)^(y>>4))<<4 // Bit-shifted XOR
|
|
```
|
|
|
|
## Build
|
|
|
|
```bash
|
|
npm run build
|
|
``` |