1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
|
// ShaderToy conversion template for 64k demo project
// TODO: Paste ShaderToy mainImage() function below and adapt
@group(0) @binding(0) var smplr: sampler;
@group(0) @binding(1) var txt: texture_2d<f32>;
#include "common_uniforms"
@group(0) @binding(2) var<uniform> uniforms: CommonUniforms;
// TODO: Define your effect parameters (must match C++ struct)
struct ShaderToyParams {
param1: f32,
param2: f32,
_pad0: f32,
_pad1: f32,
}
@group(0) @binding(3) var<uniform> params: ShaderToyParams;
// Standard fullscreen triangle vertex shader
@vertex fn vs_main(@builtin(vertex_index) i: u32) -> @builtin(position) vec4<f32> {
var pos = array<vec2<f32>, 3>(
vec2<f32>(-1.0, -1.0),
vec2<f32>(3.0, -1.0),
vec2<f32>(-1.0, 3.0)
);
return vec4<f32>(pos[i], 0.0, 1.0);
}
// ============================================================================
// PASTE SHADERTOY CODE HERE
// ============================================================================
// ShaderToy → WGSL conversion notes:
//
// 1. Replace ShaderToy uniforms:
// iResolution.xy → uniforms.resolution
// iTime → uniforms.time
// fragCoord → p.xy (from @builtin(position))
// fragColor → return value
//
// 2. Coordinate conversion:
// vec2 uv = fragCoord / iResolution.xy;
// becomes:
// let uv = p.xy / uniforms.resolution;
//
// 3. Type syntax changes:
// float → f32
// vec2/vec3/vec4 → vec2<f32>, vec3<f32>, vec4<f32>
// mat2/mat3/mat4 → mat2x2<f32>, mat3x3<f32>, mat4x4<f32>
//
// 4. Function syntax:
// float foo(vec2 p) → fn foo(p: vec2<f32>) -> f32
//
// 5. Common functions (mostly same):
// mix, sin, cos, length, normalize, dot, cross, etc.
// fract() → fract()
// mod(x, y) → x % y OR x - y * floor(x / y)
//
// 6. Texture sampling:
// texture(iChannel0, uv) → textureSample(txt, smplr, uv)
//
// 7. Variable declarations:
// float x = 1.0; → var x: f32 = 1.0; OR let x = 1.0;
// const float x = 1.0; → const x: f32 = 1.0;
//
// 8. Swizzling is the same: col.rgb, uv.xy, etc.
//
// ============================================================================
@fragment fn fs_main(@builtin(position) p: vec4<f32>) -> @location(0) vec4<f32> {
// TODO: Paste and adapt ShaderToy mainImage() body here
// Example coordinate setup (typical ShaderToy pattern):
let uv = p.xy / uniforms.resolution;
// TODO: Your effect code here
var col = vec3<f32>(uv.x, uv.y, 0.5);
// Optional: Sample previous frame
// var prev_col = textureSample(txt, smplr, uv);
// Optional: Audio reactivity
// col *= 1.0 + uniforms.audio_intensity * 0.2;
// Optional: Beat sync
// col *= 1.0 + uniforms.beat * 0.1;
return vec4<f32>(col, 1.0);
}
|
