Viewing Program

Program Data

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

Title	lo
ID	4743233600798720
Created	1 years ago, 1696736632538
Updated	1 months ago, 1731621465359
Code	<!DOCTYPE html><html> <title>lo</title> <canvas id='ui-canvas'></canvas> <style>body{margin:0;overflow:hidden;}</style> <script src='https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/2.8.1/gl-matrix-min.js'></script> <script src='https://cdn.jsdelivr.net/gh/Dddatt/D.js@v2.3.0/index.js'></script> <script src='https://cdnjs.cloudflare.com/ajax/libs/cannon.js/0.6.2/cannon.min.js'></script> <script type='application/javascript'> function main(){ let width=window.innerWidth,height=window.innerHeight,aspect=width/height,halfWidth=width>>1,halfHeight=height>>1 let glCanvas=new OffscreenCanvas(width,height) let uiCanvas=document.getElementById('ui-canvas') uiCanvas.width=width uiCanvas.height=height let ctx=uiCanvas.getContext('2d') let gl=D.getContext(glCanvas) D.viewport(0,0,width,height) D.enable3D() D.floatify=(n)=>n+(Math.floor(n)===n?'.':'') // document.oncontextmenu=(e)=>e.preventDefault() let time=0,then,dt,frameCount=0 let staticGeometryProgram=D.createProgram( `#version 300 es precision mediump float; in vec3 vertPos; in vec3 vertCol; in vec3 vertNormal; uniform mat4 viewMatrix; out vec3 pixPos; out vec3 pixCol; out vec3 pixNormal; void main(){ vec4 pos=viewMatrixvec4(vertPos,1); pixPos=vertPos; pixCol=vertCol; pixNormal=vertNormal; gl_Position=pos; } `, `#version 300 es precision mediump float; uniform vec3 camPos; in vec3 pixPos; in vec3 pixCol; in vec3 pixNormal; out vec4 FragColor; vec3 applyLight(float inst,vec3 pos,vec3 normal,vec3 color){ vec3 toLight=pos-pixPos; float x=length(toLight); vec3 normToLight=toLight/x; vec3 normToEye=normalize(camPos-pixPos); vec3 col=max(dot(normToLight,normal)0.5+0.5,0.0)color; float spec=dot(normalize(normToLight+normToEye),normal); spec=spec; spec=spec; spec=spec; spec=spec; spec=spec; spec=spec; spec=spec; return (col+spec0.75)inst/(x); } void main(){ vec3 col=vec3(0); vec3 normal=normalize(pixNormal); col+=applyLight(4.0,vec3(0,5,0),normal,pixCol); FragColor=vec4(col+pixCol0.2,1); } `,1) // let screenMesh=D.createMesh(D.createMeshData({meshes:[{type:'plane',x:0,y:0,z:0,size:2,r:0,g:0,b:0,rx:90,ry:0,rz:0}],order:['x','y'],vl:0}),[['vertPos',2,8,0]]) // [{type:'box',x:0,y:0,z:0,w:1,h:1,l:1,r:1,g:0,b:0,rx:0,ry:0,rz:0}] let vis=[],addVis=(p)=>{ vis.push({type:'box',x:p[0],y:p[1],z:p[2],w:0.1,h:0.1,l:0.1,r:1,g:0,b:0,rx:0,ry:0,rz:0}) },lines={verts:[],index:[]},addLine=(a,b)=>{ let vl=lines.verts.length/9 lines.verts.push(...a,0,0,10,1,1,1,...b,0,0,10,1,1,1) lines.index.push(vl,vl+1) }, epsilon=0.001 class NavMesh{ constructor(cells){ this.cells=cells\|\|[] } clear(){ this.cells=[] return this } add(cellPoints){ let o={nodes:cellPoints,index:this.cells.length}, ab=vec3.sub([],o.nodes[0],o.nodes[1]), ac=vec3.sub([],o.nodes[0],o.nodes[2]), n=vec3.cross([],ab,ac) vec3.normalize(n,n) o.normal=n this.cells.push(o) return this } snapToCell(point){ let cells=this.cells, aabbPasses=[] for(let i=0,l=cells.length;i<l;++i){ let cell=cells[i], aabb=cell.aabb if(point[0]>aabb[0]&&point[1]>aabb[1]&&point[2]>aabb[2]&&point[0]<aabb[3]&&point[1]<aabb[4]&&point[2]<aabb[5]){ aabbPasses[i]=1 } } let closestDist=Infinity,theCell,exact if(aabbPasses.indexOf(1)<0){ for(let i=0,l=cells.length;i<l;++i){ let cell=cells[i], aabb=cell.aabb, dx=(aabb[0]+aabb[3])0.5-point[0], dy=(aabb[1]+aabb[4])0.5-point[1], dz=(aabb[2]+aabb[5])0.5-point[2], d=dxdx+dydy+dzdz aabbPasses[i]=d } for(let i in aabbPasses){ let cell=cells[i], d=vec3.sub([],point,cell.nodes[0]), dot=vec3.dot(d,cell.normal), proj=vec3.scaleAndAdd([],point,cell.normal,-dot), dist=aabbPasses[i] if(dist<closestDist){ closestDist=dist theCell=cell exact=proj } } }else{ for(let i in aabbPasses){ if(!aabbPasses[i])continue let cell=cells[i], d=vec3.sub([],point,cell.nodes[0]), dot=vec3.dot(d,cell.normal), proj=vec3.scaleAndAdd([],point,cell.normal,-dot), dist=Math.abs(dot) if(dist<closestDist){ closestDist=dist theCell=cell exact=proj } } } return {cell:theCell,point:exact} } raycastAABB(rayPos,rayDir,aabb){ //translated and adapted from https://gdbooks.gitbooks.io/3dcollisions/content/Chapter3/raycast_aabb.html let inv_dx=1/rayDir[0], inv_dy=1/rayDir[1], inv_dz=1/rayDir[2], t1=(aabb[0]-rayPos[0])inv_dx, t2=(aabb[3]-rayPos[0])inv_dx, t3=(aabb[1]-rayPos[1])inv_dy, t4=(aabb[4]-rayPos[1])inv_dy, t5=(aabb[2]-rayPos[2])inv_dz, t6=(aabb[5]-(rayPos[2]))inv_dz, tmin=Math.max(Math.max(Math.min(t1,t2),Math.min(t3,t4)),Math.min(t5,t6)), tmax=Math.min(Math.min(Math.max(t1,t2),Math.max(t3,t4)),Math.max(t5,t6)) if(tmax<0\|\|tmin>tmax) return return [tmin,tmax] } raycastAABB_ground(rayPos,rayDir,aabb){ let inv_dx=1/rayDir[0], inv_dz=1/rayDir[2], t1=(aabb[0]-rayPos[0])inv_dx, t2=(aabb[3]-rayPos[0])inv_dx, t3=(aabb[2]-rayPos[2])inv_dz, t4=(aabb[5]-(rayPos[2]))inv_dz, tmin=Math.max(Math.min(t1,t2),Math.min(t3,t4)), tmax=Math.min(Math.max(t1,t2),Math.max(t3,t4)) if(tmax<0\|\|tmin>tmax) return return [tmin,tmax] } precompute(){ let cells=this.cells, uniquePoints=[], connections=[], portals={}, edgeMap=new Map(), hashEdge=(edge)=>{ let a=edge[0].slice(),b=edge[1].slice() if(a[0]>b[0]){ let t=a a=b b=t } if(a[1]>b[1]){ let t=a a=b b=t } if(a[2]>b[2]){ let t=a a=b b=t } return a.toString()+'#'+b.toString() }, hashPoint=(point)=>point.toString() for(let i=0,l=cells.length;i<l;++i){ let aabb=cells[i].aabb=[Infinity,Infinity,Infinity,-Infinity,-Infinity,-Infinity], poly=cells[i].nodes, polyLength=poly.length, edges=poly.map((point,j)=>{ aabb[0]=Math.min(aabb[0],point[0]) aabb[1]=Math.min(aabb[1],point[1]-epsilon) aabb[2]=Math.min(aabb[2],point[2]) aabb[3]=Math.max(aabb[3],point[0]) aabb[4]=Math.max(aabb[4],point[1]+epsilon) aabb[5]=Math.max(aabb[5],point[2]) let h=hashPoint(point) if(!uniquePoints[h]) uniquePoints[h]={connections:[],cells:[]} for(let k=0;k<polyLength;++k){ if(k!==j) uniquePoints[h].connections.push(hashPoint(poly[k])) } uniquePoints[h].cells.push(i) let nextPoint=poly[(j+1)%polyLength] return [point,nextPoint] }) for(let j=0,jl=edges.length;j<jl;++j){ let edge=edges[j], sEdge=hashEdge(edge) if(!edgeMap.has(sEdge)) edgeMap.set(sEdge,[]) edgeMap.get(sEdge).push(i) } } edgeMap.forEach((polyIndices,edge)=>{ if(polyIndices.length>1) portals[edge]=polyIndices }) // for(let i in uniquePoints){ // addVis(i.split(',').map(x=>Number(x))) // } // for(let i in portals){ // let p=i.split('#') // addLine(p[0].split(',').map(x=>Number(x)),p[1].split(',').map(x=>Number(x))) // } this.uniquePoints=uniquePoints this.portals=portals } computePath(startPoint,endPoint){ let start=this.snapToCell(startPoint.slice()), end=this.snapToCell(endPoint.slice()), distance=(a,b)=>{ let x=a[0]-b[0], y=(a[1]-b[1]), z=a[2]-b[2] return xx+yy+zz }, hashPoint=(point)=>point.toString(), unhashPoint=(s)=>s.split(',').map(x=>x-0), cells=this.cells, nodes=this.uniquePoints, portals=this.portals, open=[], closed=[], finalNode, done,safe=99999 for(let i in start.cell.nodes){ open.push(hashPoint(start.cell.nodes[i])) } for(let i in nodes){ let p=unhashPoint(i) nodes[i].g=distance(p,start.point) nodes[i].h=distance(p,end.point) nodes[i].f=nodes[i].g+nodes[i].h nodes[i].parent=0 } //g=dist to start //h=dist to end //f=g+h while(!done&&safe--){ //set current let l=Infinity,c,cIndex for(let i in open){ if(nodes[open[i]].f<l){ l=nodes[open[i]].f c=open[i].slice() cIndex=i } } //done if nothing left if(!c\|\|c&&nodes[c].cells.indexOf(end.cell.index)>-1){ finalNode=c done=1 break } //remove current from open open.splice(cIndex,1) //add current to closed closed.push(c.slice()) let neighbors=nodes[c].connections for(let i in neighbors){ if(closed.indexOf(neighbors[i])>-1)continue let inOpen=open.indexOf(neighbors[i])>-1 let newCost=nodes[c].g+distance(unhashPoint(c),unhashPoint(neighbors[i])) if(!inOpen\|\|newCost<nodes[neighbors[i]].g){ nodes[neighbors[i]].parent=c nodes[neighbors[i]].g=newCost nodes[neighbors[i]].f=nodes[neighbors[i]].g+nodes[neighbors[i]].h if(!inOpen) open.push(neighbors[i]) } } } let path=[],pathKey=[],fn=finalNode,bounds=[],clean=[], alloc=[],_safe=99 while(1){ pathKey.push(fn) path.push(unhashPoint(fn)) bounds.push(...nodes[fn].cells) fn=nodes[fn].parent if(!fn)break } bounds=[...new Set(bounds)] path.push(start.point) path.reverse() path.push(end.point) for(let i=0,l=path.length;i<l;++i){ let origin=path[i],fullyLegal=1, lastDirY=0 if(i+2<l){ for(let j=i+2,jl=path.length;j<jl;++j){ let tester=path[j], dir=vec3.sub([],tester,origin), m=Math.sqrt(dir[0]dir[0]+dir[1]dir[1]+dir[2]dir[2]), dm=1/m dir[0]=dm dir[1]=dm dir[2]=dm if(Math.abs(lastDirY-dir[1])>epsilon){ clean.push(origin,tester) i=i+1 fullyLegal=0 break } lastDirY=dir[1] let intervals=[],legal=1 for(let k=0,kl=bounds.length;k<kl;++k){ let aabb=cells[bounds[k]].aabb, cast=this.raycastAABB(origin,dir,aabb) if(cast) intervals.push(cast) } intervals.sort((a,b)=>(a[0]+a[1])-(b[0]+b[1])) for(let k=1;k<intervals.length;++k){ if(!(intervals[k][0]<m+epsilon&&intervals[k][0]-intervals[k-1][1]<epsilon)){ legal=0 break } } if(!legal){ fullyLegal=0 clean.push(origin,path[j-1]) i=j-2 break } } } if(fullyLegal){ clean.push(origin,end.point) break } } for(let i in clean){ if(i>0) addLine(clean[i],clean[i-1]) } // for(let i in path){ // if(i>0) // addLine(path[i],path[i-1]) // } addVis(start.point) addVis(end.point) return path } } let navmesh=new NavMesh(), meshes={verts:[],index:[]}, addCell=(nodes)=>{ navmesh.add(nodes) let ab=vec3.sub([],nodes[0],nodes[1]), ac=vec3.sub([],nodes[1],nodes[2]) vec3.normalize(ab,ab) vec3.normalize(ac,ac) if(vec3.dot(ab,ac)===1){ vec3.sub(ab,nodes[3],nodes[2]) vec3.normalize(ab,ab) } let [nx,ny,nz]=vec3.cross([],ab,ac), cr=0,cg=1,cb=navmesh.cells.length0.15 let vl=meshes.verts.length/9 for(let i=0,l=nodes.length;i<l;i++){ meshes.verts.push(...nodes[i],cr,cg,cb,nx,ny,nz) if(i>1){ meshes.index.push(vl,vl+i-1,vl+i,vl+i,vl+i-1,vl) } } } { addCell([ [-1,0,-1], [-1,0,1], [0,0,1], [1,0,1], [1,0,-1], ]) addCell([ [-1,0,1], [-1,0,-1], [-2,1,-1], [-2,1,1], ]) addCell([ [-4,1,-3], [-4,1,1], [-2,1,1], [-2,1,-1], [-2,1,-3], ]) addCell([ [-2,1,-3], [-2,1,-1], [2,1,-1], [2,1,-3], ]) addCell([ [-1,0,1], [-1,0,3], [0,0,3], [0,0,2], [0,0,1], ]) addCell([ [0,0,2], [0,0,3], [2,0,3], [2,0,2], [1,0,2], ]) addCell([ [1,0,-1], [1,0,1], [1,0,2], [2,0,2], [2,0,-1], ]) } navmesh.precompute() navmesh.computePath([1.5,0,2.5],[-1.1,1,-2]) let mesh=D.createMesh( {verts:new Float32Array(meshes.verts),index:new Uint32Array(meshes.index),primitive:'TRIANGLES'}, [['vertPos',3,36,0],['vertCol',3,36,12],['vertNormal',3,36,24]]), visMesh=D.createMesh( D.createMeshData({ meshes:vis, vl:0, order:['x','y','z','r','g','b','nx','ny','nz'] }), [['vertPos',3,36,0],['vertCol',3,36,12],['vertNormal',3,36,24]]), lineMesh=D.createMesh( {verts:new Float32Array(lines.verts),index:new Uint32Array(lines.index),primitive:'LINES'}, [['vertPos',3,36,0],['vertCol',3,36,12],['vertNormal',3,36,24]]) let keys={},player=(function(player){ player.projectionMatrix=D.perspectiveMatrix(80,aspect,0.1,200) player.viewMatrix=D.createIdentityMatrix() player.x=0 player.y=2 player.z=3 player.vx=0 player.vy=0 player.vz=0 player.yaw=0 player.pitch=0.5 player.sensitivity=0.005 document.onkeydown=(e)=>{ keys[e.key.toLowerCase()]=1 } document.onkeyup=(e)=>keys[e.key.toLowerCase()]=0 uiCanvas.onmousedown=(e)=>{ uiCanvas.requestPointerLock() } uiCanvas.onmousemove=(e)=>{ player.yaw+=e.movementXplayer.sensitivity player.pitch=D.constrain(player.pitch+e.movementYplayer.sensitivity,-D.HALF_PI,D.HALF_PI) } player.update=()=>{ let sinYaw=Math.sin(player.yaw),cosYaw=Math.cos(player.yaw),dx=0,dy=0,dz=0 if(keys.w){ dx+=sinYaw dz-=cosYaw } if(keys.s){ dx-=sinYaw dz+=cosYaw } if(keys.a){ dx-=cosYaw dz-=sinYaw } if(keys.d){ dx+=cosYaw dz+=sinYaw } if(keys[' ']) dy+=1 if(keys.shift) dy-=1 let d=1/(dt10+1),dm=dt60/(Math.sqrt(dxdx+dydy+dzdz)\|\|1) player.vx=(player.vx+dxdm)d player.vy=(player.vy+dydm)d player.vz=(player.vz+dzdm)d player.x+=player.vxdt player.y+=player.vydt player.z+=player.vzdt player.viewInfo=D.setViewMatrix(player.viewMatrix,player.projectionMatrix,player.x,player.y,player.z,player.yaw,player.pitch) } return player })({}) gl.clearColor(0,0,0,1) function loop(now){ frameCount++ dt=D.constrain((now-then)0.001,0,0.05) time+=dt gl.clear(16640) player.update() D.useProgram(staticGeometryProgram) D.setUniform('viewMatrix',player.viewMatrix) D.setUniform('camPos',player.viewInfo.camPos) D.renderMesh(mesh) D.renderMesh(visMesh) D.renderMesh(lineMesh) ctx.drawImage(glCanvas,0,0) then=now window.parent.raf=window.requestAnimationFrame(loop) } if(window.parent.raf) window.cancelAnimationFrame(window.parent.raf) loop(then=performance.now()) } inter=window.setInterval(function(){if(window.innerWidth){main(0);window.clearInterval(inter)}}); </script> <!--For restart button--> <script></script> </html>
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgPOOor62CAw
Votes	1
Spin-Offs	1
Type	WEBPAGE
Width	400
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Dat
Author Name	Dddatt
Author ID	kaid_4164356982737975081215128
Author Profile Access	COACH

Archive Data

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