Spaces:
Running
Running
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> | |
| <title>ANTTI'S BRAIN — DESCENT · infinite procedural key-hunt</title> | |
| <style> | |
| :root{ | |
| --void:#04060b; --ink:#c9d4e0; --amber:#e8b13a; --amber-dim:#8a6d2c; | |
| --cyan:#54d2e2; --line:#1b2436; --dim:#67788d; --green:#4ec98f; --red:#e06060; | |
| --gold:#ffd76a; | |
| } | |
| *{box-sizing:border-box} | |
| html,body{margin:0;height:100%;background:var(--void);overflow:hidden; | |
| font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:var(--ink)} | |
| #gl{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:grab} | |
| #gl.drag{cursor:grabbing} | |
| .panel{position:fixed;background:rgba(6,9,16,.74);border:1px solid var(--line); | |
| backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)} | |
| #hud{top:14px;left:14px;padding:12px 14px;min-width:270px;font-size:11px;line-height:1.7} | |
| #hud .ttl{color:var(--amber);letter-spacing:.16em;font-size:10px; | |
| text-transform:uppercase;margin-bottom:8px;display:flex;justify-content:space-between;gap:18px} | |
| #hud .ttl b{color:var(--amber-dim);font-weight:400} | |
| #hud .row{display:flex;justify-content:space-between;color:#8494a8;gap:14px} | |
| #hud .row span{color:var(--ink)} | |
| #hud .row .k{color:var(--dim)} | |
| #hud .row .room{color:var(--cyan);letter-spacing:.08em} | |
| #hud .row .lvl{color:var(--gold);letter-spacing:.12em} | |
| #hud .row .keyok{color:var(--green)} | |
| #hud .row .keyno{color:var(--gold)} | |
| #resWrap{margin-top:6px} | |
| #resWrap label{display:flex;justify-content:space-between;color:var(--dim);font-size:10px;margin-bottom:3px} | |
| #resWrap label span{color:var(--gold)} | |
| #resBar{height:4px;background:var(--line);position:relative;overflow:hidden} | |
| #resFill{position:absolute;inset:0;width:0%;background:linear-gradient(90deg,#8a6d2c,var(--gold)); | |
| transition:width .25s} | |
| #hud .note{margin-top:7px;border-top:1px solid var(--line);padding-top:6px; | |
| color:var(--dim);font-size:10px;line-height:1.6;max-width:300px} | |
| #ctl{bottom:14px;left:14px;padding:12px 14px;width:288px;font-size:11px} | |
| #ctl h2{margin:0 0 9px;font-size:10px;letter-spacing:.16em;text-transform:uppercase; | |
| color:var(--cyan);font-weight:600} | |
| .modes{display:flex;gap:6px;margin-bottom:11px} | |
| .modes button{flex:1} | |
| .field{margin:8px 0} | |
| .field label{display:flex;justify-content:space-between;color:#8494a8;margin-bottom:4px} | |
| .field label var{color:var(--ink);font-style:normal} | |
| input[type=range]{width:100%;height:2px;-webkit-appearance:none;appearance:none; | |
| background:var(--line);outline:none;margin:6px 0} | |
| input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px; | |
| border-radius:50%;background:var(--amber);cursor:pointer;border:2px solid var(--void)} | |
| input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%; | |
| background:var(--amber);cursor:pointer;border:2px solid var(--void)} | |
| .btns{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap} | |
| button{flex:1;min-width:56px;padding:7px 4px;background:transparent;color:var(--ink); | |
| border:1px solid var(--line);font:inherit;font-size:10px;letter-spacing:.05em; | |
| cursor:pointer;transition:.15s;text-transform:uppercase} | |
| button:hover{border-color:var(--amber-dim);color:var(--amber)} | |
| button.on{border-color:var(--cyan);color:var(--cyan)} | |
| button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px} | |
| #stat{margin-top:7px;font-size:10px;color:var(--dim);min-height:13px;word-break:break-all} | |
| #help{bottom:14px;right:14px;padding:11px 13px;font-size:10.5px;line-height:1.85; | |
| color:#73859a;text-align:right} | |
| #help b{color:var(--amber)} | |
| #banner{position:fixed;top:38%;left:0;right:0;text-align:center;pointer-events:none; | |
| opacity:0;transition:opacity .5s;z-index:8} | |
| #banner .b1{font-size:22px;letter-spacing:.4em;color:var(--gold);text-transform:uppercase; | |
| text-shadow:0 0 24px rgba(255,215,106,.55)} | |
| #banner .b2{font-size:11px;color:var(--dim);margin-top:8px;letter-spacing:.14em} | |
| #banner.show{opacity:1} | |
| #boot{position:fixed;inset:0;display:flex;flex-direction:column;gap:10px; | |
| align-items:center;justify-content:center;background:rgba(4,6,11,.92);z-index:9; | |
| transition:opacity .8s;text-align:center;padding:20px} | |
| #boot.gone{opacity:0;pointer-events:none} | |
| #boot .big{font-size:15px;letter-spacing:.28em;color:var(--amber)} | |
| #boot .sub{font-size:11px;color:var(--dim);line-height:1.9;max-width:520px} | |
| #boot .sub em{color:var(--gold);font-style:normal} | |
| #bootStat{font-size:11px;color:var(--cyan);letter-spacing:.12em;min-height:14px} | |
| #boot.err .big{color:var(--red)} | |
| #boot.err .sub{color:#c99;word-break:break-all;text-align:left} | |
| </style> | |
| <canvas id="gl"></canvas> | |
| <div id="boot"> | |
| <div class="big">ANTTI'S BRAIN — DESCENT</div> | |
| <div class="sub">an endless chain of chambers, hallucinated from one seed.<br> | |
| each level is a run of rooms. somewhere in it, one crystal is not like the others:<br> | |
| it pulses <em>gold</em>. touch it, and the red seal on the far gate dissolves.<br> | |
| pass the gate: next level. rooms grow heavier, more twisted, stranger in shape.<br><br> | |
| the <em>resonance</em> meter runs hot as you near the key. no enemies, no clocks —<br> | |
| only geometry, depth, and the hash. nothing is stored; walk back and every<br> | |
| room is re-dreamed identically. click / drag to enter · mouse look is inverted.</div> | |
| <div id="bootStat">waking up…</div> | |
| </div> | |
| <div id="banner"><div class="b1" id="bn1"></div><div class="b2" id="bn2"></div></div> | |
| <div id="hud" class="panel"> | |
| <div class="ttl">Brain — Descent <b id="fps">— fps</b></div> | |
| <div class="row"><span class="k">level</span><span class="lvl" id="lvlV">1</span></div> | |
| <div class="row"><span class="k">room in level</span><span id="progV">—</span></div> | |
| <div class="row"><span class="k">chamber</span><span class="room" id="roomV">—</span></div> | |
| <div class="row"><span class="k">index / shape</span><span id="roomI">—</span></div> | |
| <div class="row"><span class="k">mass · twist</span><span id="massV">—</span></div> | |
| <div class="row"><span class="k">key crystal</span><span id="keyV" class="keyno">not found</span></div> | |
| <div id="resWrap"><label>resonance <span id="resT">—</span></label> | |
| <div id="resBar"><div id="resFill"></div></div></div> | |
| <div class="row" style="margin-top:6px"><span class="k">mode</span><span id="modeV">Boundary</span></div> | |
| <div class="row"><span class="k">boundary</span><span id="src">—</span></div> | |
| <div class="row"><span class="k">music</span><span id="musV">—</span></div> | |
| <div class="row"><span class="k">position</span><span id="pos">—</span></div> | |
| <div class="note" id="modeNote">—</div> | |
| </div> | |
| <div id="ctl" class="panel"> | |
| <h2>The descent</h2> | |
| <div class="modes"> | |
| <button id="m0" class="on">Boundary</button> | |
| <button id="m1">Projection</button> | |
| <button id="m2">Cascade</button> | |
| </div> | |
| <div class="field"><label>Mass gain <var id="m_l">1.0</var></label> | |
| <input id="m" type="range" min="0.2" max="2.2" step="0.05" value="1.0"></div> | |
| <div class="field"><label>Lensing <var id="g_l">1.0</var></label> | |
| <input id="g" type="range" min="0" max="3" step="0.05" value="1.0"></div> | |
| <div class="field"><label>Music volume <var id="v_l">0.5</var></label> | |
| <input id="v" type="range" min="0" max="1" step="0.05" value="0.5"></div> | |
| <div class="btns"> | |
| <button id="bSave">Save</button> | |
| <button id="bLoad">Load</button> | |
| <button id="bCode">Save code</button> | |
| </div> | |
| <div class="btns"> | |
| <button id="bMus" class="on">Music: on</button> | |
| <button id="bSrc">Test pattern</button> | |
| </div> | |
| <div class="btns"> | |
| <button id="bSeed">New brain</button> | |
| <button id="bIdle" class="on">Idle spin: on</button> | |
| </div> | |
| <div id="stat"></div> | |
| </div> | |
| <div id="help" class="panel"> | |
| <b>W A S D</b> move · <b>Q E</b> down/up<br> | |
| drag to look (inverted) · <b>shift</b> boost<br> | |
| gold pulse = the key · red membrane = the seal<br> | |
| the amber thread lives in the gates | |
| </div> | |
| <video id="vid" style="display:none" playsinline muted></video> | |
| <script> | |
| ; | |
| /* Do not hype. Do not lie. Just show. */ | |
| const $=id=>document.getElementById(id); | |
| const cvs=$('gl'), boot=$('boot'); | |
| /* any failure paints itself on the boot screen instead of dying silently */ | |
| function bootErr(t){ | |
| boot.classList.add('err');boot.classList.remove('gone'); | |
| boot.innerHTML='<div class="big">It broke — here is why</div><div class="sub">' | |
| +String(t).replace(/[<>&]/g,c=>({'<':'<','>':'>','&':'&'}[c])).slice(0,600)+'</div>'; | |
| } | |
| window.onerror=(m,s,l,c,e)=>{bootErr((e&&e.stack)||m+' @ line '+l);}; | |
| window.addEventListener('unhandledrejection',e=>bootErr(e.reason)); | |
| let gl=cvs.getContext('webgl2',{antialias:false,powerPreference:'high-performance'}); | |
| if(!gl)gl=cvs.getContext('webgl2'); | |
| if(!gl){bootErr('No WebGL2 — this brain needs a WebGL2 browser.');throw new Error('no webgl2');} | |
| const MAXW=15; /* up to 5 moons x 3 live rooms */ | |
| const VERT=`#version 300 es | |
| void main(){vec2 p=vec2((gl_VertexID<<1)&2,gl_VertexID&2);gl_Position=vec4(p*2.0-1.0,0.0,1.0);}`; | |
| const FRAG=`#version 300 es | |
| precision highp float; | |
| out vec4 O; | |
| uniform vec2 iRes; | |
| uniform float iTime; | |
| uniform vec3 camP,camR,camU,camF; | |
| uniform int nWell,mode,keyWell; | |
| uniform vec4 wells[${MAXW}]; /* xyz pos · w size */ | |
| uniform vec3 wellCol[${MAXW}]; | |
| uniform vec4 wellPar[${MAXW}]; /* x shape · y angA · z angB · w star-n */ | |
| uniform vec3 roomPos[3]; /* prev · current · next */ | |
| uniform vec4 roomPar[3]; /* x shape · y size · z half-height · w star-n */ | |
| uniform vec4 roomMod[3]; /* x twist · y ripple amp · z ripple freq · w mass */ | |
| uniform vec3 roomTintU[3]; | |
| uniform vec4 seal; /* xyz pos · w radius (<0 = open) */ | |
| uniform float mGain,lensK; | |
| uniform sampler2D camTex; | |
| /* ---------- primitives ---------- */ | |
| vec2 rot2(vec2 v,float a){float c=cos(a),s=sin(a);return vec2(c*v.x-s*v.y,s*v.x+c*v.y);} | |
| float sdBox3(vec3 p,vec3 b){vec3 q=abs(p)-b;return length(max(q,0.))+min(max(q.x,max(q.y,q.z)),0.);} | |
| float sdHexP(vec3 p,vec2 h){ /* cross-section xy · half-height z */ | |
| const vec3 k=vec3(-0.8660254,0.5,0.57735); | |
| p=abs(p); | |
| p.xy-=2.0*min(dot(k.xy,p.xy),0.0)*k.xy; | |
| vec2 d=vec2(length(p.xy-vec2(clamp(p.x,-k.z*h.x,k.z*h.x),h.x))*sign(p.y-h.x),p.z-h.y); | |
| return min(max(d.x,d.y),0.0)+length(max(d,0.0));} | |
| float sdStarN(vec2 p,float r,float n,float m){ /* n-pointed star, m in (2,n) */ | |
| float an=3.1415927/n, en=3.1415927/m; | |
| vec2 acs=vec2(cos(an),sin(an)), ecs=vec2(cos(en),sin(en)); | |
| float bn=mod(atan(p.x,p.y),2.0*an)-an; | |
| p=length(p)*vec2(cos(bn),abs(sin(bn))); | |
| p-=r*acs; | |
| p+=ecs*clamp(-dot(p,ecs),0.0,r*acs.y/ecs.y); | |
| return length(p)*sign(p.x);} | |
| float sdOcta(vec3 p,float s){p=abs(p);return (p.x+p.y+p.z-s)*0.57735;} | |
| float opExtr(float d2,float z,float h){vec2 w=vec2(d2,abs(z)-h); | |
| return min(max(w.x,w.y),0.0)+length(max(w,0.0));} | |
| float sdSeg(vec3 p,vec3 a,vec3 b){vec3 pa=p-a,ba=b-a; | |
| float h=clamp(dot(pa,ba)/dot(ba,ba),0.0,1.0);return length(pa-ba*h);} | |
| /* ---------- the twelve shapes. rooms and moons share this ONE chain ---------- | |
| signed, negative inside. s = radius-ish, h = half-height, n = star points */ | |
| float shapeSD(vec3 q,float sh,float s,float h,float n){ | |
| int i=int(sh+0.5); | |
| if(i==0) return sdBox3(q,vec3(s,h,s)); | |
| if(i==1) return length(q)-s; | |
| if(i==2) return sdHexP(vec3(q.x,q.z,q.y),vec2(s,h)); | |
| if(i==3){float m=2.0+(n-2.0)*0.45; | |
| return opExtr(sdStarN(q.xz,s*1.15,n,m),q.y,h);} | |
| if(i==4) return sdOcta(q,s*1.5); | |
| if(i==5) return max(length(q.xz)-s,abs(q.y)-h); /* cylinder */ | |
| if(i==6){vec3 c=q; c.y-=clamp(c.y,-h*0.55,h*0.55); /* capsule vault */ | |
| return length(c)-s*0.90;} | |
| if(i==7) return max(sdBox3(q,vec3(s*0.95)),sdOcta(q,s*1.45)); /* cut crystal */ | |
| if(i==8) return (length(vec3(q.x,q.y*1.35,q.z))-s*1.08)*0.72; /* ellipsoid dome */ | |
| if(i==9) return min(sdBox3(q,vec3(s,h*0.55,s*0.38)), /* cross cathedral */ | |
| min(sdBox3(q,vec3(s*0.38,h*0.55,s)), | |
| sdBox3(q,vec3(s*0.45,h,s*0.45)))); | |
| if(i==10){float a=atan(q.z,q.x); /* gear */ | |
| float rr=s*(0.88+0.11*cos(a*n*2.0)); | |
| return max(length(q.xz)-rr,abs(q.y)-h)*0.68;} | |
| /* 11 = wheel: torus + hub + four spokes, all walkable */ | |
| float tor=length(vec2(length(q.xz)-s*0.72,q.y))-s*0.40; | |
| float hub=length(q)-s*0.40; | |
| float sp=min(min(sdSeg(q,vec3(0.),vec3(s*0.72,0.,0.)), | |
| sdSeg(q,vec3(0.),vec3(-s*0.72,0.,0.))), | |
| min(sdSeg(q,vec3(0.),vec3(0.,0.,s*0.72)), | |
| sdSeg(q,vec3(0.),vec3(0.,0.,-s*0.72))))-s*0.17; | |
| return min(tor,min(hub,sp)); | |
| } | |
| float roomSD(vec3 p,int r){ | |
| vec3 q=p-roomPos[r]; | |
| float tw=roomMod[r].x; | |
| if(abs(tw)>0.0005) q.xz=rot2(q.xz,q.y*tw); | |
| float d=shapeSD(q,roomPar[r].x,roomPar[r].y,roomPar[r].z,roomPar[r].w); | |
| float ra=roomMod[r].y; | |
| if(ra>0.001) d+=ra*sin(q.x*roomMod[r].z)*sin(q.y*roomMod[r].z)*sin(q.z*roomMod[r].z); | |
| return d/(1.0+abs(tw)*roomPar[r].y*0.6+ra*roomMod[r].z); /* Lipschitz guard */ | |
| } | |
| float worldSD(vec3 p){ | |
| float d=min(roomSD(p,0),min(roomSD(p,1),roomSD(p,2))); | |
| d=min(d,sdSeg(p,roomPos[0],roomPos[1])-1.7); | |
| d=min(d,sdSeg(p,roomPos[1],roomPos[2])-1.7); | |
| return d;} | |
| int nearestRoom(vec3 p){ | |
| float d0=roomSD(p,0),d1=roomSD(p,1),d2=roomSD(p,2); | |
| return d0<d1?(d0<d2?0:2):(d1<d2?1:2);} | |
| vec3 wallNormal(vec3 p){ /* inward-facing */ | |
| const vec2 e=vec2(0.02,-0.02); | |
| return -normalize( | |
| e.xyy*worldSD(p+e.xyy)+e.yyx*worldSD(p+e.yyx)+ | |
| e.yxy*worldSD(p+e.yxy)+e.xxx*worldSD(p+e.xxx));} | |
| /* ---------- moons: the same twelve shapes, shrunk and rounded into glass. | |
| core-scale, height-scale and rounding radius per shape, from const tables — | |
| this keeps the shader small enough for slow driver compilers ---------- */ | |
| const float CS[12]=float[12](0.50,1.00,0.60,0.765,0.613,0.52,0.644,0.590,0.740,0.600,0.568,0.55); | |
| const float CH[12]=float[12](0.50,1.00,0.34,0.180,0.613,0.42,0.545,0.590,0.740,0.470,0.280,0.55); | |
| const float CR[12]=float[12](0.26,0.00,0.22,0.16,0.24,0.20,0.00,0.18,0.06,0.14,0.12,0.10); | |
| float moonSD(vec3 p,int k){ | |
| vec3 q=p-wells[k].xyz; | |
| float s=wells[k].w; | |
| float bs=length(q)-s*2.2; | |
| if(bs>0.6) return bs; | |
| q.xz=rot2(q.xz,wellPar[k].y); | |
| q.xy=rot2(q.xy,wellPar[k].z); | |
| int i=int(wellPar[k].x+0.5); | |
| return shapeSD(q,wellPar[k].x,s*CS[i],s*CH[i],wellPar[k].w)-s*CR[i]; | |
| } | |
| vec3 moonNormal(vec3 p,int k){ | |
| const vec2 e=vec2(0.012,-0.012); | |
| return normalize( | |
| e.xyy*moonSD(p+e.xyy,k)+e.yyx*moonSD(p+e.yyx,k)+ | |
| e.yxy*moonSD(p+e.yxy,k)+e.xxx*moonSD(p+e.xxx,k));} | |
| /* ---------- boundary images ---------- */ | |
| vec3 eqSample(vec3 n){ | |
| float u=0.5+atan(n.z,n.x)*0.159155; | |
| float v=0.5-asin(clamp(n.y,-1.0,1.0))*0.318310; | |
| return texture(camTex,vec2(1.0-u,v)).rgb;} | |
| vec3 wallImg(vec3 p){ | |
| int r=nearestRoom(p); | |
| return eqSample(normalize(p-roomPos[r]))*roomTintU[r];} | |
| void main(){ | |
| vec2 uv0=(gl_FragCoord.xy-0.5*iRes)/iRes.y; | |
| vec3 x=camP; | |
| vec3 rd=normalize(uv0.x*camR+uv0.y*camU+1.5*camF); | |
| vec3 glow=vec3(0.0), tint=vec3(1.0), accum=vec3(0.0), col=vec3(0.0); | |
| float trav=0.0, stp=0.05; | |
| int bnc=0; bool done=false; | |
| const int MAXB=12; | |
| /* the amber thread lives only in the corridors, not in the rooms */ | |
| vec3 gA0=mix(roomPos[0],roomPos[1],0.28), gB0=mix(roomPos[0],roomPos[1],0.72); | |
| vec3 gA1=mix(roomPos[1],roomPos[2],0.28), gB1=mix(roomPos[1],roomPos[2],0.72); | |
| for(int i=0;i<180;i++){ | |
| /* lensing: deflection per path length, dtheta ~ gradPhi * ds */ | |
| if(lensK>0.001){ | |
| vec3 pull=vec3(0.0); | |
| for(int k=0;k<nWell;k++){ | |
| vec3 dv=wells[k].xyz-x; float r2=dot(dv,dv)+0.4; | |
| pull+=dv*inversesqrt(r2)*(wells[k].w*mGain/r2); } | |
| rd=normalize(rd+pull*stp*0.055*lensK); | |
| } | |
| float dm=1e9; int hb=-1; | |
| for(int k=0;k<nWell;k++){ | |
| float sd=moonSD(x,k); | |
| float r=length(x-wells[k].xyz); | |
| float e=wells[k].w*mGain/(r+1.0); | |
| glow+=wellCol[k]*e*e*0.03*stp; | |
| if(k==keyWell) /* the key crystal breathes gold */ | |
| glow+=vec3(1.0,0.80,0.30)*e*e*(0.05+0.045*sin(iTime*4.0))*stp; | |
| if(sd<dm){dm=sd;hb=k;} } | |
| float dw=-worldSD(x); | |
| { | |
| float dg=min(sdSeg(x,gA0,gB0),sdSeg(x,gA1,gB1)); | |
| glow+=vec3(0.91,0.69,0.23)*(0.010*stp/(dg*dg+0.15))*smoothstep(4.0,1.0,dg); | |
| } | |
| float dsl=1e9; | |
| if(seal.w>0.0){ | |
| dsl=length(x-seal.xyz)-seal.w; | |
| glow+=vec3(0.95,0.22,0.18)*(0.012*stp/(dsl*dsl+0.22))*smoothstep(6.0,1.5,dsl); | |
| if(dsl<0.04){ /* the red membrane: sealed exit */ | |
| float pl=0.5+0.5*sin(iTime*3.0+x.y*2.2+x.x*1.3); | |
| col=(vec3(0.72,0.10,0.09)+vec3(0.35,0.06,0.05)*pl)*tint; | |
| done=true; break; | |
| } | |
| } | |
| if(dm<0.03 && hb>=0){ | |
| vec3 n=moonNormal(x,hb); | |
| float F=0.04+0.96*pow(1.0-max(dot(-rd,n),0.0),5.0); /* Schlick, glass F0 */ | |
| if(mode==1){ /* PROJECTION: moons carry the image (opaque) */ | |
| float L=0.0; for(int k=0;k<nWell;k++){ | |
| L+=wells[k].w*mGain/(length(x-wells[k].xyz)+1.0);} | |
| col=tint*eqSample(n)*(0.55+0.7*min(L,1.4)); done=true; break; | |
| } | |
| /* BOUNDARY & CASCADE: heavy optical crystal. | |
| Fresnel glints off the surface; the ray itself REFRACTS (Snell), | |
| marches the negative-distance chord inside, exits the far side, | |
| and keeps flying — you see the world warped through the glass. */ | |
| glow+=tint*eqSample(reflect(rd,n))*F*0.55; /* mirror glint, Fresnel-weighted */ | |
| if(mode==2) accum+=tint*eqSample(n)*F*1.1; /* cascade: crystal wears the face at the rims */ | |
| bnc++; if(bnc>MAXB){col=(mode==2)?accum:vec3(0.0);done=true;break;} | |
| const float IOR=1.45; | |
| vec3 d=refract(rd,n,1.0/IOR); | |
| if(dot(d,d)<1e-4) d=reflect(rd,n); /* entry-grazing guard */ | |
| x-=n*0.04; /* step inside the glass */ | |
| float chord=0.0; | |
| for(int j=0;j<26;j++){ | |
| float sd=moonSD(x,hb); | |
| if(sd>-0.006){ /* reached the far surface */ | |
| vec3 ne=moonNormal(x,hb); | |
| vec3 ro=refract(d,-ne,IOR); | |
| if(dot(ro,ro)<1e-4){ d=reflect(d,-ne); x+=d*0.03; chord+=0.03; continue; } /* TIR: bounce inside */ | |
| d=ro; break; /* refract out */ | |
| } | |
| float st=max(-sd*0.8,0.025); | |
| x+=d*st; chord+=st; | |
| } | |
| /* Beer-Lambert: the crystal's colour tints what passes through, by chord length */ | |
| tint*=exp(-(vec3(1.0)-wellCol[hb])*chord*0.35)*0.96; | |
| rd=d; | |
| vec3 ne2=moonNormal(x,hb); | |
| for(int j=0;j<10;j++){ if(moonSD(x,hb)>0.05)break; x+=ne2*0.05; } | |
| x+=rd*0.04; trav+=chord+0.08; stp=0.05; continue; | |
| } | |
| if(dw<0.03){ | |
| if(mode==0){ /* BOUNDARY: walls are the image */ | |
| vec3 wc=wallImg(x); | |
| float L=0.0; for(int k=0;k<nWell;k++){ | |
| L+=wells[k].w*mGain/(length(x-wells[k].xyz)+1.0);} | |
| float fog=exp(-trav*0.010); | |
| col=wc*tint*(0.30+1.1*min(L,1.6))*fog; done=true; break; | |
| } else { /* PROJECTION / CASCADE: walls mirror */ | |
| vec3 n=wallNormal(x); | |
| rd=reflect(rd,n); tint*=0.85; bnc++; | |
| if(bnc>MAXB){ col=(mode==2)?accum:vec3(0.0); done=true; break; } | |
| for(int j=0;j<10;j++){ if(-worldSD(x)>0.05)break; x+=n*0.05; } | |
| x+=rd*0.04; stp=0.05; continue; | |
| } | |
| } | |
| stp=clamp(min(min(dm,dw),dsl)*0.9,0.03,3.0); | |
| x+=rd*stp; trav+=stp; | |
| if(trav>260.0)break; | |
| } | |
| if(!done) col=(mode==2)?accum:vec3(0.0); | |
| col+=glow; | |
| col=col/(col+1.0); | |
| col=pow(col,vec3(0.4545)); | |
| float vig=1.0-0.35*dot(uv0,uv0); | |
| O=vec4(col*vig,1.0); | |
| }`; | |
| /* ---------------- boundary texture (webcam + fallback) ---------------- */ | |
| const vid=$('vid'); | |
| let camOK=false, useCam=true; | |
| const camTex=gl.createTexture(); | |
| gl.activeTexture(gl.TEXTURE0); | |
| gl.bindTexture(gl.TEXTURE_2D,camTex); | |
| gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MIN_FILTER,gl.LINEAR); | |
| gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MAG_FILTER,gl.LINEAR); | |
| gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_WRAP_S,gl.REPEAT); | |
| gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_WRAP_T,gl.CLAMP_TO_EDGE); | |
| if(navigator.mediaDevices&&navigator.mediaDevices.getUserMedia){ | |
| navigator.mediaDevices.getUserMedia({video:{width:640,height:480,facingMode:'user'}}) | |
| .then(st=>{vid.srcObject=st;vid.play();camOK=true;setSrcLabel();}) | |
| .catch(()=>{useCam=false;camOK=false;setSrcLabel();}); | |
| }else{useCam=false;setSrcLabel();} | |
| const pat=document.createElement('canvas');pat.width=256;pat.height=256; | |
| const pctx=pat.getContext('2d'); | |
| function drawPattern(t){ | |
| const g=pctx.createLinearGradient(0,0,0,256); | |
| g.addColorStop(0,'#2a3550');g.addColorStop(1,'#6a4a70'); | |
| pctx.fillStyle=g;pctx.fillRect(0,0,256,256); | |
| const cx=128+64*Math.cos(0.6*t),cy=128+48*Math.sin(0.9*t); | |
| for(let s=0;s<24;s++){ | |
| pctx.fillStyle=s%2?'#d8c890':'#705838'; | |
| pctx.beginPath();pctx.arc(cx,cy,46-s*1.9,0,7);pctx.fill(); | |
| } | |
| pctx.fillStyle='#101018';pctx.fillRect(176,56,40,40); | |
| pctx.fillStyle='#c9d4e0';pctx.font='14px monospace'; | |
| pctx.fillText('no camera — pattern',56,240); | |
| } | |
| function setSrcLabel(){ | |
| $('src').textContent=useCam&&camOK?'webcam live':'test pattern'; | |
| $('bSrc').textContent=useCam?'Test pattern':'Use camera'; | |
| } | |
| function uploadBoundary(t){ | |
| gl.activeTexture(gl.TEXTURE0); | |
| gl.bindTexture(gl.TEXTURE_2D,camTex); | |
| gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL,true); | |
| if(useCam&&camOK&&vid.readyState>=2){ | |
| gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,gl.RGBA,gl.UNSIGNED_BYTE,vid); | |
| }else{ | |
| drawPattern(t); | |
| gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,gl.RGBA,gl.UNSIGNED_BYTE,pat); | |
| } | |
| gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL,false); | |
| } | |
| /* ===================================================================== | |
| THE PROCEDURAL BRAIN — now with LEVELS | |
| Every chamber is a pure function of (SEED, index). Nothing is stored. | |
| Level L is a run of depth(L) rooms. One room hides the KEY CRYSTAL | |
| (moon 0, gold, pulsing). The far gate of the level is SEALED until | |
| the key is touched. Room mass, twist, ripple and the shape pool all | |
| deepen with the level. Save = 6 numbers. Everything else is hash. | |
| ===================================================================== */ | |
| let SEED=(Math.random()*4294967296)>>>0; | |
| function rng(i,salt){ | |
| let t=(SEED ^ Math.imul(i|0,2654435761) ^ Math.imul(salt|0,40503))>>>0; | |
| t=Math.imul(t^(t>>>15),t|1); | |
| t^=t+Math.imul(t^(t>>>7),t|61); | |
| return ((t^(t>>>14))>>>0)/4294967296; | |
| } | |
| const SHAPENAMES=['CUBE','SPHERE','HEX PRISM','STAR','OCTAHEDRON','CYLINDER', | |
| 'CAPSULE VAULT','CUT CRYSTAL','DOME','CROSS CATHEDRAL','GEAR','WHEEL']; | |
| const SYL=['KA','RA','JA','PIN','TA','VUO','LU','MI','SA','TÄH','TI','KI','VI','HEL','ME','NU','SO','LO']; | |
| /* ------- level geometry: depth(L) rooms per level, cumulative starts ------- */ | |
| function depthOf(L){return Math.min(3+L,10);} /* L1: 4 rooms … caps at 10 */ | |
| function levelStartOf(L){let s=0;for(let k=1;k<L;k++)s+=depthOf(k);return s;} | |
| function levelOfRoom(i){ | |
| if(i<0)return 1; /* the ante-brain: level 1 rules */ | |
| let L=1,s=0; | |
| while(s+depthOf(L)<=i){s+=depthOf(L);L++;} | |
| return L; | |
| } | |
| function rngL(L,salt){return rng(0x5EED+Math.imul(L,131),7000+salt);} | |
| function keyRoomOf(L){const d=depthOf(L); | |
| return levelStartOf(L)+1+Math.floor(rngL(L,1)*(d-1));} | |
| function exitRoomOf(L){return levelStartOf(L)+depthOf(L)-1;} | |
| function nMoonsOf(L){return Math.min(3+((L-1)>>1),5);} | |
| function roomDef(i){ | |
| const L=levelOfRoom(i); | |
| const pool=Math.min(6+Math.max(L-1,0),12); /* shapes unlock with depth */ | |
| const shape=Math.floor(rng(i,1)*pool); | |
| const size=7.0+rng(i,2)*4.0+Math.min(L*0.15,3.0); | |
| const height=4.5+rng(i,3)*2.5; | |
| const starN=5+Math.floor(rng(i,4)*3); /* 5, 6 or 7 points */ | |
| const hue=rng(i,5); | |
| const turn=(rng(i,6)-0.5)*2.4; /* gate heading vs. entry, +-69 deg */ | |
| const twist=(rng(i,8)-0.5)*2.0*Math.min(0.015+L*0.011,0.13); | |
| const ripA=Math.min(Math.max(L-2,0)*0.06,0.45)*rng(i,9); | |
| const ripF=0.5+rng(i,10)*1.2; | |
| const massK=Math.min(0.7+rng(i,11)*0.9+L*0.04,2.8); | |
| let name='';const nc=2+Math.floor(rng(i,7)*2); | |
| for(let k=0;k<nc;k++)name+=SYL[Math.floor(rng(i,20+k)*SYL.length)]; | |
| const tint=[0.86+0.14*Math.cos(6.283*hue), | |
| 0.86+0.14*Math.cos(6.283*(hue+0.33)), | |
| 0.86+0.14*Math.cos(6.283*(hue+0.66))]; | |
| return {shape,size,height,starN,hue,turn,name,tint,twist,ripA,ripF,massK,level:L}; | |
| } | |
| function moonDef(i,m){ /* moon m of room i — re-dreamed identically every visit */ | |
| const s=100+m*13; | |
| const mass=-Math.log(1e-6+rng(i,s+1)); | |
| return {mass, | |
| fx:0.05+rng(i,s+2)*0.20, fy:0.05+rng(i,s+3)*0.20, fz:0.05+rng(i,s+4)*0.20, | |
| px:rng(i,s+5)*6.283, py:rng(i,s+6)*6.283, pz:rng(i,s+7)*6.283, | |
| ax:0.28+rng(i,s+8)*0.22, ay:0.25+rng(i,s+9)*0.22, az:0.28+rng(i,s+10)*0.22, | |
| ra:(rng(i,s+11)-0.5)*1.2, rb:(rng(i,s+12)-0.5)*1.2, | |
| pa:rng(i,s+13)*6.283, pb:rng(i,s+14)*6.283, | |
| hue:rng(i,s+15)}; | |
| } | |
| /* ------- game state ------- */ | |
| let LEVEL=1, keyFound=false, maxReached=1; | |
| let CI=0, dirIn=[Math.sin(rng(0,99)*6.283),Math.cos(rng(0,99)*6.283)]; | |
| let R={}; /* the three live rooms: def, center, index */ | |
| function rotXZ(v,a){const c=Math.cos(a),s=Math.sin(a);return [c*v[0]-s*v[1],s*v[0]+c*v[1]];} | |
| function computeDirIn(N){ /* dirIn is a pure function of SEED and N */ | |
| let d=[Math.sin(rng(0,99)*6.283),Math.cos(rng(0,99)*6.283)]; | |
| if(N>0){for(let j=0;j<N;j++)d=rotXZ(d,roomDef(j).turn);} | |
| else if(N<0){for(let j=-1;j>=N;j--)d=rotXZ(d,-roomDef(j).turn);} | |
| return d; | |
| } | |
| function rebuildChain(){ | |
| const dPrev=roomDef(CI-1), dCur=roomDef(CI), dNext=roomDef(CI+1); | |
| const dirOut=rotXZ(dirIn,dCur.turn); | |
| const Dn=dCur.size+dNext.size+12.0, Dp=dPrev.size+dCur.size+12.0; | |
| R={ | |
| idx:[CI-1,CI,CI+1], | |
| def:[dPrev,dCur,dNext], | |
| pos:[[-dirIn[0]*Dp,0,-dirIn[1]*Dp],[0,0,0],[dirOut[0]*Dn,0,dirOut[1]*Dn]], | |
| dirOut | |
| }; | |
| $('roomV').textContent=dCur.name; | |
| $('roomI').textContent='#'+CI+' · '+(dCur.shape===3?'STAR-'+dCur.starN:SHAPENAMES[dCur.shape]); | |
| $('massV').textContent=dCur.massK.toFixed(2)+' · '+(dCur.twist>=0?'+':'')+dCur.twist.toFixed(3); | |
| updateLevelHud(); | |
| } | |
| function banner(a,b){ | |
| $('bn1').textContent=a;$('bn2').textContent=b||''; | |
| const el=$('banner');el.classList.add('show'); | |
| clearTimeout(banner.t);banner.t=setTimeout(()=>el.classList.remove('show'),2600); | |
| } | |
| function updateLevelHud(){ | |
| $('lvlV').textContent=LEVEL; | |
| const rIn=CI-levelStartOf(LEVEL); | |
| $('progV').textContent=(CI<0?'—':(rIn+1)+' / '+depthOf(LEVEL)); | |
| $('keyV').textContent=keyFound?'found — seal open':'not found'; | |
| $('keyV').className=keyFound?'keyok':'keyno'; | |
| } | |
| function onRoomChanged(){ | |
| const newL=levelOfRoom(CI); | |
| if(newL>LEVEL){ | |
| LEVEL=newL; | |
| keyFound=(LEVEL+1<=maxReached); /* re-visiting a beaten level? seal stays open */ | |
| if(LEVEL>maxReached){maxReached=LEVEL;keyFound=false; | |
| banner('LEVEL '+LEVEL,depthOf(LEVEL)+' rooms · find the gold crystal'); | |
| autoSave();} | |
| }else if(newL<LEVEL){ | |
| LEVEL=newL; | |
| keyFound=(LEVEL+1<=maxReached); /* walked back: that seal was already opened */ | |
| } | |
| updateLevelHud(); | |
| } | |
| function advance(){ /* stepped through the forward gate */ | |
| const shift=R.pos[2]; | |
| camP=[camP[0]-shift[0],camP[1]-shift[1],camP[2]-shift[2]]; | |
| dirIn=R.dirOut; CI++; rebuildChain(); onRoomChanged(); | |
| } | |
| function retreat(){ /* stepped back — re-dream the past */ | |
| const shift=R.pos[0]; | |
| camP=[camP[0]-shift[0],camP[1]-shift[1],camP[2]-shift[2]]; | |
| const dPrev=roomDef(CI-1); | |
| dirIn=rotXZ(dirIn,-dPrev.turn); CI--; rebuildChain(); onRoomChanged(); | |
| } | |
| /* ---------------- JS twins of the SDFs (collision + transitions) ---------- */ | |
| function sdBoxJ(px,py,pz,bx,by,bz){ | |
| const qx=Math.abs(px)-bx,qy=Math.abs(py)-by,qz=Math.abs(pz)-bz; | |
| return Math.hypot(Math.max(qx,0),Math.max(qy,0),Math.max(qz,0)) | |
| +Math.min(Math.max(qx,Math.max(qy,qz)),0);} | |
| function sdHexJ(px,py,pz,h1,h2){ | |
| const kx=-0.8660254,ky=0.5,kz=0.57735; | |
| px=Math.abs(px);py=Math.abs(py);pz=Math.abs(pz); | |
| const d0=Math.min(kx*px+ky*py,0)*2; | |
| px-=d0*kx;py-=d0*ky; | |
| const cl=Math.min(Math.max(px,-kz*h1),kz*h1); | |
| const dx=Math.hypot(px-cl,py-h1)*Math.sign(py-h1); | |
| const dy=pz-h2; | |
| return Math.min(Math.max(dx,dy),0)+Math.hypot(Math.max(dx,0),Math.max(dy,0));} | |
| function sdStarNJ(px,py,r,n,m){ | |
| const an=Math.PI/n,en=Math.PI/m; | |
| const ax=Math.cos(an),ay=Math.sin(an),ex=Math.cos(en),ey=Math.sin(en); | |
| let bn=Math.atan2(px,py)%(2*an); if(bn<0)bn+=2*an; bn-=an; | |
| const l=Math.hypot(px,py); | |
| px=l*Math.cos(bn); py=l*Math.abs(Math.sin(bn)); | |
| px-=r*ax; py-=r*ay; | |
| const cl=Math.min(Math.max(-(px*ex+py*ey),0),r*ay/ey); | |
| px+=ex*cl; py+=ey*cl; | |
| return Math.hypot(px,py)*Math.sign(px);} | |
| function opExtrJ(d2,z,h){const wy=Math.abs(z)-h; | |
| return Math.min(Math.max(d2,wy),0)+Math.hypot(Math.max(d2,0),Math.max(wy,0));} | |
| function sdSegJ(px,py,pz,a,b){ | |
| const bax=b[0]-a[0],bay=b[1]-a[1],baz=b[2]-a[2]; | |
| const pax=px-a[0],pay=py-a[1],paz=pz-a[2]; | |
| const h=Math.min(Math.max((pax*bax+pay*bay+paz*baz)/(bax*bax+bay*bay+baz*baz),0),1); | |
| return Math.hypot(pax-bax*h,pay-bay*h,paz-baz*h);} | |
| function sdSegOJ(px,py,pz,ax,ay,az,bx,by,bz){ | |
| const bax=bx-ax,bay=by-ay,baz=bz-az; | |
| const pax=px-ax,pay=py-ay,paz=pz-az; | |
| const h=Math.min(Math.max((pax*bax+pay*bay+paz*baz)/(bax*bax+bay*bay+baz*baz),0),1); | |
| return Math.hypot(pax-bax*h,pay-bay*h,paz-baz*h);} | |
| function shapeSDJ(x,y,z,d){ | |
| const s=d.size,h=d.height; | |
| switch(d.shape){ | |
| case 0:return sdBoxJ(x,y,z,s,h,s); | |
| case 1:return Math.hypot(x,y,z)-s; | |
| case 2:return sdHexJ(x,z,y,s,h); | |
| case 3:{const m=2.0+(d.starN-2.0)*0.45; | |
| return opExtrJ(sdStarNJ(x,z,s*1.15,d.starN,m),y,h);} | |
| case 4:return (Math.abs(x)+Math.abs(y)+Math.abs(z)-s*1.5)*0.57735; | |
| case 5:return Math.max(Math.hypot(x,z)-s,Math.abs(y)-h); | |
| case 6:{const cy=y-Math.min(Math.max(y,-h*0.55),h*0.55); | |
| return Math.hypot(x,cy,z)-s*0.90;} | |
| case 7:return Math.max(sdBoxJ(x,y,z,s*0.95,s*0.95,s*0.95), | |
| (Math.abs(x)+Math.abs(y)+Math.abs(z)-s*1.45)*0.57735); | |
| case 8:return (Math.hypot(x,y*1.35,z)-s*1.08)*0.72; | |
| case 9:return Math.min(sdBoxJ(x,y,z,s,h*0.55,s*0.38), | |
| Math.min(sdBoxJ(x,y,z,s*0.38,h*0.55,s), | |
| sdBoxJ(x,y,z,s*0.45,h,s*0.45))); | |
| case 10:{const a=Math.atan2(z,x); | |
| const rr=s*(0.88+0.11*Math.cos(a*d.starN*2.0)); | |
| return Math.max(Math.hypot(x,z)-rr,Math.abs(y)-h)*0.68;} | |
| default:{const tor=Math.hypot(Math.hypot(x,z)-s*0.72,y)-s*0.40; | |
| const hub=Math.hypot(x,y,z)-s*0.40; | |
| let sp=Math.min(sdSegOJ(x,y,z,0,0,0,s*0.72,0,0), | |
| sdSegOJ(x,y,z,0,0,0,-s*0.72,0,0)); | |
| sp=Math.min(sp,Math.min(sdSegOJ(x,y,z,0,0,0,0,0,s*0.72), | |
| sdSegOJ(x,y,z,0,0,0,0,0,-s*0.72)))-s*0.17; | |
| return Math.min(tor,Math.min(hub,sp));} | |
| } | |
| } | |
| function roomSDJ(px,py,pz,r){ | |
| const d=R.def[r],c=R.pos[r]; | |
| let x=px-c[0],y=py-c[1],z=pz-c[2]; | |
| if(Math.abs(d.twist)>0.0005){ | |
| const ca=Math.cos(y*d.twist),sa=Math.sin(y*d.twist); | |
| const nx=ca*x-sa*z, nz=sa*x+ca*z; x=nx; z=nz; | |
| } | |
| let sd=shapeSDJ(x,y,z,d); | |
| if(d.ripA>0.001) | |
| sd+=d.ripA*Math.sin(x*d.ripF)*Math.sin(y*d.ripF)*Math.sin(z*d.ripF); | |
| return sd/(1.0+Math.abs(d.twist)*d.size*0.6+d.ripA*d.ripF); | |
| } | |
| function worldSDJ(px,py,pz){ | |
| let d=Math.min(roomSDJ(px,py,pz,0),Math.min(roomSDJ(px,py,pz,1),roomSDJ(px,py,pz,2))); | |
| d=Math.min(d,sdSegJ(px,py,pz,R.pos[0],R.pos[1])-1.7); | |
| d=Math.min(d,sdSegJ(px,py,pz,R.pos[1],R.pos[2])-1.7); | |
| return d;} | |
| /* ---------------- moons + key + seal upload ---------------- */ | |
| let P={mGain:1.0,lensK:1.0},mode=0,idle=1; | |
| const wellsF=new Float32Array(MAXW*4), colsF=new Float32Array(MAXW*3), | |
| parF=new Float32Array(MAXW*4), | |
| roomPosF=new Float32Array(9), roomParF=new Float32Array(12), | |
| roomModF=new Float32Array(12), roomTintF=new Float32Array(9); | |
| function moonCol(h){ | |
| return[0.55+0.45*Math.cos(6.283*h),0.55+0.45*Math.cos(6.283*(h+0.33)),0.55+0.45*Math.cos(6.283*(h+0.66))];} | |
| let keyWell=-1, keyPos=null, keyR=0; | |
| let sealV=[0,0,0,-1]; | |
| function packWorld(t){ | |
| let w=0; keyWell=-1; keyPos=null; | |
| const nM=nMoonsOf(LEVEL), kRoom=keyRoomOf(LEVEL); | |
| for(let r=0;r<3;r++){ | |
| const d=R.def[r],c=R.pos[r]; | |
| roomPosF[r*3]=c[0];roomPosF[r*3+1]=c[1];roomPosF[r*3+2]=c[2]; | |
| roomParF[r*4]=d.shape;roomParF[r*4+1]=d.size;roomParF[r*4+2]=d.height;roomParF[r*4+3]=d.starN; | |
| roomModF[r*4]=d.twist;roomModF[r*4+1]=d.ripA;roomModF[r*4+2]=d.ripF;roomModF[r*4+3]=d.massK; | |
| roomTintF[r*3]=d.tint[0];roomTintF[r*3+1]=d.tint[1];roomTintF[r*3+2]=d.tint[2]; | |
| const A=d.size*0.62, Ay=d.height*0.55; | |
| for(let m=0;m<nM && w<MAXW;m++,w++){ | |
| const md=moonDef(R.idx[r],m); | |
| const isKey=(!keyFound && R.idx[r]===kRoom && m===0); | |
| let size=(0.45+(md.mass/3.0)*0.75)*P.mGain*d.massK; | |
| size=Math.min(size,1.6); if(isKey)size=Math.min(size*1.25,1.8); | |
| /* the key swings wide, off the walking line — you must go to it */ | |
| const ax=isKey?Math.min(md.ax*1.6,0.55):md.ax, | |
| ay=isKey?Math.min(md.ay*1.5,0.50):md.ay, | |
| az=isKey?Math.min(md.az*1.6,0.55):md.az; | |
| wellsF[w*4+0]=c[0]+A*ax*Math.sin(md.fx*t+md.px); | |
| wellsF[w*4+1]=c[1]+Ay*ay*Math.sin(md.fy*t+md.py); | |
| wellsF[w*4+2]=c[2]+A*az*Math.sin(md.fz*t+md.pz); | |
| wellsF[w*4+3]=size; | |
| const cc=isKey?[1.0,0.84,0.36]:moonCol(md.hue); | |
| colsF[w*3]=cc[0];colsF[w*3+1]=cc[1];colsF[w*3+2]=cc[2]; | |
| parF[w*4]=d.shape;parF[w*4+1]=md.ra*t+md.pa;parF[w*4+2]=md.rb*t+md.pb;parF[w*4+3]=d.starN; | |
| if(isKey){keyWell=w;keyPos=[wellsF[w*4],wellsF[w*4+1],wellsF[w*4+2]];keyR=size;} | |
| } | |
| } | |
| /* the seal: a red membrane in the corridor after the level's last room */ | |
| const eRoom=exitRoomOf(LEVEL); | |
| if(!keyFound && CI===eRoom){ | |
| sealV=[(R.pos[1][0]+R.pos[2][0])*0.5,(R.pos[1][1]+R.pos[2][1])*0.5, | |
| (R.pos[1][2]+R.pos[2][2])*0.5,2.6]; | |
| }else sealV=[0,0,0,-1]; | |
| return w; | |
| } | |
| /* ---------------- camera & input (mouse INVERTED, as requested) ------------ */ | |
| let camP=[0,0,0], yaw=0, pitch=0; | |
| function faceForwardGate(){yaw=Math.atan2(R.dirOut[0],R.dirOut[1]);pitch=0;} | |
| rebuildChain();faceForwardGate(); | |
| const keys={}; | |
| addEventListener('keydown',e=>{keys[e.code]=1; | |
| if(['KeyW','KeyA','KeyS','KeyD','KeyQ','KeyE'].includes(e.code))e.preventDefault();}); | |
| addEventListener('keyup',e=>{keys[e.code]=0;}); | |
| let dragging=false,lx=0,ly=0; | |
| cvs.addEventListener('pointerdown',e=>{dragging=true;lx=e.clientX;ly=e.clientY; | |
| cvs.classList.add('drag');cvs.setPointerCapture(e.pointerId); | |
| boot.classList.add('gone');startMusic();}); | |
| cvs.addEventListener('pointerup',()=>{dragging=false;cvs.classList.remove('drag');}); | |
| cvs.addEventListener('pointermove',e=>{ | |
| if(!dragging)return; | |
| yaw+=(e.clientX-lx)*0.0032;pitch-=(e.clientY-ly)*0.0032; /* horiz inverted · vert natural */ | |
| pitch=Math.max(-1.5,Math.min(1.5,pitch)); | |
| lx=e.clientX;ly=e.clientY; | |
| }); | |
| boot.addEventListener('click',()=>{boot.classList.add('gone');startMusic();}); | |
| function insideVal(px,py,pz){ | |
| let v=-worldSDJ(px,py,pz); | |
| if(sealV[3]>0) | |
| v=Math.min(v,Math.hypot(px-sealV[0],py-sealV[1],pz-sealV[2])-sealV[3]); | |
| return v; | |
| } | |
| function tryMove(nx,ny,nz){ | |
| if(insideVal(nx,ny,nz)>0.35){camP=[nx,ny,nz];return;} | |
| if(insideVal(nx,camP[1],camP[2])>0.35)camP[0]=nx; | |
| if(insideVal(camP[0],ny,camP[2])>0.35)camP[1]=ny; | |
| if(insideVal(camP[0],camP[1],nz)>0.35)camP[2]=nz; | |
| } | |
| /* ---------------- music: game1..4.mp3 next to this file, endless ---------- */ | |
| const TRACKS=['game1.mp3','game2.mp3','game3.mp3','game4.mp3','game5.mp3', | |
| 'game6.mp3','game7.mp3','game8.mp3','game9.mp3','game10.mp3']; | |
| let musicOn=true, musicStarted=false, mIdx=Math.floor(Math.random()*TRACKS.length), mFails=0; | |
| const audio=(typeof Audio!=='undefined')?new Audio():null; | |
| if(audio){ | |
| audio.preload='auto'; audio.volume=0.5; | |
| audio.addEventListener('ended',()=>{mFails=0;playTrack(mIdx+1);}); | |
| audio.addEventListener('error',()=>{ | |
| if(++mFails<TRACKS.length)playTrack(mIdx+1); | |
| else $('musV').textContent='no mp3s found'; | |
| }); | |
| audio.addEventListener('playing',()=>{mFails=0;$('musV').textContent=TRACKS[mIdx];}); | |
| } | |
| function playTrack(i){ | |
| if(!audio||!musicOn)return; | |
| mIdx=((i%TRACKS.length)+TRACKS.length)%TRACKS.length; | |
| audio.src=TRACKS[mIdx]; | |
| audio.play().catch(()=>{/* autoplay policy: waits for a click */}); | |
| } | |
| function startMusic(){ | |
| if(musicStarted||!musicOn||!audio)return; | |
| musicStarted=true; playTrack(mIdx); | |
| } | |
| $('bMus').onclick=e=>{ | |
| musicOn=!musicOn; | |
| e.target.classList.toggle('on',musicOn); | |
| e.target.textContent='Music: '+(musicOn?'on':'off'); | |
| if(!audio)return; | |
| if(musicOn){musicStarted=false;startMusic();} | |
| else {audio.pause();$('musV').textContent='off';} | |
| }; | |
| $('musV').textContent='starts on first click'; | |
| /* ---------------- save / load ---------------- | |
| the whole game is 6 numbers. everything else is the hash. */ | |
| function saveObj(){return {v:1,s:SEED,l:LEVEL,c:CI,k:keyFound?1:0,m:maxReached};} | |
| function saveCode(){return btoa(JSON.stringify(saveObj()));} | |
| function applySave(o){ | |
| if(!o||o.v!==1||typeof o.s!=='number')throw new Error('bad save'); | |
| SEED=o.s>>>0; LEVEL=Math.max(1,o.l|0); CI=o.c|0; | |
| keyFound=!!o.k; maxReached=Math.max(LEVEL,o.m|0); | |
| dirIn=computeDirIn(CI); camP=[0,0,0]; | |
| rebuildChain(); faceForwardGate(); updateLevelHud(); | |
| } | |
| function autoSave(){ | |
| try{localStorage.setItem('brainDescentSave',saveCode());}catch(e){/* fine: file:// or sandbox */} | |
| } | |
| $('bSave').onclick=()=>{ | |
| autoSave(); | |
| $('stat').textContent='saved · level '+LEVEL+' room #'+CI+' (Save code gives a portable copy)'; | |
| }; | |
| $('bCode').onclick=()=>{ | |
| const c=saveCode(); | |
| $('stat').textContent='code: '+c; | |
| if(navigator.clipboard)navigator.clipboard.writeText(c).catch(()=>{}); | |
| }; | |
| $('bLoad').onclick=()=>{ | |
| let code=''; | |
| try{code=localStorage.getItem('brainDescentSave')||'';}catch(e){} | |
| const inp=prompt('Paste a save code (leave as-is to load the local save):',code); | |
| if(inp===null)return; | |
| try{applySave(JSON.parse(atob(inp.trim()))); | |
| $('stat').textContent='loaded · level '+LEVEL+' room #'+CI+' · seed '+SEED.toString(16); | |
| banner('LEVEL '+LEVEL,'re-dreamed from the hash'); | |
| }catch(e){$('stat').textContent='could not read that save code';} | |
| }; | |
| /* ---------------- controls ---------------- */ | |
| const MODES=[ | |
| {name:'Boundary', note:'the walls are your camera. the moons are optical crystals — the room bends and refocuses through every one of them.'}, | |
| {name:'Projection', note:'the moons carry your face; every wall is a mirror. the image emanates from the bulk — the holographic swap.'}, | |
| {name:'Cascade', note:'heavy glass: Fresnel rims wear your face, the ray refracts through and keeps going, tinted by each crystal it crosses.'}, | |
| ]; | |
| function setMode(mi){ | |
| mode=mi; | |
| ['m0','m1','m2'].forEach((id,i)=>$(id).classList.toggle('on',i===mi)); | |
| $('modeV').textContent=MODES[mi].name; | |
| $('modeNote').textContent=MODES[mi].note; | |
| } | |
| setMode(0); | |
| function bind(id,lab,fn){const el=$(id);el.addEventListener('input',()=>{fn(parseFloat(el.value));$(lab).textContent=el.value;});} | |
| bind('m','m_l',v=>{P.mGain=v;}); | |
| bind('g','g_l',v=>{P.lensK=v;}); | |
| bind('v','v_l',v=>{if(audio)audio.volume=v;}); | |
| $('m0').onclick=()=>setMode(0); | |
| $('m1').onclick=()=>setMode(1); | |
| $('m2').onclick=()=>setMode(2); | |
| $('bSrc').onclick=()=>{useCam=!useCam;setSrcLabel();}; | |
| $('bSeed').onclick=()=>{ SEED=(Math.random()*4294967296)>>>0; | |
| LEVEL=1;maxReached=1;keyFound=false;CI=0; | |
| dirIn=[Math.sin(rng(0,99)*6.283),Math.cos(rng(0,99)*6.283)]; | |
| camP=[0,0,0]; rebuildChain(); faceForwardGate(); updateLevelHud(); | |
| banner('LEVEL 1','a new brain · seed '+SEED.toString(16)); | |
| $('stat').textContent='new brain · seed '+SEED.toString(16); }; | |
| $('bIdle').onclick=e=>{idle^=1;e.target.classList.toggle('on',!!idle); | |
| e.target.textContent='Idle spin: '+(idle?'on':'off');}; | |
| if(matchMedia('(prefers-reduced-motion: reduce)').matches){ | |
| idle=0;$('bIdle').classList.remove('on');$('bIdle').textContent='Idle spin: off'; | |
| } | |
| /* try to resume a local autosave silently */ | |
| try{const c=localStorage.getItem('brainDescentSave'); | |
| if(c){applySave(JSON.parse(atob(c))); | |
| $('stat').textContent='resumed · level '+LEVEL+' room #'+CI;} | |
| }catch(e){/* fresh brain */} | |
| updateLevelHud(); | |
| /* ---------------- resize ---------------- */ | |
| function resize(){ | |
| const dpr=Math.min(devicePixelRatio||1,1.35); | |
| cvs.width=Math.floor(innerWidth*dpr); | |
| cvs.height=Math.floor(innerHeight*dpr); | |
| gl.viewport(0,0,cvs.width,cvs.height); | |
| } | |
| addEventListener('resize',resize);resize(); | |
| /* ---------------- resonance: hot / cold toward the key ---------------- */ | |
| function updateResonance(){ | |
| if(keyFound){$('resT').textContent='key held';$('resFill').style.width='100%';return;} | |
| const kRoom=keyRoomOf(LEVEL); | |
| let res,txt; | |
| if(keyPos){ | |
| const d=Math.hypot(camP[0]-keyPos[0],camP[1]-keyPos[1],camP[2]-keyPos[2]); | |
| res=Math.max(0.35,Math.min(1,1-(d-2)/42)); | |
| txt='very close — '+d.toFixed(0)+' m'; | |
| }else{ | |
| const away=kRoom-CI; | |
| res=Math.max(0.04,0.34/(1+Math.abs(away))); | |
| txt=Math.abs(away)+' room'+(Math.abs(away)===1?'':'s')+(away>0?' ahead':' behind'); | |
| } | |
| $('resT').textContent=txt; | |
| $('resFill').style.width=(res*100).toFixed(0)+'%'; | |
| } | |
| /* ---------------- shader compile: DEFERRED so the boot screen paints first, | |
| PARALLEL where the driver allows it, and any failure shows its log -------- */ | |
| let prog=null,U={}; | |
| function sh(type,src){const s=gl.createShader(type);gl.shaderSource(s,src); | |
| gl.compileShader(s);return s;} | |
| function compileAndStart(){ | |
| const vs=sh(gl.VERTEX_SHADER,VERT), fs=sh(gl.FRAGMENT_SHADER,FRAG); | |
| prog=gl.createProgram(); | |
| gl.attachShader(prog,vs);gl.attachShader(prog,fs); | |
| gl.linkProgram(prog); | |
| const ext=gl.getExtension('KHR_parallel_shader_compile'); | |
| function finish(){ | |
| if(!gl.getProgramParameter(prog,gl.LINK_STATUS)){ | |
| const log=(gl.getShaderInfoLog(fs)||'')+' '+(gl.getShaderInfoLog(vs)||'') | |
| +' '+(gl.getProgramInfoLog(prog)||''); | |
| bootErr('Shader failed: '+log.trim()); | |
| return; | |
| } | |
| gl.useProgram(prog); | |
| ['iRes','iTime','camP','camR','camU','camF','nWell','mode','keyWell','mGain','lensK','camTex', | |
| 'wells','wellCol','wellPar','roomPos','roomPar','roomMod','roomTintU','seal'] | |
| .forEach(k=>U[k]=gl.getUniformLocation(prog,k)); | |
| gl.uniform1i(U.camTex,0); | |
| $('bootStat').textContent='ready — click to enter'; | |
| requestAnimationFrame(loop); | |
| } | |
| if(ext){ | |
| (function poll(){ | |
| if(gl.getProgramParameter(prog,ext.COMPLETION_STATUS_KHR))finish(); | |
| else requestAnimationFrame(poll); | |
| })(); | |
| }else finish(); | |
| } | |
| /* ---------------- loop ---------------- */ | |
| let t0=performance.now(),simT=0,frames=0,fpsT=t0; | |
| function loop(now){ | |
| const dt=Math.min((now-t0)/1000,0.05);t0=now; | |
| if(idle)simT+=dt; else simT+=dt*0.06; | |
| const cp=Math.cos(pitch),sp=Math.sin(pitch),cy=Math.cos(yaw),sy=Math.sin(yaw); | |
| const F=[sy*cp,sp,cy*cp], Rv=[cy,0,-sy], Uv=[-sy*sp,cp,-cy*sp]; | |
| const spd=(keys.ShiftLeft||keys.ShiftRight?14:6)*dt; | |
| let mx=0,my=0,mz=0; | |
| if(keys.KeyW){mx+=F[0]*spd;my+=F[1]*spd;mz+=F[2]*spd;} | |
| if(keys.KeyS){mx-=F[0]*spd;my-=F[1]*spd;mz-=F[2]*spd;} | |
| if(keys.KeyD){mx+=Rv[0]*spd;mz+=Rv[2]*spd;} | |
| if(keys.KeyA){mx-=Rv[0]*spd;mz-=Rv[2]*spd;} | |
| if(keys.KeyE)my+=spd; | |
| if(keys.KeyQ)my-=spd; | |
| if(mx||my||mz)tryMove(camP[0]+mx,camP[1]+my,camP[2]+mz); | |
| /* room transition: deep inside next -> dream forward; inside prev -> re-dream back */ | |
| if(roomSDJ(camP[0],camP[1],camP[2],2)<-1.0)advance(); | |
| else if(roomSDJ(camP[0],camP[1],camP[2],0)<-1.0)retreat(); | |
| uploadBoundary(simT); | |
| const nW=packWorld(simT); | |
| /* key pickup: touch the gold crystal */ | |
| if(!keyFound && keyPos){ | |
| const d=Math.hypot(camP[0]-keyPos[0],camP[1]-keyPos[1],camP[2]-keyPos[2]); | |
| if(d<keyR+1.0){ | |
| keyFound=true; keyWell=-1; sealV=[0,0,0,-1]; | |
| banner('KEY CRYSTAL','the seal dissolves — find the far gate'); | |
| updateLevelHud(); autoSave(); | |
| } | |
| } | |
| gl.useProgram(prog); | |
| gl.uniform2f(U.iRes,cvs.width,cvs.height); | |
| gl.uniform1f(U.iTime,simT); | |
| gl.uniform3f(U.camP,camP[0],camP[1],camP[2]); | |
| gl.uniform3f(U.camR,Rv[0],Rv[1],Rv[2]); | |
| gl.uniform3f(U.camU,Uv[0],Uv[1],Uv[2]); | |
| gl.uniform3f(U.camF,F[0],F[1],F[2]); | |
| gl.uniform1i(U.nWell,nW); | |
| gl.uniform1i(U.mode,mode); | |
| gl.uniform1i(U.keyWell,keyWell); | |
| gl.uniform1f(U.mGain,P.mGain); | |
| gl.uniform1f(U.lensK,P.lensK); | |
| gl.uniform4fv(U.wells,wellsF); | |
| gl.uniform3fv(U.wellCol,colsF); | |
| gl.uniform4fv(U.wellPar,parF); | |
| gl.uniform3fv(U.roomPos,roomPosF); | |
| gl.uniform4fv(U.roomPar,roomParF); | |
| gl.uniform4fv(U.roomMod,roomModF); | |
| gl.uniform3fv(U.roomTintU,roomTintF); | |
| gl.uniform4f(U.seal,sealV[0],sealV[1],sealV[2],sealV[3]); | |
| gl.drawArrays(gl.TRIANGLES,0,3); | |
| frames++; | |
| if(now-fpsT>400){ | |
| $('fps').textContent=Math.round(frames*1000/(now-fpsT))+' fps'; | |
| frames=0;fpsT=now; | |
| $('pos').textContent=camP.map(v=>v.toFixed(1)).join(', '); | |
| updateResonance(); | |
| } | |
| requestAnimationFrame(loop); | |
| } | |
| /* let the boot screen paint before the driver chews on the shader */ | |
| $('bootStat').textContent='dreaming the shader…'; | |
| requestAnimationFrame(()=>{try{compileAndStart();}catch(e){bootErr(e&&e.stack||e);}}); | |
| </script> | |