30:T93d,viewof sandbox = textarea(`precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 90) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') //for (i = 0; i < 32 && |z| < 2; ++i) z = z^9 + c^6 //color = |z| * rgb(i/64, i/38, i/28) vec2 cmpxcjg(in vec2 c) { return vec2(c.x, -c.y); } vec2 cmpxmul(in vec2 a, in vec2 b) { return vec2(a.x * b.x - a.y * b.y, a.y * b.x + a.x * b.y); } vec2 cmpxpow(in vec2 c, int p) { for (int i = 0; i < 3; ++i) { if((i + 1) > p) break; c = cmpxmul(c, c); } return c; } vec2 cmpxdiv(in vec2 a, in vec2 b) { return cmpxmul(a, cmpxcjg(b)); } float cmpxmag(in vec2 c) { return sqrt(c.x * c.x + c.y * c.y); } vec2 doModel(vec3 p) { p.y += 0.1; //float r = 1.0 + noise(vec4(p, iGlobalTime)) * 0.25; vec2 z = vec2(0.0); vec2 c = p.xz * 10. - vec2(0.5, -0.11 + sin(iGlobalTime) / 100.0); float tot = 0.0; for(int i = 0; i < 28; i++) { z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); //z += cmpxpow(c, 6); if(length(z) > 20.0) break; tot += 1.0; } z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); tot += 1.0; z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); tot += 1.0; float modulus = sqrt(z.x * z.x + z.y * z.y); float mu = tot - (log(log(modulus)))/ log (2.0); tot = mu; float plane = p.y - 0.1 - log(mu) / 100.0; float sphere = length(p) - 0.3; float d = max(sphere, plane); float id = 0.0; //d -= tot / 10.0; return vec2(d, tot / 10.0); } void main() { vec3 color = vec3(0.0, 0.0, .5); vec3 ro, rd; float rotation = iGlobalTime / 10.0; float height = 0.1; float dist = 0.3; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); //color *= 100.0; //float tot = mod(t.y, 10.0); //float lz = floor(t.y / 10.0); //color = vec3(t.y, 0.0, 0.0); float dif = dot(nor, vec3(1.0, 0.5, 0.0)); color = color * dif + (1.0 - dif) * vec3(t.y, 0.0, 0.0); //color = nor * 0.5 + 0.5; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`)31:Tec6,americanFlag = `precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; #define time iGlobalTime #define resolution iResolution float sdBox( vec3 p, vec3 b ) { vec3 d = abs(p) - b; return min(max(d.x,max(d.y,d.z)),0.0) + length(max(d,0.0)); } float smin( float a, float b, float k ) { float h = clamp( 0.5+0.5*(b-a)/k, 0.0, 1.0 ); return mix( b, a, h ) - k*h*(1.0-h); } float sdTriPrism( vec3 p, vec2 h ) { vec3 q = abs(p); return max(q.z-h.y,max(q.x*0.866025+p.y*0.5,-p.y)-h.x*0.5); } vec2 rotate(vec2 v, float a) { float s = sin(a); float c = cos(a); mat2 m = mat2(c, -s, s, c); return m * v; } #define PI (3.14159) float scene(vec3 p) { if(p.x < 0.0 && p.y > 0.0) { p = mod(p, 4.0) - 2.0; float d1 = 100.0;//sdTriPrism(p, vec2(0.4, 0.4)); float off = 0.15 + sin(time) * 0.02; float s = 0.4; for(int i = 0; i < 5; i++) { p.xy = rotate(p.xy, 2.0 * PI / 5.0); d1 = min(d1, sdTriPrism(p + vec3(off, off, 0.0), vec2(s, s))); } return d1; }; const int iters = 10; float boxsize = (sin(time) * 0.5 + 0.5) * 0.1 + 2.0; float b2 = boxsize / 2.0; for(int i = 0; i < iters; i++) { if(p.x > b2) p.x = boxsize - p.x; else p.x = -boxsize - p.x; if(p.y > b2) p.y = boxsize - p.y; else p.y = -boxsize - p.y; if(p.z > b2) p.z = boxsize - p.z; else p.z = -boxsize - p.z; p *= -1.1; p += 1.0; } float sphere = length(p) - 1.0; float cube = sdBox(p - vec3(sin(clamp(tan(time) / 10.0, -100.0, 100.0)) * 2.0 + 2.0, 0.0, 0.0), vec3(0.1, 2.1, 1.0)); float d = smin(sphere, cube, 0.5); float j = length(p) * pow(float(iters), -1.1); return min(j, d); } vec3 calcNormal(vec3 pos, float eps) { const vec3 v1 = vec3( 1.0,-1.0,-1.0); const vec3 v2 = vec3(-1.0,-1.0, 1.0); const vec3 v3 = vec3(-1.0, 1.0,-1.0); const vec3 v4 = vec3( 1.0, 1.0, 1.0); return normalize( v1 * scene( pos + v1*eps ) + v2 * scene( pos + v2*eps ) + v3 * scene( pos + v3*eps ) + v4 * scene( pos + v4*eps )); } vec3 calcNormal(vec3 pos) { return calcNormal(pos, 0.002); } #define STEPS (50) #define MIN_DIST (0.001) bool raymarch(vec3 ro, vec3 rd, out vec3 hitPoint, out float minDist) { vec3 pos = ro; minDist = 100.0; for(int i = 0; i < STEPS; i++) { float dist = scene(pos); if(dist < MIN_DIST) { hitPoint = pos + rd * dist; return true; } pos += rd * dist; minDist = min(dist, minDist); } return false; } void main(void) { float aspect = resolution.x / resolution.y; vec2 uv = -1.0 + 2.0 * gl_FragCoord.xy / resolution.xy; uv.x *= aspect; vec3 rayOrigin = vec3(0.0, 0.0, -4.0); vec3 rayDir = normalize(vec3(uv, 1.0)); vec3 hitPos; vec3 color = uv.x < 0.0 && uv.y > 0.0 ? vec3(0.0, 0.0, 0.8) : vec3(1.0); vec3 strokeColor = uv.x < 0.0 && uv.y > 0.0 ? vec3(1.0) : vec3(0.0); float minDist = 100.0; // minimum distance to surface encountered if(raymarch(rayOrigin, rayDir, hitPos, minDist)) { // if hit surface vec3 nor = calcNormal(hitPos); vec3 light = vec3(-1.0, -1.0, 0.0); float diffuseIntesity = clamp(dot(nor, light), 0.0, 1.0); color = mix(vec3(1.0, 0.0, 0.0), // light colour vec3(0.0, 0.0, 0.9), // shadow colour diffuseIntesity); //color = nor * 0.5 + 0.5; } else if(minDist < 0.05) { // if near miss to surface color = strokeColor; } gl_FragColor = vec4(color, 1.0); }`32:T932,portalFractal = `precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 90) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') //for (i = 0; i < 32 && |z| < 2; ++i) z = z^9 + c^6 //color = |z| * rgb(i/64, i/38, i/28) vec2 cmpxcjg(in vec2 c) { return vec2(c.x, -c.y); } vec2 cmpxmul(in vec2 a, in vec2 b) { return vec2(a.x * b.x - a.y * b.y, a.y * b.x + a.x * b.y); } vec2 cmpxpow(in vec2 c, int p) { for (int i = 0; i < 3; ++i) { if((i + 1) > p) break; c = cmpxmul(c, c); } return c; } vec2 cmpxdiv(in vec2 a, in vec2 b) { return cmpxmul(a, cmpxcjg(b)); } float cmpxmag(in vec2 c) { return sqrt(c.x * c.x + c.y * c.y); } vec2 doModel(vec3 p) { p.y += 0.1; //float r = 1.0 + noise(vec4(p, iGlobalTime)) * 0.25; vec2 z = vec2(0.0); vec2 c = p.xz * 10. - vec2(0.5, -0.11 + sin(iGlobalTime) / 100.0); float tot = 0.0; for(int i = 0; i < 28; i++) { z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); //z += cmpxpow(c, 6); if(length(z) > 20.0) break; tot += 1.0; } z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); tot += 1.0; z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); tot += 1.0; float modulus = sqrt(z.x * z.x + z.y * z.y); float mu = tot - (log(log(modulus)))/ log (2.0); tot = mu; float plane = p.y - 0.1 - log(mu) / 100.0; float sphere = length(p) - 0.3; float d = max(sphere, plane); float id = 0.0; //d -= tot / 10.0; return vec2(d, tot / 10.0); } void main() { vec3 color = vec3(0.0, 0.0, .5); vec3 ro, rd; float rotation = iGlobalTime / 10.0; float height = 0.1; float dist = 0.3; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); //color *= 100.0; //float tot = mod(t.y, 10.0); //float lz = floor(t.y / 10.0); //color = vec3(t.y, 0.0, 0.0); float dif = dot(nor, vec3(1.0, 0.5, 0.0)); color = color * dif + (1.0 - dif) * vec3(t.y, 0.0, 0.0); //color = nor * 0.5 + 0.5; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`33:T8eb,edgeOfForestFractal = ` precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 90) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') //for (i = 0; i < 32 && |z| < 2; ++i) z = z^9 + c^6 //color = |z| * rgb(i/64, i/38, i/28) vec2 cmpxcjg(in vec2 c) { return vec2(c.x, -c.y); } vec2 cmpxmul(in vec2 a, in vec2 b) { return vec2(a.x * b.x - a.y * b.y, a.y * b.x + a.x * b.y); } vec2 cmpxpow(in vec2 c, int p) { for (int i = 0; i < 3; ++i) { if((i + 1) > p) break; c = cmpxmul(c, c); } return c; } vec2 cmpxdiv(in vec2 a, in vec2 b) { return cmpxmul(a, cmpxcjg(b)); } float cmpxmag(in vec2 c) { return sqrt(c.x * c.x + c.y * c.y); } vec2 doModel(vec3 p) { //float r = 1.0 + noise(vec4(p, iGlobalTime)) * 0.25; vec2 z = vec2(0.0); vec2 c = p.xz - vec2(1.15, -0.11 + sin(iGlobalTime) / 100.0); float tot = 0.0; for(int i = 0; i < 28; i++) { z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); //z += cmpxpow(c, 6); if(length(z) > 20.0) break; tot += 1.0; } z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); tot += 1.0; z = cmpxpow(z, 1) + c;// cmpxpow(c, 2); tot += 1.0; float modulus = sqrt(z.x * z.x + z.y * z.y); float mu = tot - (log(log(modulus)))/ log (2.0); tot = mu; float plane = p.y - 0.1 - log(mu) / 100.0; float sphere = length(p) - 5.0; float d = max(sphere, plane); float id = 0.0; //d -= tot / 10.0; return vec2(d, tot / 10.0); } void main() { vec3 color = vec3(0.0); vec3 ro, rd; float rotation = 0.4 ;// iGlobalTime / 10.0; float height = 0.2; float dist = 0.4; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); //color *= 100.0; //float tot = mod(t.y, 10.0); //float lz = floor(t.y / 10.0); color = vec3(t.y, 0.0, 0.0); //color = color * dot(nor, vec3(2.0, 1.0, 0.0)); //color = nor * 0.5 + 0.5; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`34:T794,peelFractal = ` precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 90) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') //for (i = 0; i < 32 && |z| < 2; ++i) z = z^9 + c^6 //color = |z| * rgb(i/64, i/38, i/28) vec2 cmpxcjg(in vec2 c) { return vec2(c.x, -c.y); } vec2 cmpxmul(in vec2 a, in vec2 b) { return vec2(a.x * b.x - a.y * b.y, a.y * b.x + a.x * b.y); } vec2 cmpxpow(in vec2 c, int p) { for (int i = 0; i < 6; ++i) { if((i + 1) > p) break; c = cmpxmul(c, c); } return c; } vec2 cmpxdiv(in vec2 a, in vec2 b) { return cmpxmul(a, cmpxcjg(b)); } float cmpxmag(in vec2 c) { return sqrt(c.x * c.x + c.y * c.y); } vec2 doModel(vec3 p) { //float r = 1.0 + noise(vec4(p, iGlobalTime)) * 0.25; float plane = p.y - 0.1; float sphere = length(p) - 5.0; float d = max(sphere, plane); float id = 0.0; vec2 z = vec2(0.0); vec2 c = p.xz; float tot = 0.0; for(int i = 0; i < 10; i++) { z = cmpxpow(z, 2) + cmpxpow(c, 2); //z += cmpxpow(c, 6); if(length(z) > 2.0) break; tot += 1.0; } d -= tot / 10.0; return vec2(d, tot + length(z) * 10.0); } void main() { vec3 color = vec3(0.0); vec3 ro, rd; float rotation = iGlobalTime / 10.0; float height = 1.0; float dist = 2.0; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); //color *= 100.0; float tot = mod(t.y, 10.0); float lz = floor(t.y / 10.0); color = lz * vec3(tot / 64.0, tot / 38.0, tot / 28.0); //color = nor * 0.5 + 0.5; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`35:Tbbf,backgroundSketch = ` precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 10) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') #pragma glslify: sdCylinder = require('glsl-sdf-primitives/sdCylinder') #pragma glslify: halftone = require('glsl-halftone') vec2 polar(vec2 cart) { return vec2(length(cart), atan(cart.y, cart.x)); } vec2 cart(vec2 pola) { return vec2(pola.x * cos(pola.y), pola.x * sin(pola.y)); } #define PI (3.14159) #define TAU (PI * 2.0) vec3 moda (vec2 p, float count) { float an = TAU/count; float a = atan(p.y,p.x)+an*.5; float c = floor(a/an); a = mod(a,an)-an*.5; c = mix(c,abs(c),step(count*.5,abs(c))); return vec3(vec2(cos(a),sin(a))*length(p),c); } vec3 polarRepeat(vec3 p, float count, float width) { vec3 p1 = moda(p.xz, count); p1.x -= width + 0.2 * sin(p1.z); p.xz = p1.xy; return p; } vec2 rotate(vec2 v, float a) { float s = sin(a); float c = cos(a); mat2 m = mat2(c, -s, s, c); return m * v; } vec2 twirl(vec3 p, float rot_offset, float r) { vec2 ppolar = polar(p.xy); float count = 4.0; // ppolar.y = mod(ppolar.y, rep) + rep * 0.5; //p.xy = cart(ppolar); p = polarRepeat(p, count, 0.5); p.xz = rotate(p.xz, r + 0.5 * p.y + rot_offset); float d = sdCylinder(p, vec3(1.0, 0.0, 0.1)); // d = length(p) - 0.7; float id = 0.0; return vec2(d, id); // return vec2(d, id); } vec2 doModel(vec3 p) { float r = 1.0 + noise(vec4(p, iGlobalTime)) * 0.15; vec2 o = vec2(twirl(p, 0.0, r).x, 0.0); vec3 op = p; for(int i = 0; i < 5; i++) { //p.xy = rotate(p.xy, op.y * float(i) / 5.0); vec2 t = twirl(p.xzy * (0.5 * float(i)), r * float(i) / 2.0, r) * (1.0/(0.5 * float(i))); o.x = min(t.x, o.x); } //vec2 first = twirl(p, 0.0); //vec2 second = twirl(p * 0.5, 1.0) * 2.0; //vec2 inner = twirl(p * 2.0, -2.0) * 0.5; //vec2 o = vec2(min(min(first.x, second.x), inner.x), 0.0); return o; } void main() { vec3 bg = vec3(0.0, 0.0, 0.5); vec3 color = bg; vec3 ro, rd; vec3 light = vec3(1.0, 1.0, 0.0); float rotation = iGlobalTime * 0.3; float height = 0.0; float dist = 7.0; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd); if (t.x > -1.0) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); color = nor * 0.5 + 0.5; float interp = dot(nor, light);//-pow(t.x / 8.0, 9.0); color = bg * (1.0 - interp) + color * interp; // color.rb *= 2.0; } color.rb *= 2.0; color = normalize(color); vec2 uv = gl_FragCoord.xy; color = halftone(color, uv); color = 1.0 - vec3(length(color)); //color.rb = polar((gl_FragCoord.xy / iResolution.xy) * 2.0 - 1.0); gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`36:T79f,explodeyBoxFractal = `precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 40) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') vec2 doModel(vec3 p) { float scale = 1.3; float DEfactor = scale; float fixedRadius = 5.95 + tan(iGlobalTime); vec3 x = p; vec3 cx = vec3(1.0, 0.0 + p.x * cos(iGlobalTime) * 1.0, -0.0 + p.y * cos(iGlobalTime) * 1.0); float fR2 = fixedRadius * fixedRadius; float minRadius = 0.5; float mR2 = minRadius * minRadius; for(int i = 0; i < 20; i++) { // box fold x = clamp(x, -1.0, 1.0) * 2.0 - x; /*if (x > 1.0) { x = 2.0 - x; } else if (x < -1.0) { x = -2.0 - x; } if (y > 1.0) { y = 2.0 - y; } else if (y < -1.0) y = -2.0 - y; if (z > 1.0) { z = 2.0 - z; } else if (z < -1.0) { z = -2.0 - z; }*/ float r2 = length(x); //x*x + y*y + z*z; r2 *= r2; //sphere fold? if (r2 < mR2) { x = x * fR2 / mR2; DEfactor = DEfactor * fR2 / mR2; } else if (r2 < fR2) { x = x * fR2 / r2; DEfactor *= fR2 / r2; } x = x * scale + cx; x = x.yzx; DEfactor *= scale; } float d = length(x) / abs(DEfactor); return vec2(d, DEfactor / 10.0); } void main() { vec3 color = vec3(0.0); vec3 ro, rd; float rotation = iGlobalTime * 0.1; float height = 16.0; float dist = 18.0; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd, 30.0, 0.01); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); color += nor * 0.5 + 0.5; // color = vec3(t.y * 0.01); color *= t.y * 0.01; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`37:T78c,scissoryBoxFractal =` precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 40) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') vec2 doModel(vec3 p) { float scale = 1.3; float DEfactor = scale; float fixedRadius = 1.95; vec3 x = p; vec3 cx = vec3(1.0, 0.0 + p.x * cos(iGlobalTime) * 1.0, -0.0 + p.y * cos(iGlobalTime) * 1.0); float fR2 = fixedRadius * fixedRadius; float minRadius = 0.5; float mR2 = minRadius * minRadius; for(int i = 0; i < 10; i++) { // box fold x = clamp(x, -1.0, 1.0) * 2.0 - x; /*if (x > 1.0) { x = 2.0 - x; } else if (x < -1.0) { x = -2.0 - x; } if (y > 1.0) { y = 2.0 - y; } else if (y < -1.0) y = -2.0 - y; if (z > 1.0) { z = 2.0 - z; } else if (z < -1.0) { z = -2.0 - z; }*/ float r2 = length(x); //x*x + y*y + z*z; r2 *= r2; //sphere fold? if (r2 < mR2) { x = x * fR2 / mR2; DEfactor = DEfactor * fR2 / mR2; } else if (r2 < fR2) { x = x * fR2 / r2; DEfactor *= fR2 / r2; } x = x * scale + cx; x.yzx = x; DEfactor *= scale; } float d = length(x) / abs(DEfactor); return vec2(d, DEfactor / 10.0); } void main() { vec3 color = vec3(0.0); vec3 ro, rd; float rotation = iGlobalTime * 0.1; float height = 16.0; float dist = 18.0; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd, 30.0, 0.01); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); color += nor * 0.5 + 0.5; // color = vec3(t.y * 0.01); color *= t.y * 0.01; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`38:T78b,zoomyBoxFractal = `precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 40) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') vec2 doModel(vec3 p) { float scale = 1.3; float DEfactor = scale; float fixedRadius = 0.95; vec3 x = p; vec3 cx = vec3(1.0 * tan(iGlobalTime), 0.1 + p.x * cos(iGlobalTime) * 2.0, 1.0 + p.y * cos(iGlobalTime) * 2.0); float fR2 = fixedRadius * fixedRadius; float minRadius = 0.5; float mR2 = minRadius * minRadius; for(int i = 0; i < 10; i++) { x = clamp(x, -1.0, 1.0) * 2.0 - x; /*if (x > 1.0) { x = 2.0 - x; } else if (x < -1.0) { x = -2.0 - x; } if (y > 1.0) { y = 2.0 - y; } else if (y < -1.0) y = -2.0 - y; if (z > 1.0) { z = 2.0 - z; } else if (z < -1.0) { z = -2.0 - z; }*/ float r2 = length(x); //x*x + y*y + z*z; r2 *= r2; if (r2 < mR2) { x = x * fR2 / mR2; DEfactor = DEfactor * fR2 / mR2; } else if (r2 < fR2) { x = x * fR2 / r2; DEfactor *= fR2 / r2; } x = x * scale + cx; DEfactor *= scale; } float d = length(x) / abs(DEfactor); //d = max(d, -length(p) - 5.0); return vec2(d, DEfactor / 10.0); } void main() { vec3 color = vec3(1.0); vec3 ro, rd; float rotation = iGlobalTime * 0.1; float height = 16.0; float dist = 18.0; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd, 30.0, 0.01); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); color += nor * 0.5 + 0.5; // color = vec3(t.y * 0.01); color *= t.y * 0.01; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`39:T780,fireyBoxFractal = `precision mediump float; uniform float iGlobalTime; uniform vec3 iResolution; vec2 doModel(vec3 p); #pragma glslify: raytrace = require('glsl-raytrace', map = doModel, steps = 30) #pragma glslify: normal = require('glsl-sdf-normal', map = doModel) #pragma glslify: camera = require('glsl-turntable-camera') #pragma glslify: noise = require('glsl-noise/simplex/4d') vec2 doModel(vec3 p) { float scale = 1.3; float DEfactor = scale; float fixedRadius = 0.95; float x = p.x; float y = p.y; float z = p.z; float cx = 1.0; float cy = 0.1; float cz = 1.0 + cos(iGlobalTime); float fR2 = fixedRadius * fixedRadius; float minRadius = 0.5; float mR2 = minRadius * minRadius; for(int i = 0; i < 5; i++) { if (x > 1.0) { x = 2.0 - x; } else if (x < -1.0) { x = -2.0 - x; } if (y > 1.0) { y = 2.0 - y; } else if (y < -1.0) y = -2.0 - y; if (z > 1.0) { z = 2.0 - z; } else if (z < -1.0) { z = -2.0 - z; } float r2 = x*x + y*y + z*z; if (r2 < mR2) { x = x * fR2 / mR2; y = y * fR2 / mR2; z = z * fR2 / mR2; DEfactor = DEfactor * fR2 / mR2; } else if (r2 < fR2) { x = x * fR2 / r2; y = y * fR2 / r2; z = z * fR2 / r2; DEfactor *= fR2 / r2; } x = x * scale + cx; y = y * scale + cy; z = z * scale + cz; DEfactor *= scale; } float d = sqrt(x*x+y*y+z*z)/abs(DEfactor); return vec2(d, DEfactor); } void main() { vec3 color = vec3(0.0); vec3 ro, rd; float rotation = iGlobalTime * 0.1; float height = 6.0; float dist = 8.0; camera(rotation, height, dist, iResolution.xy, ro, rd); vec2 t = raytrace(ro, rd); if (t.x > -0.5) { vec3 pos = ro + rd * t.x; vec3 nor = normal(pos); // color = nor * 0.5 + 0.5; color = vec3(t.y * 0.01); // color *= t.y * 0.01; } gl_FragColor.rgb = color; gl_FragColor.a = 1.0; }`3a:[] 2e:{"title":"Shader Sketches","cells":[{"id":0,"value":"md`# Shader Sketches\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"import { glsl } from '@aman-tiwari/glslify'","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"viewof regl = {\n let div = DOM.canvas(width, width / 1.6);\n let regl = wrapREGL(div);\n div.value = regl;\n return div;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":115,"value":"import {select, textarea} from '@jashkenas/inputs'","pinned":false,"hidden":false,"mode":"ojs"},{"id":114,"value":"viewof dropdown = (console.log(self.location, decodeURIComponent(self.location.hash.slice(1))), select({\n title: \"Sketches\",\n description: \"Select a sketch to display.\",\n options: [\"firey box fractal\", \n \"zoomy box fractal\",\n \"scissory box fractal\",\n \"explodey box fractal\",\n \"my website's background\",\n \"peel fractal\",\n \"edge of forest\",\n \"portal fractal\",\n \"american flag\",\n \"sandbox\"],\n value: window.location.hash ? decodeURIComponent(window.location.hash.slice(1)) : [\"firey box fractal\", \n \"zoomy box fractal\",\n \"scissory box fractal\",\n \"explodey box fractal\",\n \"peel fractal\",\n \"american flag\",\n \"sandbox\"][3]\n}))","pinned":false,"hidden":false,"mode":"ojs"},{"id":136,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":123,"value":"fragment = ({\n \"firey box fractal\": fireyBoxFractal,\n \"zoomy box fractal\": zoomyBoxFractal,\n \"scissory box fractal\": scissoryBoxFractal,\n \"explodey box fractal\": explodeyBoxFractal,\n \"my website's background\": backgroundSketch,\n \"peel fractal\": peelFractal,\n \"edge of forest\": edgeOfForestFractal,\n \"portal fractal\": portalFractal,\n \"american flag\": americanFlag,\n \"sandbox\": sandbox\n})[dropdown]","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"draw = regl({\n frag:(window.shader = await glsl`${fragment}`, console.log(window.shader), window.shader),\n vert: `precision mediump float;\n attribute vec2 position;\n void main() {\n gl_Position = vec4(position, 0, 1);\n }`,\n // attributes\n attributes: {\n position: [ [1, 1], [-1, 1], [1, -1], [-1, 1], [1, -1], [-1, -1] ]\n },\n // uniforms\n uniforms: {\n iGlobalTime: regl.prop('iGlobalTime'),\n iResolution: [width, width / 1.6, 1.6]\n },\n\n // vertex count\n count: 6\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"{\n const tick = regl.frame(({time}) => {\n draw({\n iGlobalTime: time\n })\n })\n invalidation.then(() => tick.cancel())\n return 'draw loop'\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":198,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":185,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":177,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":172,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":162,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":148,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":141,"value":"$37","pinned":false,"hidden":false,"mode":"ojs"},{"id":128,"value":"$38","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"$39","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"wrapREGL = require('regl')","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W3a","stdlib":"1","titling":"auto"}