Viewing Program

Program Data

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

Title	Beautiful Block Game V1.2
ID	4754798639759360
Created	4 months ago, 1724257123408
Updated	1 months ago, 1733027695749
Code	<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Beautiful Block Game V1.2</title> <style> #gl-canvas { display: none; overflow:hidden; } #canvas2{ display: none; overflow:hidden; } #blocks{ display: none; overflow:hidden; } canvas{ width:600px; } { overflow:hidden; margin:0px; } </style> </head> <body> <canvas id = 'canvas' width = '600' height = '600'></canvas> <canvas id = 'gl-canvas' width = '600' height = '600'></canvas> <canvas id = 'canvas2' width = '512' height = '512'></canvas> <canvas id = 'bloomCanvas' width = '600' height = '600'></canvas> <canvas id = 'blocks' width = '1024' height = '1024'></canvas> <img src="https://upload.wikimedia.org/wikipedia/commons/3/3e/Voxel_Texture_Altlas_2.png?20240819210135" id="atlas"> <script id = 'bloomvertex-shader' type = 'glsl'>#version 300 es in vec2 aPosition; out vec2 pos; void main() { pos = aPosition; gl_Position = vec4(aPosition, 0, 1); } </script> <script id = 'bloomfragment-shader' type = 'glsl'>#version 300 es precision mediump sampler2D; uniform sampler2D iChannel0; precision mediump float; uniform vec2 u_resolution; uniform float drawx; uniform float drawy; uniform float clicked; uniform float iTime; out vec4 fragColor; vec2 Rotate(vec2 uv,float ang){ return vec2(uv.xcos(ang)-uv.ysin(ang),uv.xsin(ang)+uv.ycos(ang)); } vec2 crt(vec2 coord, float bend){ // put in symmetrical coords coord = (coord - 0.5) 2.0; coord = 1.1; // deform coords coord=Rotate(coord,bendpow(length(coord),2.0)); // transform back to 0.0 - 1.0 space coord = (coord / 2.2) + 0.5; return coord; } vec4 textur(vec2 uv){ vec2 ruv=uv; return texture(iChannel0,ruv); } float random (in vec2 _st) { return fract(sin(dot(_st.xy, vec2(12.9898,78.233)))* 43758.5453123); } vec4 photoshop_desaturate(vec3 color, float factor) { vec3 lum = vec3(0.299, 0.587, 0.114); vec3 gray = vec3(dot(lum, color)); return vec4(mix(color, gray, factor), 1.0); } void main() { vec2 fragCoord = gl_FragCoord.xy; vec2 iMouse = vec2(drawx,drawy); vec2 iResolution = vec2(600.0,600.0); vec2 res = iResolution.xy; vec2 uv=(fragCoord/res); uv.y=1.0-uv.y; fragColor.rgb = textur(uv).rgb; fragColor.a=1.0; // fragColor.rgb=mix(fragColor.rgb,((fragColor.rgb+1.0)/2.0)vec3(0.05,0.06,0.3),pow(distance(uv8.0,vec2(0.58.0,0.58.0)),2.0)/200.0+0.3); vec3 som=vec3(0.0); float accum=0.0; for(float x=1.0;x<50.0;x+=1.0){ vec2 off=vec2(sin(xrandom(vec2(x)5.0))(x/2000.0),cos(xrandom(vec2(x/2.0)10.0))(x/2000.0)); vec3 he = textur(uv-off).rgb; if(length(he)>0.5){ fragColor.rgb=mix(fragColor.rgb,he,0.01pow(length(he)/1.3,4.0)); } } fragColor.rgb=1.0; } </script> <script id = 'vertex-shader' type = 'glsl'>#version 300 es in vec2 aPosition; out vec2 pos; void main() { pos = aPosition; gl_Position = vec4(aPosition, 0, 1); } </script> <script> </script> <script id = 'fragment-shader' type = 'glsl'>#version 300 es precision mediump sampler2D; uniform sampler2D iChannel0; uniform sampler2D iChannel1; precision mediump float; uniform vec2 u_resolution; uniform float drawx; uniform float drawy; uniform vec3 lightPos; uniform vec3 playerPos; uniform float iTime; const bool USE_BRANCHLESS_DDA = true; const int MAX_RAY_STEPS = 128; vec2 rotate2d(vec2 v, float a) { float sinA = sin(a); float cosA = cos(a); return vec2(v.x * cosA - v.y * sinA, v.y * cosA + v.x * sinA); } float sum(vec3 v) { return dot(v, vec3(1.0)); } float sdSphere(vec3 p, float d) { return length(p) - d; } 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)); } vec3 getVoxel(vec3 c) { vec3 p = floor(c); vec3 u = floor(c)-vec3(0.5,0.0,0.5); if(max(max(u.x,u.y),u.z)>=128.0\|\|min(min(u.x,u.y),u.z)<=0.0\|\|u.y>=64.0){ return vec3(0.0,0.0,1.0); } float buf=(u.x-64.0)+(u.z)128.0+(u.y)128.0128.0; vec2 index=vec2(mod(buf,1024.0),floor(buf/1024.0)+vec2(0.5)); vec4 info=texelFetch(iChannel1,ivec2(index),0)vec4(255.0,1.0,1.0,1.0); float d = info.x<25.0?-1.0:1.0; return vec3(float(d < 0.0),info.x,info.y); } float vertexAo(vec2 side, float corner) { //if (side.x == 1.0 && side.y == 1.0) return 1.0; return (side.x + side.y + max(corner, side.x * side.y)) / 3.0; } vec4 voxelAo(vec3 pos, vec3 d1, vec3 d2) { vec4 side = vec4(getVoxel(pos + d1).x, getVoxel(pos + d2).x, getVoxel(pos - d1).x, getVoxel(pos - d2).x); vec4 corner = vec4(getVoxel(pos + d1 + d2).x, getVoxel(pos - d1 + d2).x, getVoxel(pos - d1 - d2).x, getVoxel(pos + d1 - d2).x); vec4 ao; ao.x = vertexAo(side.xy, corner.x); ao.y = vertexAo(side.yz, corner.y); ao.z = vertexAo(side.zw, corner.z); ao.w = vertexAo(side.wx, corner.w); return 1.0 - ao; } float lerpShadows(vec3 p){ float r=0.0; float w1=getVoxel(p).z; float w2=getVoxel(p-vec3(1.0,0.0,0.0)).z; float w3=getVoxel(p-vec3(0.0,1.0,0.0)).z; float w4=getVoxel(p-vec3(0.0,0.0,1.0)).z; float w5=getVoxel(p-vec3(0.0,1.0,1.0)).z; float w6=getVoxel(p-vec3(1.0,0.0,1.0)).z; float w7=getVoxel(p-vec3(1.0,1.0,0.0)).z; float w8=getVoxel(p-vec3(1.0,1.0,1.0)).z; p=mod(p,1.0); float v1=p.xp.yp.z; float v2=(1.0-p.x)p.yp.z; float v3=p.x(1.0-p.y)p.z; float v4=p.xp.y(1.0-p.z); float v5=p.x(1.0-p.y)(1.0-p.z); float v6=(1.0-p.x)p.y(1.0-p.z); float v7=(1.0-p.x)(1.0-p.y)p.z; float v8=(1.0-p.x)(1.0-p.y)(1.0-p.z); r=v1w1+v2w2+v3w3+v4w4+v5w5+v6w6+v7w7+v8w8; return 1.0-r; } float zeroToOne(float x) { return x + float(!bool(x)); } float voxelDistance(vec3 pos) { vec3 p = floor(pos); //integer coordinates pos = mod(pos, 1.0); const vec3 o = vec3(0, 1.0, -1.0); //for swizzling float faceX = min(zeroToOne(pos.x * getVoxel(p + o.zxx).x), zeroToOne((1.0 - pos.x) * getVoxel(p + o.yxx).x)); float faceY = min(zeroToOne(pos.y * getVoxel(p + o.xzx).x), zeroToOne((1.0 - pos.y) * getVoxel(p + o.xyx).x)); float faceZ = min(zeroToOne(pos.y * getVoxel(p + o.xxz).x), zeroToOne((1.0 - pos.z) * getVoxel(p + o.xxz).x)); float face = min(faceX, min(faceY, faceZ)); //float edgeX1 = return 0.0; } const vec2 iResolution = vec2(600.0,600.0); float shadowLeaves(vec3 rayPos, vec3 rayDir){ vec3 fragColor; vec3 camPos=rayPos; vec3 mapPos = vec3(floor(rayPos)); vec3 deltaDist = abs(vec3(length(rayDir)) / rayDir); vec3 rayStep = sign(rayDir); vec3 sideDist = (sign(rayDir) * (mapPos - rayPos) + (sign(rayDir) * 0.5) + 0.5) * deltaDist; vec3 mask; float hitLight=0.2; for (int i = 0; i < MAX_RAY_STEPS; i++) { if (bool(getVoxel(mapPos))) continue; mask = step(sideDist.xyz, sideDist.yzx) * step(sideDist.xyz, sideDist.zxy); sideDist += mask * deltaDist; mapPos += mask * rayStep1.0; float di=distance(floor(mapPos),floor(lightPos)); if(di<1.1){ hitLight=1.0; break; } } return hitLight; } float shadow(vec3 rayPos, vec3 rayDir){ vec3 fragColor; vec3 camPos=rayPos; vec3 mapPos = vec3(floor(rayPos)); vec3 deltaDist = abs(vec3(length(rayDir)) / rayDir); vec3 rayStep = sign(rayDir); vec3 sideDist = (sign(rayDir) (mapPos - rayPos) + (sign(rayDir) * 0.5) + 0.5) * deltaDist; vec3 mask; float hitLight=0.2; for (int i = 0; i < MAX_RAY_STEPS; i++) { if (bool(getVoxel(mapPos))) continue; mask = step(sideDist.xyz, sideDist.yzx) * step(sideDist.xyz, sideDist.zxy); sideDist += mask * deltaDist; mapPos += mask * rayStep1.0; float di=distance(floor(mapPos),floor(lightPos)); if(di<1.1){ hitLight=1.0; break; } } vec3 intersectPlane = mapPos + vec3(lessThan(rayDir, vec3(0))); vec3 endRayPos; vec2 uv; vec4 ambient; ambient = voxelAo(mapPos - rayStep mask, mask.zxy, mask.yzx); endRayPos = rayDir / sum(mask * rayDir) * sum(mask * (mapPos + vec3(lessThan(rayDir, vec3(0))) - rayPos)) + rayPos; uv = mod(vec2(dot(mask * endRayPos.yzx, vec3(1.0)), dot(mask * endRayPos.zxy, vec3(1.0))), vec2(1.0)); float interpAo = mix(mix(ambient.z, ambient.w, uv.x), mix(ambient.y, ambient.x, uv.x), uv.y); interpAo = pow(interpAo, 1.0 / 3.0); float blocc=getVoxel(mapPos).y; vec2 texUv=ceil((uv-vec2(0.0,0.0))vec2(32.0,32.01.0))/vec2(32.0,32.01.0); vec3 tex=texture(iChannel0,texUvvec2(1.0/9.0,1.0)+vec2(blocc(1.0/9.0)-0.002,0.0-0.002)).rgb; float op; float didFart=0.0; if(length(tex)<0.01){ return (1.0); } return hitLight; } #define DRAG_MULT 0.38 // changes how much waves pull on the water #define ITERATIONS_NORMAL 27 // waves iterations when calculating normals vec2 wavedx(vec2 position, vec2 direction, float frequency, float timeshift) { float x = dot(direction, position) frequency + timeshift; float wave = exp(sin(x) - 1.0); float dx = wave * cos(x); return vec2(wave, -dx); } // Calculates waves by summing octaves of various waves with various parameters float getwaves(vec2 position, int iterations) { float wavePhaseShift = length(position) * 0.1; // this is to avoid every octave having exactly the same phase everywhere float iter = 0.0; // this will help generating well distributed wave directions float frequency = 1.0; // frequency of the wave, this will change every iteration float timeMultiplier = 2.0; // time multiplier for the wave, this will change every iteration float weight = 1.0;// weight in final sum for the wave, this will change every iteration float sumOfValues = 0.0; // will store final sum of values float sumOfWeights = 0.0; // will store final sum of weights for(int i=0; i < iterations; i++) { // generate some wave direction that looks kind of random vec2 p = vec2(sin(iter), cos(iter)); // calculate wave data vec2 res = wavedx(position, p, frequency, (iTime/20.0) * timeMultiplier + wavePhaseShift); // shift position around according to wave drag and derivative of the wave position += p * res.y * weight * DRAG_MULT; // add the results to sums sumOfValues += res.x * weight; sumOfWeights += weight; // modify next octave ; weight = mix(weight, 0.0, 0.2); frequency = 1.18; timeMultiplier = 1.07; // add some kind of random value to make next wave look random too iter += 1232.399963; } // calculate and return return (sumOfValues / sumOfWeights)/4.0; } vec3 wnormal(vec2 pos, float e, float depth) { vec2 ex = vec2(e, 0); float H = getwaves(pos.xy, ITERATIONS_NORMAL) * depth; vec3 a = vec3(pos.x, H, pos.y); return normalize( cross( a - vec3(pos.x - e, getwaves(pos.xy - ex.xy, ITERATIONS_NORMAL) * depth, pos.y), a - vec3(pos.x, getwaves(pos.xy + ex.yx, ITERATIONS_NORMAL) * depth, pos.y + e) ) ); } vec4 marchLeaves(vec3 rayPos, vec3 rayDir){ vec3 fragColor; vec3 camPos=rayPos; vec3 mapPos = vec3(floor(rayPos)); vec3 gr=rayPos; float ac=1.0; float hitW=0.0; vec3 deltaDist = abs(vec3(length(rayDir)) / rayDir); vec3 lightColor=vec3(1.0,0.95,0.8); vec3 rayStep = sign(rayDir); vec3 back=vec3(0.5,0.5,0.9); vec3 sideDist = (sign(rayDir) * (mapPos - rayPos) + (sign(rayDir) * 0.5) + 0.5) * deltaDist; float godRays=0.0; vec3 mask; float happened=0.0; for (int i = 0; i < MAX_RAY_STEPS; i++) { vec3 at=getVoxel(mapPos); if(at.y==8.0){ hitW=1.0; } if (bool(at.x)&&at.y!=6.0&&at.y!=8.0){ happened=1.0; continue; } if(mapPos.y>64.0\|\|mapPos.x>128.0\|\|mapPos.z>128.0\|\|mapPos.x<0.0\|\|mapPos.z<0.0){ break; } float fr=lerpShadows(gr); godRays+=(fr-0.21)/(2.0ac); ac+=0.5(fr-0.21); mask = step(sideDist.xyz, sideDist.yzx) * step(sideDist.xyz, sideDist.zxy); sideDist += mask * deltaDist; mapPos += mask * rayStep; gr+=rayDir; } if(happened==0.0){ back+=max(godRays,0.0)lightColor; return vec4(back,0.0); } vec3 intersectPlane = mapPos + vec3(lessThan(rayDir, vec3(0))); vec3 endRayPos; vec2 uv; vec4 ambient; ambient = voxelAo(mapPos - rayStep mask, mask.zxy, mask.yzx); endRayPos = rayDir / sum(mask * rayDir) * sum(mask * (mapPos + vec3(lessThan(rayDir, vec3(0))) - rayPos)) + rayPos; uv = mod(vec2(dot(mask * endRayPos.yzx, vec3(1.0)), dot(mask * endRayPos.zxy, vec3(1.0))), vec2(1.0)); float interpAo = mix(mix(ambient.z, ambient.w, uv.x), mix(ambient.y, ambient.x, uv.x), uv.y); interpAo = pow(interpAo, 1.0 / 3.0); float blocc=getVoxel(mapPos).y; vec2 texUv=floor(((uv+vec2(0.0,0.0)/16.0)vec2(16.0,16.01.0)))/vec2(16.0,16.01.0); vec3 tex=texture(iChannel0,texUvvec2(1.0/8.0,1.0/3.0)+vec2(blocc(1.0/8.0)+0.0035,0.0)).rgb; vec3 op; vec2 norms=vec2(texture(iChannel0,((uv+vec2(0.0,0.0)/16.0)vec2(1.0/8.0,1.0/3.0)+vec2(blocc(1.0/8.0)+0.0035,0.0+1.0/3.0))).rg-0.5)/2.0; vec4 color=vec4(tex,texture(iChannel0,texUvvec2(1.0/8.0,1.0/3.0)+vec2(blocc(1.0/8.0)-0.002,0.0-0.002+2.0/3.0)).r); //color=interpAo; fragColor.rgb = pow(color.rgb, vec3(2.2)); vec3 cameraPos; vec3 cameraDir; vec3 normal; float light; float light2; if(dot(mask * abs(endRayPos.yzx), vec3(1.0,0.0,0.0))>8.0){ cameraDir=normalize(endRayPos-camPos); normal=normalize(vec3(1.0,norms.x,norms.y)); light=abs(dot(cameraDir,normal)); vec3 lightTo=normalize(reflect(lightPos-endRayPos,normal)); light2=abs(dot(cameraDir,lightTo)); fragColor.rgb=light; } if(dot(mask abs(endRayPos.yzx), vec3(0.0,1.0,0.0))>0.0){ cameraDir=normalize(endRayPos-camPos); normal=normalize(vec3(norms.x,1.0,norms.y)); light=abs(dot(cameraDir,normal)); vec3 lightTo=normalize(reflect(lightPos-endRayPos,normal)); light2=abs(dot(cameraDir,lightTo)); fragColor.rgb=light; } if(dot(mask abs(endRayPos.yzx), vec3(0.0,0.0,1.0))>0.0){ cameraDir=normalize(endRayPos-camPos); normal=normalize(vec3(norms.x,norms.y,1.0)); light=abs(dot(cameraDir,normal)); vec3 lightTo=normalize(reflect(lightPos-endRayPos,normal)); light2=abs(dot(cameraDir,lightTo)); fragColor.rgb=light; } light=light; light=light; light=light; light=light; light=light; light=light; light=light; light=light; light=light; fragColor.rgb+=lightcolor.a; rayDir=reflect(rayDir,normal); rayPos=(endRayPos+0.00001sign(rayDir)); fragColor.rgb=fragColor.rgb(lerpShadows(rayPos)); fragColor.rgb+=lightColorgodRays/15.0; if(hitW>0.5){ fragColor.rgb+=max(vec3((getwaves(endRayPos.xz2.0,18)1.7-0.19)lightColor),0.0); } fragColor.rgb=8.0; return vec4(fragColor.r,fragColor.g,fragColor.b,color.a); } vec4 march(inout vec3 rayPos, inout vec3 rayDir){ vec3 fragColor; vec3 camPos=rayPos; vec3 mapPos = vec3(floor(rayPos)); vec3 gr=rayPos; float ac=1.0; vec3 deltaDist = abs(vec3(length(rayDir)) / rayDir); vec3 lightColor=vec3(1.0,0.95,0.8); vec3 rayStep = sign(rayDir); vec3 back=vec3(0.5,0.5,0.9); vec3 sideDist = (sign(rayDir) * (mapPos - rayPos) + (sign(rayDir) * 0.5) + 0.5) * deltaDist; float godRays=0.0; vec3 mask; float happened=0.0; for (int i = 0; i < MAX_RAY_STEPS; i++) { vec3 at=getVoxel(mapPos); if (bool(at.x)){ happened=1.0; continue; } if(mapPos.y>64.0\|\|mapPos.x>128.0\|\|mapPos.z>128.0\|\|mapPos.x<0.0\|\|mapPos.z<0.0){ break; } float fr=lerpShadows(gr); godRays+=(fr-0.21)/(2.0ac); ac+=0.5(fr-0.21); mask = step(sideDist.xyz, sideDist.yzx) * step(sideDist.xyz, sideDist.zxy); sideDist += mask * deltaDist; mapPos += mask * rayStep; gr+=rayDir; } if(happened==0.0){ back+=max(godRays,0.0)lightColor; return vec4(back,0.0); } vec3 intersectPlane = mapPos + vec3(lessThan(rayDir, vec3(0))); vec3 endRayPos; vec2 uv; vec4 ambient; ambient = voxelAo(mapPos - rayStep mask, mask.zxy, mask.yzx); endRayPos = rayDir / sum(mask * rayDir) * sum(mask * (mapPos + vec3(lessThan(rayDir, vec3(0))) - rayPos)) + rayPos; uv = mod(vec2(dot(mask * endRayPos.yzx, vec3(1.0)), dot(mask * endRayPos.zxy, vec3(1.0))), vec2(1.0)); float interpAo = mix(mix(ambient.z, ambient.w, uv.x), mix(ambient.y, ambient.x, uv.x), uv.y); interpAo = pow(interpAo, 1.0 / 3.0); float blocc=getVoxel(mapPos).y; vec2 texUv=floor(((uv+vec2(0.0,0.0)/16.0)vec2(16.0,16.01.0)))/vec2(16.0,16.01.0); vec3 tex=texture(iChannel0,texUvvec2(1.0/8.0,1.0/3.0)+vec2(blocc(1.0/8.0)+0.0035,0.0)).rgb; vec3 op; float didFart=0.0; vec4 lev=vec4(0.0); if(getVoxel(endRayPos+0.001rayDir).y==6.0){ lev.a=clamp(0.7-tex.g3.0,0.0,1.0); lev.rgb=(marchLeaves(endRayPos,rayDir)).rgb; } vec2 norms=vec2(texture(iChannel0,((uv+vec2(0.0,0.0)/16.0)vec2(1.0/8.0,1.0/3.0)+vec2(blocc(1.0/8.0)+0.0035,0.0+1.0/3.0))).rg-0.5)/2.0; vec4 color=vec4(tex,texture(iChannel0,texUvvec2(1.0/8.0,1.0/3.0)+vec2(blocc(1.0/8.0)-0.002,0.0-0.002+2.0/3.0)).r/2.0); color=interpAo; fragColor.rgb = pow(color.rgb, vec3(2.2)); vec3 cameraPos; vec3 cameraDir; vec3 normal; vec3 wat=vec3(0.0); float light; float light2; if(getVoxel(endRayPos+0.0001sign(rayDir)).y!=8.0){ if(dot(mask abs(endRayPos.yzx), vec3(1.0,0.0,0.0))>8.0){ cameraDir=normalize(endRayPos-camPos); normal=normalize(vec3(1.0,norms.x,norms.y)); light=abs(dot(cameraDir,normal)); vec3 lightTo=normalize(reflect(lightPos-endRayPos,normal)); light2=abs(dot(cameraDir,lightTo)); fragColor.rgb=light; } if(dot(mask abs(endRayPos.yzx), vec3(0.0,1.0,0.0))>0.0){ cameraDir=normalize(endRayPos-camPos); normal=normalize(vec3(norms.x,1.0,norms.y)); light=abs(dot(cameraDir,normal)); vec3 lightTo=normalize(reflect(lightPos-endRayPos,normal)); light2=abs(dot(cameraDir,lightTo)); fragColor.rgb=light; } if(dot(mask abs(endRayPos.yzx), vec3(0.0,0.0,1.0))>0.0){ cameraDir=normalize(endRayPos-camPos); normal=normalize(vec3(norms.x,norms.y,1.0)); light=abs(dot(cameraDir,normal)); vec3 lightTo=normalize(reflect(lightPos-endRayPos,normal)); light2=abs(dot(cameraDir,lightTo)); fragColor.rgb=light; } }else{ cameraDir=normalize(endRayPos-camPos); normal=wnormal(endRayPos.xz,0.01,0.3); color.a=0.5(1.0-abs(dot(normal,cameraDir))); light=abs(dot(cameraDir,normal)); vec3 lightTo=normalize(reflect(lightPos-endRayPos,normal)); light2=abs(dot(cameraDir,lightTo)); wat=(vec3((getwaves(endRayPos.xz,8)0.1+0.29)vec3(0.3,0.3,0.8))); wat=mix(wat,mix(marchLeaves(endRayPos,normalize(vec3(rayDir.x+normal.x3.0,rayDir.y,rayDir.z+normal.z3.0))).rgb,vec3(0.3,0.3,0.6),1.0-light),0.3+0.7(lightlight)); } light=light; light=light; light=light; light=light; light=light; light=light; light=light; light=light; light=light; fragColor.rgb+=lightcolor.a; rayDir=reflect(rayDir,normal); rayPos=(endRayPos+0.00001sign(rayDir)); fragColor.rgb=mix(fragColor.rgb,lev.rgb,lev.a)(lerpShadows(rayPos)); fragColor.rgb+=lightColorgodRays/65.0; fragColor.rgb=8.0; if(length(wat)>0.001){ fragColor.rgb=wat; } return vec4(fragColor.r,fragColor.g,fragColor.b,color.a); } out vec4 fragColor; void main() { vec2 fragCoord=gl_FragCoord.xy; vec2 screenPos = (fragCoord.xy / iResolution.xy) * 2.0 - 1.0; vec3 cameraDir = vec3(0.0, 0.0, 0.8); vec3 cameraPlaneU = vec3(1.0, 0.0, 0.0); vec3 cameraPlaneV = vec3(0.0, 1.0, 0.0) * iResolution.y / iResolution.x; vec3 rayDir = cameraDir + screenPos.x * cameraPlaneU + screenPos.y * cameraPlaneV; vec3 rayPos = vec3(0.0, 0.0, 0.0); rayDir.zy = rotate2d(rayDir.zy, drawy); rayDir.xz = rotate2d(rayDir.xz, drawx); rayPos+=playerPos; vec4 fa=march(rayPos,rayDir); fragColor.rgb=fa.rgb; for(int i=0;i<1;i++){ vec4 tempCol=march(rayPos,rayDir); fragColor.rgb=mix(fragColor.rgb,tempCol.rgb,tempCol.a/4.0); } fragColor.rgb=sqrt(fragColor.rgb); fragColor.a=1.0; } </script> <script type = 'module'> const canvas = document.getElementById('canvas'), ctx = canvas.getContext('2d'); const canvas2 = document.getElementById('canvas2'), ctx2 = canvas2.getContext('2d'); const canvas3 = document.getElementById('blocks'), ctx3 = canvas3.getContext('2d'); var mouseX=0,pmouseX=0,mouseY=0,pmouseY=0,clicked=false,key={}; var keys = []; var clickToggle=false; var canClick=true; var start=false; function getPointer() { if (canvas.requestPointerLock) { window.addEventListener("mousemove", function(ev) { mouseX = pmouseX + ev.movementX/1.5; mouseY = pmouseY + ev.movementY/1.5; }); canvas.requestPointerLock() } } window.addEventListener('mousedown', event => { clicked = true; getPointer(); if(canClick){ clickToggle=true; canClick=false; } }); window.addEventListener('mouseup', event => { clicked = false; canClick=true; }); window.addEventListener("mouseover", event => { pmouseX = mouseX; pmouseY = mouseY mouseX = event.pageX; mouseY = event.pageY; }); window.addEventListener("mousemove", event => { pmouseX = mouseX; pmouseY = mouseY mouseX = event.pageX; mouseY = event.pageY; }); window.addEventListener("keydown", function(e) { if(["Space", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].indexOf(e.code) > -1) { e.preventDefault(); } }, false); window.addEventListener("keydown", (event) => { keys[event.key] = true; }); window.addEventListener("keyup", (event) => { delete keys[event.key]; }); function createShader(gl, type, source) { const shader = gl.createShader(type); gl.shaderSource(shader, source); gl.compileShader(shader); if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { console.log(gl.getShaderInfoLog(shader)); } return shader; } function createProgram(gl, vs, fs) { const program = gl.createProgram(); gl.attachShader(program, vs); gl.attachShader(program, fs); gl.linkProgram(program); return program; } const glCanvas2 = document.getElementById('bloomCanvas'), gl2 = glCanvas2.getContext('webgl2'); const vertexSource2 = document.getElementById('bloomvertex-shader').textContent, fragmentSource2 = document.getElementById('bloomfragment-shader').textContent; const vertexShader2 = createShader(gl2, gl2.VERTEX_SHADER, vertexSource2), fragmentShader2 = createShader(gl2, gl2.FRAGMENT_SHADER, fragmentSource2); const program2 = createProgram(gl2, vertexShader2, fragmentShader2); const aPosition2 = gl2.getAttribLocation(program2, 'aPosition') const drawx2 = gl2.getUniformLocation(program2, "drawx"); const drawy2 = gl2.getUniformLocation(program2, "drawy"); const iTime2 = gl2.getUniformLocation(program2, "iTime"); const cli2 = gl2.getUniformLocation(program2, "clicked"); const iChannel02 = gl2.getUniformLocation(program2,"iChannel0"); let texture02 = gl2.createTexture(); const positions2 = new Float32Array([-1, -1, -1, 3, 3, -1]); const posBuffer2 = gl2.createBuffer(); gl2.bindBuffer(gl2.ARRAY_BUFFER, posBuffer2); gl2.bufferData(gl2.ARRAY_BUFFER, positions2, gl2.STATIC_DRAW); gl2.viewport(0, 0, 1200, 1200); gl2.clearColor(0, 0, 0, 1); gl2.useProgram(program2); gl2.enableVertexAttribArray(aPosition2); gl2.vertexAttribPointer(aPosition2, 2, gl2.FLOAT, false, 0, 0); gl2.activeTexture(gl2.TEXTURE0); gl2.bindTexture(gl2.TEXTURE_2D, texture02); gl2.uniform1i(iChannel02, 0); gl2.texParameteri(gl2.TEXTURE_2D, gl2.TEXTURE_WRAP_S, gl2.CLAMP_TO_EDGE); gl2.texParameteri(gl2.TEXTURE_2D, gl2.TEXTURE_WRAP_T, gl2.CLAMP_TO_EDGE); gl2.texParameteri(gl2.TEXTURE_2D, gl2.TEXTURE_MIN_FILTER, gl2.LINEAR); noise.seed(Math.random()); function fbm(x,y){ var sum=0; var mult=0.6; for(var i=0;i<5;i++){ sum+=noise.simplex2(xmult,ymult)/mult; mult=2.0; } return sum; } function clamp(num, lower, upper) { return Math.min(Math.max(num, lower), upper); } function getBlockAt(x,y,z){ var index=~~x+~~z128+~~y128128; return ctx3.getImageData(index%1024,Math.floor(index/1024),1,1).data[0]; } function worldGenReturn(x,y,z){ var terrainHeightValue=fbm(x/120,z/120)16; var sum=255; if(terrainHeightValue>y-32){ sum = clamp(1.0-(y-32-terrainHeightValue)/2,1.0,3.0); } if(y<21&&terrainHeightValue>y-32){ sum=5; } if(y<20&&sum>240){ sum=8; } return sum; } function loadChunk(x,z){ for(var x1=0;x1<8;x1++){ for(var y1=0;y1<64;y1++){ for(var z1=0;z1<8;z1++){ addBlockHere(x1+x,y1,z1+z,worldGenReturn(x1+x,y1,z1+z)); }}} for(var d=0;d<2;d++){ var randx=~~(Math.random()128); var randy=~~(Math.random()128); var terrain=(fbm(randx/120,randy/120)16); if(Math.random()>0.03&&terrain+33>21){ var treeHeight=Math.random()12+12 for(var i=0;i<treeHeight;i++){ addBlockHere(randx,~~(terrain+i+33),randy,7.0); } for(var i=0;i<525;i++){ var rand1=~~(Math.random()12-6) var rand2=~~(Math.random()12-6) var rand3=~~(Math.random()12-6) if(rand1rand1+rand2rand2+rand3rand3<Math.random()60){ addBlockHere(randx+rand1,~~(terrain+treeHeight+36)+rand2,randy+rand3,6.0); } } } } } function addBlockHere(x,y,z,t){ if(t<=254){ ctx3.fillStyle="rgb("+t+",0,0)" var index=x+(z128)+(y128128); var px=(index%1024); var py=Math.floor(index/1024); ctx3.fillRect(px,py,1,1); } } function addShadowHere(x,y,z){ var t=getBlockAt(x,y,z); ctx3.fillStyle="rgb("+t+",200,0)" var index=x+(z128)+(y128128); var px=(index%1024); var py=Math.floor(index/1024); ctx3.fillRect(px,py,1,1); } var shadowProgress=64; var sx=0; var sy=0; var numLightsPerFrame=1; function paintLighting(){ if(shadowProgress>0){ for(var go=0;go<numLightsPerFrame;go++){ for(var x=0;x<128;x+=8){ for(var y=0;y<128;y+=8){ for(var i=shadowProgress+1;i<64;i++){ if(getBlockAt(Math.floor(x+sx+(i-shadowProgress)),i,Math.floor(y+sy+(i-shadowProgress)))<8){ addShadowHere(x+sx,shadowProgress,y+sy); break; } } }} sx++; if(sx>7){ sx=0; sy++; } if(sy>7){ sy=0; shadowProgress--; } } } } class Vector { constructor(x, y, z=0) { this.x = x; this.y = y; this.z=z; } subtract(v) { var ve = new Vector(this.x, this.y, this.z); ve.x -= v.x; ve.y -= v.y; ve.z -= v.z; return ve; } add(v) { var ve = new Vector(this.x, this.y, this.z); ve.x += v.x; ve.y += v.y; ve.z += v.z; return ve; } divide(n) { var ve = new Vector(this.x, this.y, this.z); ve.x /= n; ve.y /= n; ve.z /= n; return ve; } magnitude() { return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z); } dot(v) { return this.x * v.x + this.y * v.y + this.z * v.z; } scale(n) { var ve = new Vector(this.x, this.y, this.z); ve.x = n; ve.y = n; ve.z = n; return ve; } normalize() { var ve = new Vector(this.x, this.y, this.z); ve = ve.divide(ve.magnitude()); return ve; } rotateBy(ang) { ang = -ang; return new Vector(this.x Math.cos(ang) - this.y * Math.sin(ang), this.x * Math.sin(ang) + this.y * Math.cos(ang)); } rotate3d(anglex,angley) { var ve = new Vector(this.x,this.y,this.z); var ro1 = new Vector(this.y,this.z).rotateBy(-anglex); var ro2 = new Vector(this.x,ro1.y).rotateBy(-angley); ve.y = ro1.x ve.z = ro1.y; ve.x = ro2.x; ve.z = ro2.y; return ve; } reflect(n) { var ve = new Vector(this.x, this.y); ve = ve.subtract(n.scale(2 * ve.dot(n))) return ve; } abs() { var ve = new Vector(this.x, this.y, this.z); ve.x = Math.abs(ve.x); ve.y = Math.abs(ve.y); ve.z = Math.abs(ve.z); return ve; } max(n) { var ve = new Vector(this.x, this.y, this.z); ve.x = Math.max(ve.x, n); ve.y = Math.max(ve.y, n); ve.z = Math.max(ve.z, n); return ve; } } function sortChunks(a, b) { var px=64 var py=64 var atop=((px-a[0])(px-a[0])+(py-a[1])(py-a[1])) var btop=((px-b[0])(px-b[0])+(py-b[1])(py-b[1])) return atop - btop; } function main() { console.log("fart") const glCanvas = document.getElementById('gl-canvas'), gl = glCanvas.getContext('webgl2'); const vertexSource = document.getElementById('vertex-shader').textContent, fragmentSource = document.getElementById('fragment-shader').textContent; const vertexShader = createShader(gl, gl.VERTEX_SHADER, vertexSource), fragmentShader = createShader(gl, gl.FRAGMENT_SHADER, fragmentSource); const program = createProgram(gl, vertexShader, fragmentShader); const aPosition = gl.getAttribLocation(program, 'aPosition') const drawx = gl.getUniformLocation(program, "drawx"); const drawy = gl.getUniformLocation(program, "drawy"); const iTime = gl.getUniformLocation(program, "iTime"); const iChannel0 = gl.getUniformLocation(program,"iChannel0"); const iChannel1 = gl.getUniformLocation(program,"iChannel1"); const blocksData = gl.getUniformLocation(program,"bloccData"); const lightPos = gl.getUniformLocation(program,"lightPos"); const playerPos = gl.getUniformLocation(program,"playerPos"); const positions = new Float32Array([-1, -1, -1, 3, 3, -1]); var chunkPositions=[]; for(var x=0;x<16;x++){ for(var y=0;y<16;y++){ chunkPositions.push([x8,y8]); }} const posBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, posBuffer); gl.bufferData(gl.ARRAY_BUFFER, positions, gl.STATIC_DRAW); gl.viewport(0, 0, 600, 600); gl.clearColor(0, 0, 0, 1); gl.useProgram(program); gl.enableVertexAttribArray(aPosition); let texture0 = gl.createTexture(); let texture1 = gl.createTexture(); gl.uniform1i(iChannel1, 0) gl.uniform1i(iChannel0, 1); gl.activeTexture(gl.TEXTURE0); gl.bindTexture(gl.TEXTURE_2D, texture1); 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); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); ctx3.fillStyle="rgb(255,0,0)" ctx3.fillRect(0,0,1024,1024); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas3); ctx2.imageSmoothingEnabled = false; gl.vertexAttribPointer(aPosition, 2, gl.FLOAT, false, 0, 0) canvas2.height=48; canvas2.width=128; gl.activeTexture(gl.TEXTURE1); gl.bindTexture(gl.TEXTURE_2D, texture0); 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); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); document.getElementById("atlas").crossOrigin="Anonymous" // ctx2.drawImage(document.getElementById("atlas"),0,0,128,48); ctx2.fillStyle="rgb(127,127,255)" ctx2.fillRect(0,0,128,48); gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas2); var numChunksPerFrame=10; gl.activeTexture(gl.TEXTURE0); gl.bindTexture(gl.TEXTURE_2D, texture1); var distance=-2,thetax=-0.0,thetaz=0; var player={x:64,y:0,z:64,vx:0,yv:0,zv:0}; var pre=0; var now; var then = performance.now(); var fps = 50; var delta; var frameCount=40; var interval = 1000 / fps; for (let i = window.requestAnimationFrame(function() {}); i > 0; i--) { window.cancelAnimationFrame(i); } function render() { window.requestAnimationFrame(render); now = performance.now(); delta = now - then; if(frameCount%10==0){ chunkPositions.sort(sortChunks); } for(var i=0;i<numChunksPerFrame;i++){ if(chunkPositions.length>0){ var loadingChunk=chunkPositions.shift(); loadChunk(loadingChunk[0],loadingChunk[1]); }else{ paintLighting(); } } gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas3); if (delta > interval) { then = now - (delta % interval); frameCount+=1; var cards=new Vector(0.5,0) cards=cards.rotateBy(thetaz); if(keys.w){ player.z+=cards.x; player.x+=cards.y; } if(keys.s){ player.z-=cards.x; player.x-=cards.y; } if(keys.a){ player.z+=cards.y; player.x-=cards.x; } if(keys.d){ player.z-=cards.y; player.x+=cards.x; } thetaz=-(mouseX-300)/120; thetax=-(mouseY-300)/140; if(thetax<-Math.PI/2){ thetax=-Math.PI/2; } if(thetax>Math.PI/2){ thetax=Math.PI/2; } gl.clear(gl.COLOR_BUFFER_BIT); if(mouseX===0){ mouseX=300; } if(mouseY===0){ mouseY=300; } gl.uniform1f(drawx, thetaz); gl.uniform1f(drawy, thetax); gl.uniform1f(iTime, frameCount); gl.uniform3f(lightPos, 64,69.0,64.0); gl.uniform3f(playerPos, player.x,fbm(player.x/120,player.z/120)16+37,player.z); gl.drawArrays(gl.TRIANGLES, 0, 3); ctx.drawImage(glCanvas, 0, 0); // gl2.texImage2D(gl2.TEXTURE_2D, 0, gl2.RGBA, gl2.RGBA, gl2.UNSIGNED_BYTE, canvas); // gl2.drawArrays(gl2.TRIANGLES, 0, 3); //ctx.drawImage(bloomCanvas, 0, 0); ctx.font="18px Monospace"; ctx.lineWidth=5; ctx.strokeStyle="rgb(200,255,200)" if(chunkPositions.length>0){ ctx.strokeText("Loading Chunks...",20,25); ctx.strokeRect(20,40,(1-chunkPositions.length/256)560,20); ctx.fillText("Loading Chunks...",20,25); ctx.fillRect(20,40,(1-chunkPositions.length/256)560,20); } if(shadowProgress<64&&shadowProgress>0){ ctx.strokeText("Baking Lighting...",20,25); ctx.strokeRect(20,40,((64-shadowProgress+sx/64+sy/8)/64)560,20); ctx.fillText("Baking Lighting...",20,25); ctx.fillRect(20,40,((64-shadowProgress+sx/64+sy/8)/64)560,20); } ctx.strokeText(Math.round((1000/(performance.now()-pre))10)/10,20,585); ctx.fillText(Math.round((1000/(performance.now()-pre))10)/10,20,585); pre=performance.now(); pmouseX=mouseX; pmouseY=mouseY; } } render(); } main(); </script> <script type> / * A speed-improved perlin and simplex noise algorithms for 2D. * * Based on example code by Stefan Gustavson (stegu@itn.liu.se). * Optimisations by Peter Eastman (peastman@drizzle.stanford.edu). * Better rank ordering method by Stefan Gustavson in 2012. * Converted to Javascript by Joseph Gentle. * * Version 2012-03-09 * * This code was placed in the public domain by its original author, * Stefan Gustavson. You may use it as you see fit, but * attribution is appreciated. * / (function(global) { var module = global.noise = {}; function Grad(x, y, z) { this.x = x; this.y = y; this.z = z; } Grad.prototype.dot2 = function(x, y) { return this.x x + this.y * y; }; Grad.prototype.dot3 = function(x, y, z) { return this.x * x + this.y * y + this.z * z; }; var grad3 = [new Grad(1, 1, 0), new Grad(-1, 1, 0), new Grad(1, -1, 0), new Grad(-1, -1, 0), new Grad(1, 0, 1), new Grad(-1, 0, 1), new Grad(1, 0, -1), new Grad(-1, 0, -1), new Grad(0, 1, 1), new Grad(0, -1, 1), new Grad(0, 1, -1), new Grad(0, -1, -1) ]; var p = [151, 160, 137, 91, 90, 15, 131, 13, 201, 95, 96, 53, 194, 233, 7, 225, 140, 36, 103, 30, 69, 142, 8, 99, 37, 240, 21, 10, 23, 190, 6, 148, 247, 120, 234, 75, 0, 26, 197, 62, 94, 252, 219, 203, 117, 35, 11, 32, 57, 177, 33, 88, 237, 149, 56, 87, 174, 20, 125, 136, 171, 168, 68, 175, 74, 165, 71, 134, 139, 48, 27, 166, 77, 146, 158, 231, 83, 111, 229, 122, 60, 211, 133, 230, 220, 105, 92, 41, 55, 46, 245, 40, 244, 102, 143, 54, 65, 25, 63, 161, 1, 216, 80, 73, 209, 76, 132, 187, 208, 89, 18, 169, 200, 196, 135, 130, 116, 188, 159, 86, 164, 100, 109, 198, 173, 186, 3, 64, 52, 217, 226, 250, 124, 123, 5, 202, 38, 147, 118, 126, 255, 82, 85, 212, 207, 206, 59, 227, 47, 16, 58, 17, 182, 189, 28, 42, 223, 183, 170, 213, 119, 248, 152, 2, 44, 154, 163, 70, 221, 153, 101, 155, 167, 43, 172, 9, 129, 22, 39, 253, 19, 98, 108, 110, 79, 113, 224, 232, 178, 185, 112, 104, 218, 246, 97, 228, 251, 34, 242, 193, 238, 210, 144, 12, 191, 179, 162, 241, 81, 51, 145, 235, 249, 14, 239, 107, 49, 192, 214, 31, 181, 199, 106, 157, 184, 84, 204, 176, 115, 121, 50, 45, 127, 4, 150, 254, 138, 236, 205, 93, 222, 114, 67, 29, 24, 72, 243, 141, 128, 195, 78, 66, 215, 61, 156, 180 ]; // To remove the need for index wrapping, double the permutation table length var perm = new Array(512); var gradP = new Array(512); // This isn't a very good seeding function, but it works ok. It supports 2^16 // different seed values. Write something better if you need more seeds. module.seed = function(seed) { if (seed > 0 && seed < 1) { // Scale the seed out seed = 65536; } seed = Math.floor(seed); if (seed < 256) { seed \|= seed << 8; } for (var i = 0; i < 256; i++) { var v; if (i & 1) { v = p[i] ^ (seed & 255); } else { v = p[i] ^ ((seed >> 8) & 255); } perm[i] = perm[i + 256] = v; gradP[i] = gradP[i + 256] = grad3[v % 12]; } }; module.seed(0); / for(var i=0; i<256; i++) { perm[i] = perm[i + 256] = p[i]; gradP[i] = gradP[i + 256] = grad3[perm[i] % 12]; }/ // Skewing and unskewing factors for 2, 3, and 4 dimensions var F2 = 0.5 (Math.sqrt(3) - 1); var G2 = (3 - Math.sqrt(3)) / 6; var F3 = 1 / 3; var G3 = 1 / 6; // 2D simplex noise module.simplex2 = function(xin, yin) { var n0, n1, n2; // Noise contributions from the three corners // Skew the input space to determine which simplex cell we're in var s = (xin + yin) * F2; // Hairy factor for 2D var i = Math.floor(xin + s); var j = Math.floor(yin + s); var t = (i + j) * G2; var x0 = xin - i + t; // The x,y distances from the cell origin, unskewed. var y0 = yin - j + t; // For the 2D case, the simplex shape is an equilateral triangle. // Determine which simplex we are in. var i1, j1; // Offsets for second (middle) corner of simplex in (i,j) coords if (x0 > y0) { // lower triangle, XY order: (0,0)->(1,0)->(1,1) i1 = 1; j1 = 0; } else { // upper triangle, YX order: (0,0)->(0,1)->(1,1) i1 = 0; j1 = 1; } // A step of (1,0) in (i,j) means a step of (1-c,-c) in (x,y), and // a step of (0,1) in (i,j) means a step of (-c,1-c) in (x,y), where // c = (3-sqrt(3))/6 var x1 = x0 - i1 + G2; // Offsets for middle corner in (x,y) unskewed coords var y1 = y0 - j1 + G2; var x2 = x0 - 1 + 2 * G2; // Offsets for last corner in (x,y) unskewed coords var y2 = y0 - 1 + 2 * G2; // Work out the hashed gradient indices of the three simplex corners i &= 255; j &= 255; var gi0 = gradP[i + perm[j]]; var gi1 = gradP[i + i1 + perm[j + j1]]; var gi2 = gradP[i + 1 + perm[j + 1]]; // Calculate the contribution from the three corners var t0 = 0.5 - x0 * x0 - y0 * y0; if (t0 < 0) { n0 = 0; } else { t0 = t0; n0 = t0 t0 * gi0.dot2(x0, y0); // (x,y) of grad3 used for 2D gradient } var t1 = 0.5 - x1 * x1 - y1 * y1; if (t1 < 0) { n1 = 0; } else { t1 = t1; n1 = t1 t1 * gi1.dot2(x1, y1); } var t2 = 0.5 - x2 * x2 - y2 * y2; if (t2 < 0) { n2 = 0; } else { t2 = t2; n2 = t2 t2 * gi2.dot2(x2, y2); } // Add contributions from each corner to get the final noise value. // The result is scaled to return values in the interval [-1,1]. return 70 * (n0 + n1 + n2); }; // 3D simplex noise module.simplex3 = function(xin, yin, zin) { var n0, n1, n2, n3; // Noise contributions from the four corners // Skew the input space to determine which simplex cell we're in var s = (xin + yin + zin) * F3; // Hairy factor for 2D var i = Math.floor(xin + s); var j = Math.floor(yin + s); var k = Math.floor(zin + s); var t = (i + j + k) * G3; var x0 = xin - i + t; // The x,y distances from the cell origin, unskewed. var y0 = yin - j + t; var z0 = zin - k + t; // For the 3D case, the simplex shape is a slightly irregular tetrahedron. // Determine which simplex we are in. var i1, j1, k1; // Offsets for second corner of simplex in (i,j,k) coords var i2, j2, k2; // Offsets for third corner of simplex in (i,j,k) coords if (x0 >= y0) { if (y0 >= z0) { i1 = 1; j1 = 0; k1 = 0; i2 = 1; j2 = 1; k2 = 0; } else if (x0 >= z0) { i1 = 1; j1 = 0; k1 = 0; i2 = 1; j2 = 0; k2 = 1; } else { i1 = 0; j1 = 0; k1 = 1; i2 = 1; j2 = 0; k2 = 1; } } else { if (y0 < z0) { i1 = 0; j1 = 0; k1 = 1; i2 = 0; j2 = 1; k2 = 1; } else if (x0 < z0) { i1 = 0; j1 = 1; k1 = 0; i2 = 0; j2 = 1; k2 = 1; } else { i1 = 0; j1 = 1; k1 = 0; i2 = 1; j2 = 1; k2 = 0; } } // A step of (1,0,0) in (i,j,k) means a step of (1-c,-c,-c) in (x,y,z), // a step of (0,1,0) in (i,j,k) means a step of (-c,1-c,-c) in (x,y,z), and // a step of (0,0,1) in (i,j,k) means a step of (-c,-c,1-c) in (x,y,z), where // c = 1/6. var x1 = x0 - i1 + G3; // Offsets for second corner var y1 = y0 - j1 + G3; var z1 = z0 - k1 + G3; var x2 = x0 - i2 + 2 * G3; // Offsets for third corner var y2 = y0 - j2 + 2 * G3; var z2 = z0 - k2 + 2 * G3; var x3 = x0 - 1 + 3 * G3; // Offsets for fourth corner var y3 = y0 - 1 + 3 * G3; var z3 = z0 - 1 + 3 * G3; // Work out the hashed gradient indices of the four simplex corners i &= 255; j &= 255; k &= 255; var gi0 = gradP[i + perm[j + perm[k]]]; var gi1 = gradP[i + i1 + perm[j + j1 + perm[k + k1]]]; var gi2 = gradP[i + i2 + perm[j + j2 + perm[k + k2]]]; var gi3 = gradP[i + 1 + perm[j + 1 + perm[k + 1]]]; // Calculate the contribution from the four corners var t0 = 0.6 - x0 * x0 - y0 * y0 - z0 * z0; if (t0 < 0) { n0 = 0; } else { t0 = t0; n0 = t0 t0 * gi0.dot3(x0, y0, z0); // (x,y) of grad3 used for 2D gradient } var t1 = 0.6 - x1 * x1 - y1 * y1 - z1 * z1; if (t1 < 0) { n1 = 0; } else { t1 = t1; n1 = t1 t1 * gi1.dot3(x1, y1, z1); } var t2 = 0.6 - x2 * x2 - y2 * y2 - z2 * z2; if (t2 < 0) { n2 = 0; } else { t2 = t2; n2 = t2 t2 * gi2.dot3(x2, y2, z2); } var t3 = 0.6 - x3 * x3 - y3 * y3 - z3 * z3; if (t3 < 0) { n3 = 0; } else { t3 = t3; n3 = t3 t3 * gi3.dot3(x3, y3, z3); } // Add contributions from each corner to get the final noise value. // The result is scaled to return values in the interval [-1,1]. return 32 * (n0 + n1 + n2 + n3); }; // ##### Perlin noise stuff function fade(t) { return t * t * t * (t * (t * 6 - 15) + 10); } function lerp(a, b, t) { return (1 - t) * a + t * b; } // 2D Perlin Noise module.perlin2 = function(x, y) { // Find unit grid cell containing point var X = Math.floor(x), Y = Math.floor(y); // Get relative xy coordinates of point within that cell x = x - X; y = y - Y; // Wrap the integer cells at 255 (smaller integer period can be introduced here) X = X & 255; Y = Y & 255; // Calculate noise contributions from each of the four corners var n00 = gradP[X + perm[Y]].dot2(x, y); var n01 = gradP[X + perm[Y + 1]].dot2(x, y - 1); var n10 = gradP[X + 1 + perm[Y]].dot2(x - 1, y); var n11 = gradP[X + 1 + perm[Y + 1]].dot2(x - 1, y - 1); // Compute the fade curve value for x var u = fade(x); // Interpolate the four results return lerp( lerp(n00, n10, u), lerp(n01, n11, u), fade(y)); }; // 3D Perlin Noise module.perlin3 = function(x, y, z) { // Find unit grid cell containing point var X = Math.floor(x), Y = Math.floor(y), Z = Math.floor(z); // Get relative xyz coordinates of point within that cell x = x - X; y = y - Y; z = z - Z; // Wrap the integer cells at 255 (smaller integer period can be introduced here) X = X & 255; Y = Y & 255; Z = Z & 255; // Calculate noise contributions from each of the eight corners var n000 = gradP[X + perm[Y + perm[Z]]].dot3(x, y, z); var n001 = gradP[X + perm[Y + perm[Z + 1]]].dot3(x, y, z - 1); var n010 = gradP[X + perm[Y + 1 + perm[Z]]].dot3(x, y - 1, z); var n011 = gradP[X + perm[Y + 1 + perm[Z + 1]]].dot3(x, y - 1, z - 1); var n100 = gradP[X + 1 + perm[Y + perm[Z]]].dot3(x - 1, y, z); var n101 = gradP[X + 1 + perm[Y + perm[Z + 1]]].dot3(x - 1, y, z - 1); var n110 = gradP[X + 1 + perm[Y + 1 + perm[Z]]].dot3(x - 1, y - 1, z); var n111 = gradP[X + 1 + perm[Y + 1 + perm[Z + 1]]].dot3(x - 1, y - 1, z - 1); // Compute the fade curve value for x, y, z var u = fade(x); var v = fade(y); var w = fade(z); // Interpolate return lerp( lerp( lerp(n000, n100, u), lerp(n001, n101, u), w), lerp( lerp(n010, n110, u), lerp(n011, n111, u), w), v); }; })(this); noise.seed(Math.random()); </script> <script></script> </body> </html>
Folds	1202,1566
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgJuf7Y65CAw
Votes	92
Spin-Offs	24
Type	WEBPAGE
Width	400
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Bearkirb314🐻❄️
Author Name	BearKirb314
Author ID	kaid_375460112550893828689953
Author Profile Access	PUBLIC

Archive Data

Added	23 days ago, 1734464235039
Updated	23 days ago, 1734464282715
Source Deleted	unknown