Viewing Program

Program Data

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

Title	weebgel
ID	5221882604208128
Created	1 months ago, 1733527013584
Updated	1 months ago, 1733592075289
Code	/* WEEBGEL IES SPEEED / // the webgl code as string var code = "<style>\n #gl-canvas {\n display: none;\n }\n </style>\n \n <canvas id=\"gl-canvas\"></canvas>\n\n <!-- shader.vert -->\n <script id='vertexShader' type='text/glsl'>\n#version 300 es\nprecision highp float;\n\nin vec2 pos;\nout vec2 pix;\n\nvoid main(){\n pix = pos;\n gl_Position = vec4(pos, 0.0, 1.0);\n}\n </script>\n \n <!-- shader.frag -->\n <script id='fragmentShader' type='text/glsl'>\n#version 300 es\nprecision highp float;\n\nin vec2 pix;\nuniform vec3 data[9];\n\nconst float EPSILON = 0.005;\nconst float PI = 3.14159265;\n\nconst float fov = 30.0;\nconst float fovMult = fov / 360.0 2.0 * PI / 2.0;\n\nconst int SPHERE = 0,\n TRIANGLE = 1,\n BOX = 2,\n PLANE = 3,\n TORUS = 4,\n TRIANGLEMESH = 5;\n\nstruct Ray {\n vec3 pos;\n vec3 vel;\n};\n\nstruct Light {\n vec3 pos;\n vec3 clr;\n};\n\nstruct Shape {\n int type; // type of shape\n float diffuse; // diffuse [0, 1]\n float IOR; // index of refraction\n vec3 clr; // color\n vec3 pos; // position\n vec3 attr; // other attributes\n};\n\nfloat sphereSDF(Ray r, vec3 pos, float d) {\n float lx = r.pos.x - pos.x;\n float ly = r.pos.y - pos.y;\n float lz = r.pos.z - pos.z;\n\n float a = r.vel.x * r.vel.x + r.vel.y * r.vel.y + r.vel.z * r.vel.z;\n float b = 2.0 * (r.vel.x * lx + r.vel.y * ly + r.vel.z * lz);\n float c = lx * lx + ly * ly + lz * lz - (d * d);\n\n float discr = b * b - 4.0 * a * c;\n\n if (discr < 0.0 \|\| b > 0.0) {\n return -1.0;\n } else {\n return (-b - sqrt(discr)) / (2.0 * a);\n }\n}\nfloat boxSDF(Ray r, vec3 pos, vec3 sz) {\n float halfW = sz.x / 2.0;\n float halfH = sz.y / 2.0;\n float halfL = sz.z / 2.0;\n \n vec3 bxMin = vec3(\n pos.x - halfW,\n pos.y - halfH,\n pos.z - halfL\n );\n vec3 bxMax = vec3(\n pos.x + halfW,\n pos.y + halfH,\n pos.z + halfL\n );\n \n float rayNormX = 1.0 / r.vel.x;\n float rayNormY = 1.0 / r.vel.y;\n float rayNormZ = 1.0 / r.vel.z;\n \n float tx1 = (bxMin.x - r.pos.x) * rayNormX;\n float tx2 = (bxMax.x - r.pos.x) * rayNormX;\n \n float tmin = min(tx1, tx2);\n float tmax = max(tx1, tx2);\n \n float ty1 = (bxMin.y - r.pos.y) * rayNormY;\n float ty2 = (bxMax.y - r.pos.y) * rayNormY;\n \n tmin = max(tmin, min(ty1, ty2));\n tmax = min(tmax, max(ty1, ty2));\n \n float tz1 = (bxMin.z - r.pos.z) * rayNormZ;\n float tz2 = (bxMax.z - r.pos.z) * rayNormZ;\n \n tmin = max(tmin, min(tz1, tz2));\n tmax = min(tmax, max(tz1, tz2));\n \n if (tmax < tmin) {\n return -1.0;\n } else {\n float d = tmin < 0.0 ? tmax : tmin;\n return d < 0.0 ? -1.0 : d;\n }\n}\nfloat planeSDF(Ray r, vec3 pos, vec3 norm) {\n float w = 1000.0, h = 1000.0, l = 1000.0;\n \n if (norm.z != 0.0) l = EPSILON;\n if (norm.y != 0.0) h = EPSILON;\n if (norm.x != 0.0) w = EPSILON;\n \n return boxSDF(r, pos, vec3(w, h, l));\n}\nfloat triangleSDF(Ray r, vec3 vertex1, vec3 vertex2, vec3 vertex3) {\n vec3 rayVector = vec3(r.vel.x, r.vel.y, r.vel.z);\n vec3 edge1 = vertex2 - vertex1;\n vec3 edge2 = vertex3 - vertex1;\n vec3 h = cross(rayVector, edge2);\n float a = dot(edge1, h);\n \n // This ray is parallel to this triangle.\n if (a > -EPSILON && a < EPSILON) return -1.0;\n \n float f = 1.0 / a;\n vec3 s = r.pos - vertex1;\n float u = f * dot(s, h);\n if (u < 0.0 \|\| u > 1.0) return -1.0;\n \n vec3 q = cross(s, edge1);\n float v = f * dot(rayVector, q);\n if (v < 0.0 \|\| u + v > 1.0) return -1.0;\n \n // At this stage we can compute t to find out where the intersection point is on the line.\n float t = f * dot(edge2, q);\n if (t > EPSILON) {\n return t; // ray intersection\n } else {\n return -1.0; // This means that there is a line intersection but not a ray intersection\n }\n}\n\nvec3 color(int a, int b, int c) {\n return vec3(\n float(a) / 255.0,\n float(b) / 255.0,\n float(c) / 255.0\n );\n}\n\nconst int numLights = 1;\nconst int sceneLength = 71;\nLight lights[numLights];\nShape scene[sceneLength];\nvoid initScene() {\n // pos, color\n lights[0] = Light(vec3(-10.0, 40.0, -60.0), color(255, 255, 255));\n \n // type, diffuse, color\n // pos\n // attr (sz/normal)\n int i = 0;\n scene[i++] = Shape( // floor\n PLANE, 1.0, 0.0, color(200, 150, 0),\n vec3(0, 0, 0),\n vec3(0, 1, 0)\n );\n for (int x = 0; x < 4; x++) {\n for (int y = 0; y < 3; y++) {\n scene[i++] = Shape(\n BOX, 1.0, 0.0, color(255, 200, 0),\n vec3(float(x) * 110.0 / 5.5 + -30.6, 0, float(y) * 60.0 / 3.0 + -15.5),\n vec3(100.0 * 1.8, 5, 50.0 * 2.8) / 10.0\n );\n }\n }\n \n scene[i++] = Shape( // back wall\n PLANE, 1.0, 0.0, color(200, 150, 0),\n vec3(0, 0, 40),\n vec3(0, 0, -1)\n );\n for (int x = 0; x < 4; x++) {\n for (int y = 0; y < 5; y++) {\n scene[i++] = Shape(\n BOX, 1.0, 0.0, color(255, 200, 0),\n vec3(float(x) * 110.0 / 5.5 + -30.6, float(y) * 60.0 / 5.5 + 4.4, 40.0),\n vec3(100.0 * 1.8, 50.0 * 1.8, 20) / 10.0\n );\n \n if (y == 3) {\n scene[i - 1].clr = color(235, 91, 137);\n }\n }\n }\n \n // head\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(255, 25, 0),\n vec3(0, 17, 0),\n vec3(19)\n );\n \n // nose\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(255, 25, 0),\n vec3(0, 17, -18.3),\n vec3(3)\n );\n \n // leef\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(30, 50, 0),\n vec3(0, 17.116, 0),\n vec3(18.9)\n );\n scene[i++] = Shape(\n BOX, 1.0, 0.0, color(30, 50, 0),\n vec3(-3, 33, -5.6),\n vec3(40.0 , 60.0, 20) / 10.0\n );\n scene[i++] = Shape(\n BOX, 1.0, 0.0, color(30, 50, 0),\n vec3(-1, 31.0, -8.9),\n vec3(40.0 , 60.0, 20) / 10.0\n );\n scene[i++] = Shape(\n BOX, 1.0, 0.0, color(30, 50, 0),\n vec3(1.9, 32.2, -6.5),\n vec3(40.0 , 60.0, 20) / 10.0\n );\n \n // eyeslids\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(255, 25, 0),\n vec3(-3.4, 21, -16),\n vec3(4.5)\n );\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(255, 25, 0),\n vec3(3.4, 21, -16),\n vec3(4.5)\n );\n \n // mouth\n for (int a = 0; a < 50; a += 2) {\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(5, 0, 0),\n vec3(\n 35.8 - float(a) * 1.8, \n 112.9 + sin(5.7 + float(a) / (PI2.0) 0.5) * 8.3, \n -171.8 + sin(2.9 + float(a) / (PI2.0) 0.5) * 12.0\n ) / 10.0,\n vec3(0.76)\n );\n \n }\n \n // eyes\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(255, 255, 255),\n vec3(-3.4, 20.85, -16.1),\n vec3(4.5)\n );\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(255, 255, 255),\n vec3(3.4, 20.85, -16.1),\n vec3(4.5)\n );\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(0, 0, 0),\n vec3(-3.5, 20.85, -17.2),\n vec3(3.48)\n );\n scene[i++] = Shape(\n SPHERE, 1.0, 0.0, color(0, 0, 0),\n vec3(3.5, 20.85, -17.2),\n vec3(3.48)\n );\n \n\n // scene[i++] = Shape(\n // SPHERE, 1.0, 1.2, vec3(0.0, 0.0, 1.0),\n // vec3(0, 20, -25),\n // vec3(13)\n // );\n // scene[i++] = Shape(\n // BOX, 0.0, 0.0, vec3(0.0, 0.0, 1.0),\n // vec3(-20, 10, 20),\n // vec3(12)\n // );\n // scene[i++] = Shape(\n // BOX, 1.0, 0.0, vec3(0.0, 1.0, 1.0),\n // vec3(21, 1, 12),\n // vec3(9.8)\n // );\n // scene[i++] = Shape(\n // BOX, 1.0, 1.2, vec3(1.0, 1.0, 0.0),\n // vec3(21, 10, -19),\n // vec3(9.8)\n // );\n}\n\nvec3 getNormalVector(vec3 intersection, Shape obj) {\n vec3 normalVector;\n \n switch (obj.type) {\n case SPHERE:\n normalVector = normalize(intersection - obj.pos);\n break;\n case BOX:\n normalVector = vec3(0.0, 0.0, 0.0);\n if (intersection.x < obj.pos.x - obj.attr.x / 2.0 + EPSILON * 2.0) {\n normalVector.x = -1.0;\n } else if (intersection.x > obj.pos.x + obj.attr.x / 2.0 - EPSILON) {\n normalVector.x = 1.0;\n }\n \n if (intersection.y < obj.pos.y - obj.attr.y / 2.0 + EPSILON) {\n normalVector.y = -1.0;\n } else if (intersection.y > obj.pos.y + obj.attr.y / 2.0 - EPSILON) {\n normalVector.y = 1.0;\n }\n \n if (intersection.z < obj.pos.z - obj.attr.z / 2.0 + EPSILON) {\n normalVector.z = -1.0;\n } else if (intersection.z > obj.pos.z + obj.attr.z / 2.0 - EPSILON) {\n normalVector.z = 1.0;\n }\n break;\n case PLANE:\n normalVector = obj.attr;\n }\n \n return normalVector;\n}\n\nbool isShadow(Ray ry) {\n for (int i = 0; i < sceneLength; i++) {\n Shape obj = scene[i];\n float lightDist = sphereSDF(ry, lights[0].pos, 0.1);\n float signedDist = 0.0;\n \n switch (obj.type) {\n case SPHERE:\n signedDist = sphereSDF(ry, obj.pos, obj.attr.x);\n break;\n case BOX:\n signedDist = boxSDF(ry, obj.pos, obj.attr);\n break;\n case PLANE:\n signedDist = planeSDF(ry, obj.pos, obj.attr);\n break;\n }\n \n if (signedDist > 0.0 && signedDist < lightDist) return true;\n }\n \n return false;\n}\n\nstruct RT_Response {\n vec3 clr;\n Ray ray;\n};\n\nRT_Response rayTrace(Ray ry) { \n float closestHitDist = 1000000.0;\n Shape closestObject;\n bool hit = false;\n\n // collision detection with objects\n for (int i = 0; i < sceneLength; i++) {\n Shape obj = scene[i];\n float signedDist = 0.0;\n \n switch (obj.type) {\n case SPHERE:\n signedDist = sphereSDF(ry, obj.pos, obj.attr.x);\n break;\n case BOX:\n signedDist = boxSDF(ry, obj.pos, obj.attr);\n break;\n case PLANE:\n signedDist = planeSDF(ry, obj.pos, obj.attr);\n break;\n }\n \n if (signedDist > 0.0 && signedDist < closestHitDist) {\n hit = true;\n closestHitDist = signedDist;\n closestObject = obj;\n }\n }\n \n vec3 outputClr = vec3(0.0, 0.0, 0.0);\n Ray ry2 = Ray(vec3(0, 0, 0), vec3(0, 0, 0));\n \n // calculate color for rays that hit object\n if (hit) {\n vec3 intersect = ry.pos + ry.vel * closestHitDist;\n \n // calculate the normal vector\n vec3 normalVec = getNormalVector(intersect, closestObject);\n \n // calc light vector at y\n vec3 lightVector = normalize(lights[0].pos - intersect);\n \n // calculate the shade at the point of intersection\n float shade = max(dot(lightVector, normalVec), 0.1);\n\n // calculate color for shapes\n outputClr = closestObject.clr * shade;\n \n if (closestObject.IOR > 0.0) {\n ry2 = Ray(intersect, refract(ry.vel, normalVec, 1.0 / closestObject.IOR));\n } else if (closestObject.diffuse == 0.0) {\n ry2 = Ray(intersect, reflect(ry.vel, normalVec));\n } else {\n // do shadows\n Ray shadowRay = Ray(intersect, ry.vel);\n shadowRay.vel = lightVector;\n shadowRay.pos += shadowRay.vel * EPSILON;\n \n if (isShadow(shadowRay)) {\n outputClr = 0.5;\n }\n }\n }\n \n return RT_Response(outputClr, ry2);\n}\n\nout vec4 FragColor;\nvoid main() {\n initScene();\n \n float yThet = atan(data[1].z, data[1].x);\n \n vec3 vel = vec3(\n cos(yThet + pix.x fovMult),\n pix.y * fovMult,\n sin(yThet + pix.x * fovMult)\n );\n \n RT_Response res = rayTrace(Ray(data[0], vel));\n \n // dew it\n for (int i = 0; i < 3; i++) {\n // if it returns a non \"null\" ray do \"recursion\"\n if (\n res.ray.vel.x != 0.0 &&\n res.ray.vel.y != 0.0 &&\n res.ray.vel.z != 0.0\n ) {\n vec3 oldClr = res.clr;\n res.ray.pos += res.ray.vel * EPSILON;\n res = rayTrace(res.ray);\n res.clr = oldClr * 0.1 + res.clr * 0.9;\n }\n }\n \n FragColor = vec4(res.clr, 1.0);\n}\n </script>"; var doc = (function(){return this[["document"]];})(); var win = (function(){return this[["window"]];})(); var bad = doc.getElementsByClassName("htmlcontent"); for (var i = 0; i < bad.length; i++) { bad[i].remove(); } var content = doc[["createElement"]]("div"); content.innerHTML = code; content.className = "htmlcontent"; doc.body.append(content); // setup gl canvas var glCanvas = doc[["getElementById"]]("gl-canvas"); var gl = glCanvas.getContext("webgl2"); var outputWidth = 600; var outputHeight = 1200; glCanvas.width = outputWidth; glCanvas.height = outputHeight; glCanvas.style.transform = "scale(calc(600 / " + outputWidth + "), calc(600 / " + outputHeight + "))"; var cameraData = [0, 0, 0, 0, 0, 0, 0, 0, 0]; function readFile(id) { return doc[["getElementById"]](id).textContent.trim(); } if(!gl){ win.alert('No WebGL'); } // set WebGL size gl.viewport(0, 0, glCanvas.width, glCanvas.height); // setup vertex shader var vertexShader = gl.createShader(gl.VERTEX_SHADER); gl.shaderSource(vertexShader, readFile("vertexShader")); gl.compileShader(vertexShader); // setup fragment shader var fragmentShader = gl.createShader(gl.FRAGMENT_SHADER); gl.shaderSource(fragmentShader, readFile("fragmentShader")); gl.compileShader(fragmentShader); // setup WebGL program var program = gl.createProgram(); gl.attachShader(program, vertexShader); gl.attachShader(program, fragmentShader); gl.linkProgram(program); gl.useProgram(program); function Float32Array_(a) { return win.Function("a", "return new Float32Array(a)")(a); } function Uint16Array_(a) { return win.Function("a", "return new Uint16Array(a)")(a); } // data for rectangle to cover screen var vertsArr = Float32Array_([-1,1, 1,1, 1,-1, -1,-1]); var indexArr = Uint16Array_([0, 1, 2, 2, 3, 0]); // upload vertex data to GPU var vertBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, vertBuffer); gl.bufferData(gl.ARRAY_BUFFER, vertsArr, gl.STATIC_DRAW); // upload index data to GPU var indexBuffer = gl.createBuffer(); gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer); gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, indexArr, gl.STATIC_DRAW); // create variable for pixel position var posAttribLoc = gl.getAttribLocation(program, 'pos'); gl.vertexAttribPointer(posAttribLoc, 2, gl.FLOAT, gl.FALSE, 8, 0); gl.enableVertexAttribArray(posAttribLoc); // create variable for other data var pointsUniformLoc = gl.getUniformLocation(program, 'data'); function renderBob() { // set our input data cameraData[0] = 0; cameraData[1] = 18; cameraData[2] = -88; cameraData[3] = 0 - cameraData[0]; cameraData[4] = 0 - cameraData[1]; cameraData[5] = 0 - cameraData[2]; // upload input data to GPU gl.uniform3fv(pointsUniformLoc, cameraData); // run the GLSL program gl.drawElements(gl.TRIANGLES, indexArr.length, gl.UNSIGNED_SHORT, 0); // MDN says this helps performance gl.flush(); } renderBob(); draw = function() { this.externals.context.drawImage(glCanvas, 0, 0, width, height); pushMatrix(); scale(1.5); fill(255, 255, 255); textAlign(BASELINE); textFont(createFont("sans-serif"), 12); text("FPS: " + this.__frameRate.toFixed(2), 8, 16); textAlign(CENTER); textFont(createFont("impact"), 30); text("Bob the tomato.", 200, 349); popMatrix(); };
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgLvN5KijCQw
Votes	24
Spin-Offs	0
Type	PJS
Width	600
Height	600
User Flagged	false
Origin Scratchpad	{"id":"6025713063739392","title":"Ray Traced Bob the tomato Archive","deleted":"false","official":"false"}
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Himum
Author Name	patmat03
Author ID	kaid_176571968317710015973626
Author Profile Access	COACH

Archive Data

Added	1 months ago, 1733617588260
Updated	1 months ago, 1733617588260
Source Deleted	unknown