Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	House \| Khantober
ID	5726485154807808
Created	2 months ago, 1728949497978
Updated	2 months ago, 1728954476490
Code	<!DOCTYPE html> <!--Thanks to Dat for the boilerplate.--> <!--// Borrowed hash and sampling from my friend Poisson (https://www.shadertoy.com/user/Poisson)--> <html> <head> <meta charset="utf-8"> <title>House \| Khantober</title> </head> <body> <canvas id='gl-canvas' width='600' height='600'></canvas> <style> body{ overflow:hidden; margin:0; } </style> <script id='geometry_vsh' type='3d'>#version 300 es precision highp float; uniform vec2 iResolution; uniform float iTime; in vec2 vertPos; in vec3 vertColor; out vec3 pixColor; out vec2 pixTexCoord; void main(){ pixColor = vertColor; pixTexCoord = vertPos * 0.5 + 0.5; gl_Position = vec4(vertPos, 1.0, 1); } </script> <script id='geometry_fsh' type='3d'>#version 300 es precision highp float; precision highp isampler2D; precision highp int; uniform vec2 iResolution; uniform float iTime; uniform isampler2D iChannel0; in vec2 pixTexCoord; const float scale = 0.2; const vec3 lDir = normalize(vec3(-10, -10, 10)); float seed; float hash1() { return fract(sin(seed += 0.1) * 4568.7564); } vec2 hash2() { return vec2(hash1(), hash1()); } vec3 hash3() { return vec3(hash1(), hash1(), hash1()); } vec2 randomDirection2D() { vec2 d; while(true) { d = hash2() * 2.0 - 1.0; if(length(d) <= 1.0) return d; } } vec3 randomDirection() { vec3 d; while(true) { d = hash3() * 2.0 - 1.0; if(length(d) <= 1.0) return normalize(d); } } vec3 rotate2D(vec3 p, vec2 t){ float stx = sin(t.x); float ctx = cos(t.x); float sty = sin(t.y); float cty = cos(t.y); mat3 xRotation; xRotation[0] = vec3(1, 0, 0); xRotation[1] = vec3(0, ctx, -stx); xRotation[2] = vec3(0, stx, ctx); mat3 yRotation; yRotation[0] = vec3(cty, 0, -sty); yRotation[1] = vec3(0, 1, 0); yRotation[2] = vec3(sty, 0, cty); return pxRotationyRotation; } float box(vec3 p, vec3 s){ vec3 q = abs(p) - s; return length(max(q, 0.0)) + min(max(q.x, max(q.y, q.z)), 0.0); } float siding(vec3 p, float c, vec3 l){ vec3 q = p - c * clamp(round(p / c), -l, l); return box(rotate2D(q, vec2(radians(-10.0), radians(0.0))), vec3(7, 0.25, 0.05) * scale); } vec2 minSurface(float d1, float d2) { float d = min(d1, d2); return vec2(d, d == d1 ? 0 : 1); } vec2 scene(vec3 p) { float ground = box(p - vec3(0, -2, 0), vec3(1000, 1, 1000)); ground -= sin(p.x * 0.25) * sin(p.z * 0.25); ground = 1.0; float frontWall = min( siding(p - vec3(0, 0, -6.98) scale, 0.55 * scale, vec3(0, 35, 0) * scale), box(p - vec3(0, 0, -6) * scale, vec3(7, 5, 1) * scale) ); float rightWall = min( siding(rotate2D(p, vec2(0, -3.14 * 0.5)) - vec3(0, 0, -6.98) * scale, 0.55 * scale, vec3(0, 35, 0) * scale), box(p - vec3(6, 0, 0) * scale, vec3(1, 5, 7) * scale) ); float leftWall = min( siding(rotate2D(p, vec2(0, 3.14 * 0.5)) - vec3(0, 0, -6.98) * scale, 0.55 * scale, vec3(0, 35, 0) * scale), box(p - vec3(-6, 0, 0) * scale, vec3(1, 5, 7) * scale) ); float backWall = min( siding(rotate2D(p, vec2(0, -3.14)) - vec3(0, 0, -6.98) * scale, 0.55 * scale, vec3(0, 35, 0) * scale), box(p - vec3(0, 0, 6) * scale, vec3(7, 5, 1) * scale) ); float doorSub = box(p - vec3(2.5, -0.6, 0) * scale, vec3(5, 3, 1.5) * scale); float door = box(p - vec3(1.8, -0.4, 0) * scale, vec3(5, 2.9, 1.5) * scale); float aFrame = max( -doorSub, box(rotate2D(p - vec3(0, 5, 0) * scale, vec2(3.14 * 0.25, 0)), vec3(7, 5, 5) * scale) ); float sides = max( -doorSub, min(leftWall, rightWall) ); float frontBack = max( -box(p - vec3(0, 1, 0) * scale, vec3(1.5, 1.5, 100) * scale), min(frontWall, backWall) ); float walls = min(sides, frontBack); float roof = min( box((rotate2D(p - vec3(0, 5, 0) * scale, vec2(3.14 * 0.25, 0)) - vec3(0, 5.5, 0.25) * scale), vec3(7.5, 0.25, 5.5) * scale), box((rotate2D(p - vec3(0, 5, 0) * scale, vec2(-3.14 * 0.25, 0)) - vec3(0, 5.5, 0.25) * scale), vec3(7.5, 0.25, 5.5) * scale) ); float foundation = box(p - vec3(0, -5.6, 0) * scale, vec3(8, 2, 8) * scale); foundation = min(foundation, box(p - vec3(9, -6, 0) * scale, vec3(1, 2, 2) * scale)); float closest = min(aFrame, min(min(min(door, walls), roof), min(foundation, ground))); if (closest == roof \|\| closest == foundation) { return vec2(closest, 0); } else if (closest == ground) { return vec2(closest, 1); } else if (closest == door) { return vec2(closest, 3); }else { return vec2(closest, 2); } } float raymarch(vec3 o, vec3 d, inout bool hit) { float t = 0.0; for(int i = 0; i < 100 && t <= 100.0 && !hit; i++) { float s = scene(o + d * t).x; t += s; if(abs(s) <= 0.003 * t && t >= 0.0) hit = true; } return t; } vec3 getNormal(vec3 p) { vec2 e = vec2(0, 0.001); return normalize(vec3( scene(p + e.yxx).x - scene(p - e.yxx).x, scene(p + e.xyx).x - scene(p - e.xyx).x, scene(p + e.xxy).x - scene(p - e.xxy).x )); } vec3 pathtrace(vec3 o, vec3 d) { vec3 col = vec3(1); bool h; vec3 n; float initT; bool initH; for (int i = 0; i < 12; ++i) { h = false; float t = raymarch(o, d, h); initT = i <= 0 ? t : initT; initH = i <= 0 ? h : initH; if (h) { vec3 m; float currM = scene(o + d * t).y; if (currM == 1.0) { m = vec3(0.5, 0.8, 0); } else if(currM == 2.0) { m = vec3(1); } else if(currM == 3.0) { m = vec3(0.5, 0.3, 0); } else { m = vec3(0.2); } n = getNormal(o + d * t); o = o + d * t + n * 0.001; d = randomDirection(); d = normalize(d + n); col = 0.5 m; } else { col = mix(vec3(0.6, 0.8, 1), vec3(1, 0.9, 0.7) 500.0, pow(max(0.0, dot(d, -lDir)), 500.0)); break; } } return mix(col, vec3(0.6, 0.8, 1), 1.0 - exp(-(initH ? initT : 50.0) * vec3(0.01, 0.011, 0.015))); } out ivec4 fragColor; void main(){ seed = iTime + dot(sin(gl_FragCoord.xy), vec2(443.712, 983.234)); seed += hash1() * 434.251; vec2 uv = ((gl_FragCoord.xy + hash2() - 0.5) - 0.5 * iResolution.xy) / iResolution.y; vec3 o = rotate2D(vec3(0, 0, -10), vec2(radians(10.0), radians(135.0))); vec3 d = rotate2D(normalize(vec3(uv, 1.75)), vec2(radians(10.0), radians(135.0))); vec3 focalPoint = o + d * 10.0; o += rotate2D(vec3(randomDirection2D(), 0), vec2(radians(10.0), radians(135.0))) * 0.16; vec3 shiftedDir = normalize(focalPoint - o); vec3 col = pathtrace(o, shiftedDir); ivec4 sam = texture(iChannel0, pixTexCoord); vec4 data = vec4(vec3(sam.rgb) / 999.0, sam.a); data += vec4(col, 1); fragColor = ivec4(vec4(data.xyz * 999.0, data.w)); } </script> <script id='pprocessing_vsh' type='3d'>#version 300 es precision highp float; uniform vec2 iResolution; uniform float iTime; in vec2 vertPos; out vec2 pixTexCoord; void main(){ pixTexCoord = vertPos * 0.5 + 0.5; gl_Position = vec4(vertPos, 1, 1); } </script> <script id='pprocessing_fsh' type='3d'>#version 300 es precision highp float; precision highp isampler2D; precision highp int; uniform vec2 iResolution; uniform float iTime; uniform isampler2D iChannel0; in vec2 pixTexCoord; vec3 ACES(vec3 x) { float a = 2.51; float b = 0.03; float c = 2.1; float d = 0.7; float e = 0.12; return (x * (a * x + b)) / (x * (c * x + d) + e); } void mainImage(out vec4 fragColor, vec2 fragCoord) { ivec4 sam = texture(iChannel0, pixTexCoord); vec4 col = vec4(vec3(sam.rgb) / 999.0, sam.a); col.rgb /= col.a; col.rgb = ACES(col.rgb); fragColor = vec4(pow(col.rgb, vec3(1.0 / 2.2)), 1); } out vec4 fragColor; void main(){ mainImage(fragColor, gl_FragCoord.xy); } </script> <script type='application/javascript'> function main(){ const glCanvas = document.getElementById('gl-canvas'); const gl = glCanvas.getContext('webgl2', {preserveDrawingBuffer: true}); if (!gl) { alert('No WebGL'); return; } const width = window.innerWidth; const height = window.innerHeight; gl.viewport(0, 0, width,height); function createProgram(vsh,fsh) { let vshText=document.getElementById(vsh).text; let fshText=document.getElementById(fsh).text; vsh=gl.createShader(gl.VERTEX_SHADER); fsh=gl.createShader(gl.FRAGMENT_SHADER); gl.shaderSource(vsh,vshText); gl.shaderSource(fsh,fshText); gl.compileShader(vsh); gl.compileShader(fsh); if (!gl.getShaderParameter(vsh,gl.COMPILE_STATUS)) console.error(vshText + " " + gl.getShaderInfoLog(vsh)); if (!gl.getShaderParameter(fsh,gl.COMPILE_STATUS)) console.error(fshText + " " + gl.getShaderInfoLog(fsh)); let p = gl.createProgram(); gl.attachShader(p, vsh); gl.attachShader(p, fsh); gl.linkProgram(p); return p } const geometryProgram = createProgram('geometry_vsh', 'geometry_fsh'); const pprocessingProgram = createProgram('pprocessing_vsh', 'pprocessing_fsh'); let screenVerts = [ -1, -1, 1, -1, 1, 1, -1, 1 ]; let screenIndex = [ 0, 1, 2, 0, 2, 3 ]; let verts = [ -1, -1, 0, 1, 0, 1, -1, 0, 0, 1, 1, 1, 1, 0, 0, -1, 1, 0.8, 0.8, 0 ]; let index=[0, 1, 2, 2, 3, 0]; let vertBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, vertBuffer); gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(verts), gl.STATIC_DRAW); let indexBuffer = gl.createBuffer(); gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(index),gl.STATIC_DRAW); let screenVertBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, screenVertBuffer); gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(screenVerts), gl.STATIC_DRAW); let screenIndexBuffer = gl.createBuffer(); gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, screenIndexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(screenIndex), gl.STATIC_DRAW); let posAttribLoc = gl.getAttribLocation(geometryProgram,'vertPos'); let colAttribLoc = gl.getAttribLocation(geometryProgram, 'vertColor'); gl.vertexAttribPointer(posAttribLoc, 2, gl.FLOAT, gl.FALSE, 20, 0); gl.vertexAttribPointer(colAttribLoc, 3, gl.FLOAT, gl.FALSE, 20, 8); gl.enableVertexAttribArray(posAttribLoc); gl.enableVertexAttribArray(colAttribLoc); function createNullTexture() { let t = gl.createTexture(); gl.bindTexture(gl.TEXTURE_2D, t); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA32I, width, height, 0, gl.RGBA_INTEGER, gl.INT, null); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); return t; } function createFramebufferTexture(target){ let f = gl.createFramebuffer(); gl.bindFramebuffer(gl.FRAMEBUFFER, f); gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, target, 0); return f; } let n1=createNullTexture(); let f1=createFramebufferTexture(n1); let n2=createNullTexture(); let f2=createFramebufferTexture(n2); gl.bindBuffer(gl.ARRAY_BUFFER, vertBuffer); gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer); gl.vertexAttribPointer(posAttribLoc, 2, gl.FLOAT, gl.FALSE, 20, 0); gl.vertexAttribPointer(colAttribLoc, 3, gl.FLOAT, gl.FALSE, 20, 8); let resL_0 = gl.getUniformLocation(geometryProgram, 'iResolution'), timeL_0 = gl.getUniformLocation(geometryProgram, 'iTime'); let resL_1 = gl.getUniformLocation(pprocessingProgram, 'iResolution'), timeL_1 = gl.getUniformLocation(pprocessingProgram, 'iTime'); let START = performance.now(); function render() { gl.bindFramebuffer(gl.FRAMEBUFFER, f2); gl.bindTexture(gl.TEXTURE_2D, n1); gl.useProgram(geometryProgram); gl.uniform1f(timeL_0, (performance.now() - START) * 0.001); gl.uniform2f(resL_0, width, height); gl.drawElements(gl.TRIANGLES, index.length, gl.UNSIGNED_SHORT, 0); gl.bindFramebuffer(gl.FRAMEBUFFER, null); gl.bindTexture(gl.TEXTURE_2D, n2); gl.useProgram(pprocessingProgram); gl.uniform1f(timeL_1, (performance.now() - START) * 0.001); gl.uniform2f(resL_1, width, height); gl.drawElements(gl.TRIANGLES, index.length, gl.UNSIGNED_SHORT, 0); const t = f1; f1 = f2; f2 = t; const _t=n1; n1 = n2; n2 = _t; parent.raf = requestAnimationFrame(render); } if (parent.raf) { cancelAnimationFrame(parent.raf); } render(); } main(); </script> <!--For restart button--> <script></script> </body> </html>
Folds	6,492
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgNvL04aWCgw
Votes	6
Spin-Offs	0
Type	WEBPAGE
Width	400
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Fifth
Author Name	FifthStateOfMatter
Author ID	kaid_1065213098995021368328526
Author Profile Access	PUBLIC

Archive Data

Added	2 months ago, 1728954496399
Updated	2 months ago, 1728954496399
Source Deleted	unknown