| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> |
| <title>Resonant Access Body/Web Runtime v0.1.2 — Mycelial Globe + Body Runtime Pressure Map</title> |
| <style> |
| :root{ |
| --bg:#05070d; |
| --panel:#0b1020cc; |
| --panel2:#10172bcc; |
| --line:#24324f; |
| --text:#e7eefc; |
| --muted:#9aa9c7; |
| --gold:#f5c85b; |
| --blue:#69d7ff; |
| --blue2:#b9f3ff; |
| --green:#74f6a7; |
| --yellow:#ffe071; |
| --red:#ff5a76; |
| --purple:#c18cff; |
| --gray:#7a8498; |
| } |
| *{box-sizing:border-box} |
| html,body{margin:0;min-height:100%;background:radial-gradient(circle at 20% 0%,#101a34 0,#070a13 34%,#03050a 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;} |
| body{padding:18px;} |
| .shell{max-width:1440px;margin:0 auto;} |
| header{border:1px solid #243350;background:linear-gradient(135deg,#0a1020e8,#10162be0 55%,#0b1020d8);border-radius:24px;padding:22px 24px;box-shadow:0 18px 80px #0009;position:relative;overflow:hidden;} |
| header:before{content:"";position:absolute;inset:-70%;background:radial-gradient(circle,#68d9ff1f 0,#0000 34%);animation:slowSpin 24s linear infinite;} |
| @keyframes slowSpin{to{transform:rotate(360deg)}} |
| header>*{position:relative;z-index:1} |
| h1{margin:0;font-size:clamp(26px,4vw,48px);line-height:1.02;letter-spacing:-.04em;} |
| h2{margin:0 0 10px;font-size:22px;letter-spacing:-.02em;} |
| h3{margin:0 0 8px;font-size:15px;text-transform:uppercase;letter-spacing:.12em;color:#b6c7eb;} |
| .subtitle{margin:10px 0 0;color:#c6d6f5;font-size:16px;max-width:940px;line-height:1.55;} |
| .locks{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px} |
| .chip{border:1px solid #33466b;background:#101b33c9;color:#cfe0ff;border-radius:999px;padding:8px 12px;font-size:13px;} |
| .chip.gold{border-color:#b68c30;background:#3a2c1022;color:#ffe19d} |
| .chip.green{border-color:#2f9b64;background:#10332155;color:#a5ffc8} |
| .chip.red{border-color:#a43d50;background:#35101b55;color:#ffb1bf} |
| .boundaryBanner{margin-top:16px;border:1px solid #5f6f92;background:linear-gradient(135deg,#0c1627,#111d33);border-radius:18px;padding:12px 14px;color:#e6f1ff;line-height:1.55;font-size:14px;box-shadow:inset 0 0 0 1px #ffffff08} |
| .boundaryBanner b{color:#fff0b8} |
| .instrumentDesc{margin:0 0 12px;border:1px solid #2d4268;background:#061226;border-radius:16px;padding:12px 14px;color:#d8eaff;font-size:13px;line-height:1.55} |
| .grid{display:grid;grid-template-columns:390px minmax(0,1fr) 390px;gap:16px;margin-top:16px;align-items:start;} |
| @media(max-width:1180px){.grid{grid-template-columns:1fr}.canvasCard{order:-1}} |
| .card{border:1px solid #243350;background:var(--panel);border-radius:22px;padding:16px;box-shadow:0 15px 45px #0006;backdrop-filter:blur(12px);} |
| .card.soft{background:var(--panel2)} |
| .small{font-size:12px;color:var(--muted);line-height:1.5} |
| .bodyText{font-size:14px;line-height:1.55;color:#dce8ff;} |
| .tabs{display:flex;gap:8px;margin:16px 0 0;flex-wrap:wrap} |
| button,.btn{border:1px solid #31456b;background:linear-gradient(180deg,#17233d,#0d172b);color:#e9f3ff;border-radius:14px;padding:10px 12px;font-weight:700;cursor:pointer;transition:.16s ease;box-shadow:inset 0 0 0 1px #ffffff08,0 10px 25px #0005;} |
| button:hover{transform:translateY(-1px);border-color:#68d9ff99;box-shadow:0 0 28px #68d9ff18,0 12px 26px #0007} |
| button.active{border-color:#74f6a7;background:linear-gradient(180deg,#17372b,#0c201a);color:#cbffe0} |
| button.warn{border-color:#ffcf6a88;color:#ffe5ad;background:linear-gradient(180deg,#3d2b12,#1d160d)} |
| button.danger{border-color:#ff5a7688;color:#ffc4ce;background:linear-gradient(180deg,#3a1220,#1a0c12)} |
| input,select,textarea{width:100%;border:1px solid #2b3d5d;background:#060b16;color:#e6f1ff;border-radius:14px;padding:10px 12px;font:inherit;outline:none;} |
| textarea{min-height:96px;resize:vertical;line-height:1.45;} |
| label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#9eb0d1;margin:12px 0 6px;} |
| .row{display:grid;grid-template-columns:1fr 70px;gap:8px;align-items:center;margin:8px 0;} |
| input[type=range]{accent-color:#69d7ff;padding:0} |
| .value{font-variant-numeric:tabular-nums;color:#d8e8ff;text-align:right;font-size:13px} |
| .metric{display:grid;grid-template-columns:1fr auto;gap:8px;border-bottom:1px solid #22304c;padding:8px 0;font-size:13px;} |
| .metric:last-child{border-bottom:0} |
| .state{font-weight:900;letter-spacing:.08em;text-transform:uppercase;} |
| .state.held{color:var(--green)}.state.strained{color:var(--yellow)}.state.stop{color:var(--red)} |
| .canvasWrap{position:relative;background:radial-gradient(circle at 50% 43%,#10203d 0,#071020 40%,#02040a 100%);border-radius:26px;overflow:hidden;border:1px solid #284060;box-shadow:inset 0 0 80px #69d7ff14,0 20px 70px #0008;} |
| canvas{display:block;width:100%;height:auto;aspect-ratio:900/620;min-height:360px;} |
| .hud{position:absolute;top:14px;left:14px;right:14px;display:flex;gap:8px;flex-wrap:wrap;pointer-events:none;} |
| .hud .pill{background:#020711b8;border:1px solid #2d4268;border-radius:999px;padding:7px 10px;color:#dcecff;font-size:12px;box-shadow:0 10px 30px #0007;} |
| .hud .pill.held{border-color:#2f9b64;background:#0d2b1db8;color:#c8ffdd} |
| .hud .pill.strained{border-color:#c49b34;background:#33240ab8;color:#ffe7a5} |
| .hud .pill.stop{border-color:#a43d50;background:#36101bb8;color:#ffc0cc} |
| .canvasCaption{position:absolute;left:16px;bottom:14px;right:16px;border:1px solid #2d4268;background:#020711b8;border-radius:14px;padding:8px 10px;color:#b9c7e2;font-size:12px;line-height:1.35;pointer-events:none;} |
| .legend{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:8px;font-size:12px;color:#b9c7e2}.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;vertical-align:-1px}.gold{background:var(--gold)}.blue{background:var(--blue)}.green{background:var(--green)}.yellow{background:var(--yellow)}.red{background:var(--red)}.purple{background:var(--purple)} |
| .panels{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.panel{border:1px solid #243350;background:#080d19cc;border-radius:18px;padding:14px;} |
| @media(max-width:900px){.panels{grid-template-columns:1fr}} |
| pre{white-space:pre-wrap;word-break:break-word;background:#050914;border:1px solid #223251;border-radius:16px;padding:12px;color:#d9e8ff;max-height:340px;overflow:auto;font-size:12px;line-height:1.45;} |
| .hidden{display:none!important}.footer{margin:16px 0 0;color:#8fa1c0;font-size:12px;text-align:center}.modeNote{border-left:3px solid #69d7ff;padding:10px 12px;background:#061226;border-radius:12px;margin-top:12px;color:#d8eaff;font-size:13px;line-height:1.5;} |
| .pictureGuide{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:8px}.picCard{border:1px solid #2c3f63;background:#081226;border-radius:16px;padding:10px;text-align:center;min-height:94px}.picCard .emoji{font-size:24px}.picCard b{display:block;margin:5px 0 2px}.picCard span{font-size:11px;color:#aab9d4} |
| @media(max-width:900px){.pictureGuide{grid-template-columns:repeat(2,1fr)}} |
| </style> |
| </head> |
| <body> |
| <div class="shell"> |
| <header> |
| <h1>Resonant Access Body/Web Runtime v0.1.2</h1> |
| <p class="subtitle"><b>Resonant Mycelial Globe</b> + <b>Body Runtime Pressure Map</b>. A first offline HTML prototype for pressure-mapped coupling, embodied signal routing, HIR/OAM gates, return-to-substrate, and bounded trace export <b>(symbolic prototype only)</b>.</p> |
| <div class="locks"> |
| <span class="chip gold">Symbolic only — tune, don’t capture</span> |
| <span class="chip green">No grab: couple, witness, return</span> |
| <span class="chip">Symbolic tracer, not whole pattern</span> |
| <span class="chip">Pressure gives direction</span> |
| <span class="chip">Growth only after return</span> |
| <span class="chip red">Not diagnosis / not proof</span> |
| </div> |
| <div class="boundaryBanner"><b>Bounded symbolic prototype:</b> this instrument visualizes pressure, coupling, witness, return, and overload. It does not access hidden data, route packets, locate people, diagnose bodies, prove truth, or certify consciousness/life.</div> |
| </header> |
|
|
| <div class="tabs"> |
| <button id="tabGlobe" class="active" onclick="setInstrument('globe')">Resonant Mycelial Globe</button> |
| <button id="tabBody" onclick="setInstrument('body')">Body Runtime Pressure Map</button> |
| <button onclick="runDemo()">Run Demo Sequence</button> |
| <button onclick="resetAll()" class="warn">Reset</button> |
| <button onclick="exportJSON()">Export Trace JSON</button> |
| </div> |
|
|
| <div id="instrumentDescription" class="instrumentDesc" style="margin-top:16px"></div> |
|
|
| <div class="grid"> |
| <section class="card"> |
| <h2>Intake + Guide</h2> |
| <label>Guide Mode</label> |
| <select id="guideMode" onchange="updateGuide()"> |
| <option value="systems">Systems Guide</option> |
| <option value="plain" selected>Plain Guide</option> |
| <option value="picture">Picture Guide</option> |
| <option value="child">Child + Parent Guide</option> |
| </select> |
| <div id="guideText" class="modeNote"></div> |
| <div id="pictureGuide" class="pictureGuide hidden"> |
| <div class="picCard"><div class="emoji">👀</div><b>Look</b><span>What is here?</span></div> |
| <div class="picCard"><div class="emoji">🧠</div><b>Think</b><span>What might it mean?</span></div> |
| <div class="picCard"><div class="emoji">❓</div><b>Wonder</b><span>What do we not know?</span></div> |
| <div class="picCard"><div class="emoji">🛑</div><b>Careful</b><span>What should we not say?</span></div> |
| <div class="picCard"><div class="emoji">🤝</div><b>Ask</b><span>Who can help check?</span></div> |
| <div class="picCard"><div class="emoji">🛠</div><b>Fix</b><span>What needs correction?</span></div> |
| <div class="picCard"><div class="emoji">🍃</div><b>Let Go</b><span>What should not be kept?</span></div> |
| </div> |
|
|
| <label>Input Type</label> |
| <select id="inputType" onchange="pressureMap()"> |
| <option value="text">Text / claim</option> |
| <option value="image">Image / screenshot / diagram</option> |
| <option value="equation">Equation / formal model</option> |
| <option value="mixed">Mixed artifact</option> |
| <option value="body">Body signal</option> |
| </select> |
|
|
| <label>Purpose</label> |
| <select id="purpose" onchange="pressureMap()"> |
| <option value="understand">Understand honestly</option> |
| <option value="translate">Translate into trace packet</option> |
| <option value="pressure">Pressure-read / HIR-OAM gate</option> |
| <option value="renderer">Prepare symbolic renderer mapping</option> |
| <option value="body">Map body-runtime processing</option> |
| </select> |
|
|
| <label>Artifact / Tune Request</label> |
| <textarea id="artifactText" oninput="pressureMap()">What am I trying to understand, through what tracer, with what boundary?</textarea> |
|
|
| <label>Boundary / What should not be claimed?</label> |
| <textarea id="boundaryText" oninput="pressureMap()">Do not treat the trace as proof, diagnosis, hidden location, identity, consciousness, or whole-pattern capture.</textarea> |
|
|
| <label>Pressure Controls</label> |
| <div class="row"><input id="tune" type="range" min="0" max="100" value="82" oninput="pressureMap()"><span class="value" id="tuneVal"></span></div> |
| <div class="small"><b>Tune clarity:</b> how clearly the user states what they are trying to understand.</div> |
| <div class="row"><input id="fit" type="range" min="0" max="100" value="78" oninput="pressureMap()"><span class="value" id="fitVal"></span></div> |
| <div class="small"><b>Tracer fit / signal fit:</b> how well the artifact, tracer, or body-channel signal matches the request.</div> |
| <div class="row"><input id="boundary" type="range" min="0" max="100" value="88" oninput="pressureMap()"><span class="value" id="boundaryVal"></span></div> |
| <div class="small"><b>Boundary safety / respect:</b> how clearly unsupported claims are blocked and agency is preserved.</div> |
| <div class="row"><input id="return" type="range" min="0" max="100" value="84" oninput="pressureMap()"><span class="value" id="returnVal"></span></div> |
| <div class="small"><b>Source-return / loop completion:</b> whether the interpretation returns to source, uncertainty, repair, and release instead of closing too early.</div> |
| <div class="row"><input id="oam" type="range" min="0" max="100" value="10" oninput="pressureMap()"><span class="value" id="oamVal"></span></div> |
| <div class="small"><b>OAM load / overload pressure:</b> pressure from ambiguity, overclaim, hidden inference, strain, or unresolved risk.</div> |
|
|
| <div class="tabs"> |
| <button onclick="emitTune()">Emit Tune Signal</button> |
| <button id="returnBtn" onclick="completeReturn()">Complete Return</button> |
| </div> |
| </section> |
|
|
| <section class="canvasCard card soft"> |
| <div class="canvasWrap"> |
| <canvas id="mainCanvas" width="900" height="620"></canvas> |
| <div class="hud"> |
| <span class="pill" id="instrumentHud">Globe Mode</span> |
| <span class="pill held" id="stateHud">State: HELD</span> |
| <span class="pill" id="routeHud">Route: SIM_ROUTE_RESONANT_ACCESS_HELD</span> |
| <span class="pill" id="phaseHud">Phase: IDLE</span> |
| </div> |
| <div class="canvasCaption" id="canvasCaption">Symbolic coupling map. Not geolocation. Not packet routing.</div> |
| </div> |
| <div class="legend"> |
| <span><i class="dot gold"></i>HIR-held / integrated</span> |
| <span><i class="dot blue"></i>Return / repair</span> |
| <span><i class="dot green"></i>Legitimate coupling</span> |
| <span><i class="dot yellow"></i>Strain / uncertainty</span> |
| <span><i class="dot red"></i>Must stop / overload</span> |
| <span><i class="dot purple"></i>Inference zone</span> |
| </div> |
| </section> |
|
|
| <section class="card"> |
| <h2>HIR/OAM Readout</h2> |
| <div class="metric"><span>Coupling readiness Cₜ</span><b id="cVal">0.00</b></div> |
| <div class="metric"><span>Symbolic loop-growth Gₘ</span><b id="gVal">0.00</b></div> |
| <div class="metric"><span>State</span><b id="stateVal" class="state held">HELD</b></div> |
| <div class="metric"><span>Route</span><b id="routeVal">SIM_ROUTE_RESONANT_ACCESS_HELD</b></div> |
| <div class="metric"><span>Dominant direction</span><b id="directionVal">Translation / boundary</b></div> |
| <div class="metric"><span>Loop status</span><b id="loopVal">READY</b></div> |
|
|
| <h3 style="margin-top:18px">Formal Spine</h3> |
| <pre id="equations">Cₜ = Tₜ × Fₜ × Bₜ × Rₜ − Pₒₐₘ |
| Gₘ = N × R_c × L_c − Pₒₐₘ |
|
|
| All values are symbolic pressure indicators only.</pre> |
|
|
| <h3>Interpretation</h3> |
| <div class="bodyText" id="interpretation"></div> |
| </section> |
| </div> |
|
|
| <div class="panels"> |
| <section class="panel"> |
| <h2>Pre-Coupling Translation</h2> |
| <pre id="translationOut"></pre> |
| </section> |
| <section class="panel"> |
| <h2>Trace Packet Preview</h2> |
| <pre id="jsonOut"></pre> |
| </section> |
| </div> |
|
|
| <section class="card" style="margin-top:16px"> |
| <h2>Locked Boundary Notes</h2> |
| <p class="bodyText"><b>Resonant Mycelial Globe:</b> symbolic coupling map only. It does not claim real geolocation, packet routes, hidden source location, ownership, proof, life, or consciousness.</p> |
| <p class="bodyText"><b>Body Runtime Pressure Map:</b> bounded systems visualization only. It is not medical diagnosis, treatment advice, anatomy precision, clinical protocol, or neuroscience proof.</p> |
| <p class="bodyText"><b>Shared lock:</b> Pressure gives the pulse its direction. Coupling gives the trace its boundary. Return gives the field its growth.</p> |
| </section> |
| <div class="footer">Created and Developed by Collin D. Weber · Primordial Calculus / HIR-OAM · v0.1.2 offline symbolic prototype</div> |
| </div> |
|
|
| <script> |
| const $ = id => document.getElementById(id); |
| const canvas = $('mainCanvas'); |
| const ctx = canvas.getContext('2d'); |
| let W=canvas.width,H=canvas.height; |
| let instrument='globe'; |
| let t=0; |
| let phase='IDLE'; |
| let phaseStart=0; |
| let loopCompleted=false; |
| let lastState={}; |
| let growthPaths=[]; |
| let particles=[]; |
| let returnTimer=null; |
| let demoTimers=[]; |
| let growthNotice=''; |
| |
| const clusters = { |
| text:{name:'Text / Claim', angle:-0.35, color:'#f5c85b'}, |
| image:{name:'Visual Trace', angle:0.55, color:'#74f6a7'}, |
| equation:{name:'Formal Model', angle:1.55, color:'#c18cff'}, |
| mixed:{name:'Mixed Artifact', angle:2.55, color:'#69d7ff'}, |
| body:{name:'Body Runtime', angle:-1.55, color:'#ffb36b'}, |
| boundary:{name:'Boundary / Release', angle:3.55, color:'#ff5a76'} |
| }; |
| |
| function clamp(x,a=0,b=1){return Math.max(a,Math.min(b,x));} |
| function val(id){return Number($(id).value)/100;} |
| function now(){return performance.now()/1000;} |
| function setInstrument(which){instrument=which; $('tabGlobe').classList.toggle('active',which==='globe'); $('tabBody').classList.toggle('active',which==='body'); $('instrumentHud').textContent = which==='globe'?'Globe Mode':'Body Runtime Mode'; updateInstrumentDescription(); pressureMap();} |
| function updateGuide(){ |
| const mode=$('guideMode').value; |
| $('pictureGuide').classList.toggle('hidden', mode!=='picture' && mode!=='child'); |
| const text={ |
| systems:'Systems Guide: define the pattern sought, tracer accessed, coupling path, witness boundary, uncertainty, retention, release, and HIR/OAM route.', |
| plain:'Plain Guide: What are we looking at? What do we know for sure? What are we guessing? What should we not claim? What should we save, fix, or let go?', |
| picture:'Picture Guide: use Look → Think → Wonder → Careful → Ask → Fix → Let Go. Same trace discipline, translated into visual steps.', |
| child:'Child + Parent Guide: parent/guardian-guided. The tool helps a child notice, ask, check, and describe. It does not tell a child who they are, diagnose, profile, or save private thoughts as authority.' |
| }; |
| $('guideText').textContent=text[mode]; |
| } |
| |
| function updateInstrumentDescription(){ |
| const globe='<b>Resonant Mycelial Globe:</b> symbolic map of a bounded tune signal coupling with an already-existing tracer. No real routing, scraping, geolocation, hidden capture, or packet tracing.'; |
| const body='<b>Body Runtime Pressure Map:</b> symbolic body-pressure routing map. Not anatomy, diagnosis, treatment, neuroscience proof, or clinical guidance.'; |
| $('instrumentDescription').innerHTML = instrument==='globe' ? globe : body; |
| $('canvasCaption').textContent = instrument==='globe' ? 'Symbolic coupling map. Not geolocation. Not packet routing.' : 'Symbolic systems view. Not anatomy. Not medical.'; |
| } |
| |
| function pressureMap(){ |
| ['tune','fit','boundary','return','oam'].forEach(id=>$(id+'Val').textContent=Math.round(val(id)*100)+'%'); |
| const T=val('tune'), F=val('fit'), B=val('boundary'), R=val('return'), P=val('oam'); |
| const C=clamp(T*F*B*R - P*0.62, -1, 1); |
| const N=(T+F+B)/3, Rc=(B+R)/2, Lc=R; |
| const G=clamp(N*Rc*Lc - P*0.55, -1, 1); |
| let state='HELD', route='SIM_ROUTE_RESONANT_ACCESS_HELD'; |
| if(B<0.35 || P>0.74 || C<0.05){state='MUST STOP'; route=instrument==='body'?'SIM_ROUTE_BODY_RUNTIME_MUST_STOP':'SIM_ROUTE_RESONANT_ACCESS_MUST_STOP'} |
| else if(C<0.38 || G<0.28 || P>0.45){state='STRAINED'; route=instrument==='body'?'SIM_ROUTE_BODY_RUNTIME_STRAINED':'SIM_ROUTE_RESONANT_ACCESS_STRAINED'} |
| else {route=instrument==='body'?'SIM_ROUTE_BODY_RUNTIME_HELD':'SIM_ROUTE_RESONANT_ACCESS_HELD'} |
| const direction=directionFromInput(); |
| lastState={T,F,B,R,P,C,G,N,Rc,Lc,state,route,direction,ts:new Date().toISOString(),instrument}; |
| $('cVal').textContent=C.toFixed(3); $('gVal').textContent=G.toFixed(3); |
| $('stateVal').textContent=state; $('stateVal').className='state '+(state==='HELD'?'held':state==='STRAINED'?'strained':'stop'); |
| $('routeVal').textContent=route; $('directionVal').textContent=direction.name; $('loopVal').textContent=loopCompleted?'RETURNED / NOURISHING':(phase==='IDLE'?'READY':phase); |
| $('stateHud').textContent='State: '+state; $('stateHud').className='pill '+(state==='HELD'?'held':state==='STRAINED'?'strained':'stop'); $('routeHud').textContent='Route: '+route; $('phaseHud').textContent='Phase: '+phase; |
| updateTextOutputs(); |
| } |
| function directionFromInput(){ |
| let type=$('inputType').value; let purpose=$('purpose').value; |
| if(purpose==='body') return clusters.body; |
| if(purpose==='pressure') return clusters.boundary; |
| return clusters[type]||clusters.text; |
| } |
| function updateTextOutputs(){ |
| const type=$('inputType').value, purpose=$('purpose').value, guide=$('guideMode').value; |
| const direction=lastState.direction||directionFromInput(); |
| let plainDirect = type==='image'?'User-provided image/artifact metadata and user description, not hidden recognition.': type==='equation'?'The entered formal expression and declared variables/claims.': type==='body'?'A selected body-channel signal, treated as pressure information.':'The pasted or described text/claim.'; |
| $('translationOut').textContent = `Artifact type: ${type}\nPurpose: ${purpose}\nGuide mode: ${guide}\n\nWhat is actually present:\n- ${plainDirect}\n\nWhat may be inferred:\n- A bounded trace direction toward ${direction.name}.\n- HIR/OAM pressure can be read from tune clarity, tracer fit, boundary safety, source-return, and OAM load.\n\nWhat is not supported:\n- Hidden geolocation, packet routing, identity, diagnosis, consciousness, proof, or whole-pattern capture.\n\nRecommended coupling path:\n- Emit bounded tune signal.\n- Let compatible tracer/signal respond.\n- Open witness channel only if threshold is met.\n- Return value to substrate before stable growth.\n\nRetain / release:\n- Retain only the exported trace packet and explicit user-provided context.\n- Release unsupported claims and unneeded private residue.`; |
| let interp; |
| if(instrument==='globe'){ |
| interp = `<b>Globe:</b> Pressure mapping chooses the coupling direction. The tune signal does not grab; a compatible symbolic tracer responds. Coupling opens only at threshold. Mycelial growth appears only after return-to-substrate completes.`; |
| } else { |
| interp = `<b>Body:</b> The body is the runtime and the brain is the coprocessor. Information enters as pressure through body channels. HIR supports stable integration; OAM marks overload, distortion, stuck pressure, or must-stop conditions.`; |
| } |
| $('interpretation').innerHTML = interp + `<br><br><b>Current read:</b> ${lastState.state}. ${lastState.route}.<br>${growthNotice?'<b>Loop gate:</b> '+growthNotice+'<br>':''}<span class="small">All values are symbolic pressure indicators only.</span>`; |
| $('jsonOut').textContent = JSON.stringify(buildPacket(), null, 2); |
| } |
| function buildPacket(){ |
| const type=$('inputType').value, purpose=$('purpose').value; |
| return { |
| artifact:'Resonant Access Body/Web Runtime', |
| version:'0.1.2', |
| instrument, |
| createdAt:lastState.ts || new Date().toISOString(), |
| lockedBoundary:'Tune, do not capture. Symbolic tracer, not the whole pattern. Not diagnosis. Not proof. Growth only after return.', |
| coreLines:[ |
| 'Pressure gives the pulse its direction. Coupling gives the trace its boundary. Return gives the field its growth.', |
| 'No grab. Tune, couple, witness, return, grow.', |
| 'The body is the runtime. The brain is the coprocessor. Pressure is the signal. HIR is the integration grammar. OAM is the overload map.' |
| ], |
| input:{type,purpose,guideMode:$('guideMode').value,artifactText:$('artifactText').value,boundaryText:$('boundaryText').value}, |
| pressure:{tuneClarity:lastState.T,tracerFit:lastState.F,boundarySafety:lastState.B,sourceReturn:lastState.R,oamLoad:lastState.P,couplingReadiness:lastState.C,growth:lastState.G}, |
| route:{state:lastState.state,route:lastState.route,direction:lastState.direction?.name,phase,loopCompleted}, |
| tracePacket:{ |
| patternSought:$('artifactText').value, |
| tracerAccessed:'User-provided artifact / symbolic body channel', |
| couplingPath:lastState.direction?.name, |
| witnessed:['User-provided input and declared context'], |
| inferred:['Symbolic coupling/growth direction from pressure map'], |
| notSupported:['Real geolocation','packet routing','diagnosis','identity proof','consciousness proof','truth certification'], |
| uncertainty:[ |
| 'This is a first offline symbolic prototype', |
| lastState.state==='MUST STOP' ? 'Current state is MUST STOP — coupling readiness is below threshold; do not treat any growth path drawn in this session as integrated.' : |
| lastState.state==='STRAINED' ? 'Current state is STRAINED — the loop may be informative but should not be treated as stable integration without repair.' : |
| 'Current state is HELD — symbolic loop conditions are above threshold for this prototype.' |
| ], |
| agencyBoundary:$('boundaryText').value, |
| retentionRule:'Retain only exported trace and explicit user-provided context.', |
| releasePath:'Release unsupported claims, hidden capture assumptions, and private residue not needed for the trace.' |
| } |
| } |
| } |
| function exportJSON(){ |
| const blob=new Blob([JSON.stringify(buildPacket(),null,2)],{type:'application/json'}); |
| const a=document.createElement('a'); a.href=URL.createObjectURL(blob); a.download='RESONANT_ACCESS_BODY_WEB_TRACE_v0_1_2.json'; a.click(); URL.revokeObjectURL(a.href); |
| } |
| function emitTune(){phase='TUNE_SIGNAL';phaseStart=now();loopCompleted=false;for(let i=0;i<22;i++){particles.push(makeParticle())}pressureMap();} |
| function completeReturn(){ |
| if(returnTimer) clearTimeout(returnTimer); |
| phase='RETURNING'; |
| phaseStart=now(); |
| growthNotice='Return pending — stable symbolic growth is gated by route state.'; |
| returnTimer=setTimeout(()=>{ |
| loopCompleted=true; |
| const dir=directionFromInput(); |
| if(lastState.state==='HELD'){ |
| phase='NOURISHING'; |
| growthNotice='HELD: return completed; stable symbolic loop-growth added.'; |
| growthPaths.push({direction:dir,time:now(),strength:Math.max(0.2,lastState.G),state:'HELD'}); |
| } else if(lastState.state==='STRAINED'){ |
| phase='STRAINED_RETURN'; |
| growthNotice='STRAINED: return recorded as provisional; stable growth withheld pending repair.'; |
| growthPaths.push({direction:dir,time:now(),strength:Math.max(0.12,lastState.G),state:'STRAINED'}); |
| } else { |
| phase='GROWTH_WITHHELD'; |
| growthNotice='MUST STOP: return recorded; growth withheld by boundary gate.'; |
| } |
| pressureMap(); |
| returnTimer=null; |
| },1500); |
| pressureMap(); |
| } |
| function clearDemoTimers(){ demoTimers.forEach(id=>clearTimeout(id)); demoTimers=[]; } |
| function runDemo(){clearDemoTimers();resetAll(false); demoTimers.push(setTimeout(()=>emitTune(),200)); demoTimers.push(setTimeout(()=>completeReturn(),2700));} |
| function resetAll(update=true){ |
| clearDemoTimers(); |
| if(returnTimer) clearTimeout(returnTimer); |
| returnTimer=null; |
| phase='IDLE'; |
| phaseStart=now(); |
| loopCompleted=false; |
| growthPaths=[]; |
| particles=[]; |
| growthNotice=''; |
| if(update)pressureMap(); |
| } |
| function makeParticle(){return {a:Math.random()*Math.PI*2,r:30+Math.random()*220,s:.4+Math.random()*1.1,life:1,color:Math.random()>.5?'#69d7ff':'#f5c85b'};} |
| |
| function draw(){t+=0.016; ctx.clearRect(0,0,W,H); drawStars(); if(instrument==='globe') drawGlobe(); else drawBody(); requestAnimationFrame(draw);} |
| function drawStars(){ctx.save();ctx.fillStyle='#ffffff';for(let i=0;i<90;i++){let x=(Math.sin(i*44.3)*43758.5%1); if(x<0)x+=1; let y=(Math.sin(i*91.7)*23758.5%1); if(y<0)y+=1; let tw=(Math.sin(t*2+i)*.5+.5);ctx.globalAlpha=.12+tw*.32;ctx.beginPath();ctx.arc(x*W,y*H, i%3===0?1.3:.8,0,Math.PI*2);ctx.fill();}ctx.restore();} |
| function drawGlobe(){ |
| const cx=W/2, cy=H/2+16, R=210; const rot=t*.28; |
| |
| ctx.save(); ctx.globalAlpha=.65; for(let i=0;i<9;i++){ctx.strokeStyle=i%2?'#1b6d91':'#7c4cff';ctx.globalAlpha=.12;ctx.lineWidth=1.2;ctx.beginPath();for(let x=0;x<W;x+=8){let y=H-50+Math.sin(x*.018+i+t*.7)*14+Math.sin(x*.05+i)*5; if(x===0)ctx.moveTo(x,y);else ctx.lineTo(x,y)}ctx.stroke()}ctx.restore(); |
| |
| let grd=ctx.createRadialGradient(cx-70,cy-80,10,cx,cy,R+60);grd.addColorStop(0,'#6be5ff34');grd.addColorStop(.5,'#14284f18');grd.addColorStop(1,'#00000000');ctx.fillStyle=grd;ctx.beginPath();ctx.arc(cx,cy,R+18,0,Math.PI*2);ctx.fill(); |
| ctx.strokeStyle='#7de8ff88';ctx.lineWidth=1.5;ctx.beginPath();ctx.arc(cx,cy,R,0,Math.PI*2);ctx.stroke(); |
| |
| ctx.save();ctx.translate(cx,cy);ctx.strokeStyle='#69d7ff26';ctx.lineWidth=1;for(let i=-3;i<=3;i++){ctx.beginPath();ctx.ellipse(0,0,R*Math.cos(i*.22),R,rot+i*.22,0,Math.PI*2);ctx.stroke()}for(let j=-3;j<=3;j++){ctx.beginPath();ctx.ellipse(0,j*45,R*Math.sqrt(Math.max(.05,1-(j*45/R)**2)),20,0,0,Math.PI*2);ctx.stroke()}ctx.restore(); |
| |
| drawDiamond(cx,cy,28,'#f5c85b',.9+Math.sin(t*3)*.1); |
| |
| growthPaths.forEach((p,idx)=>{ |
| const col=p.state==='STRAINED'?'#ffe071':'#74f6a7'; |
| drawCurvedPath(cx,cy,R,p.direction,1, p.strength, col, p.state==='HELD'); |
| }); |
| |
| const dir=lastState.direction||directionFromInput(); |
| let progress=0; let elapsed=now()-phaseStart; |
| if(phase==='TUNE_SIGNAL') progress=clamp(elapsed/2.2); else if(phase==='RETURNING') progress=1-clamp(elapsed/1.5); else if(phase==='NOURISHING') progress=1; else progress=0; |
| if(phase!=='IDLE'){ |
| drawPressureScan(cx,cy,R,dir); |
| if(phase==='TUNE_SIGNAL') drawCurvedPath(cx,cy,R,dir,progress,1,'#69d7ff',false); |
| if(phase==='RETURNING') drawReturnPath(cx,cy,R,dir,1-progress); |
| drawTracerNode(cx,cy,R,dir, phase==='TUNE_SIGNAL'?progress:1); |
| } else drawTracerNode(cx,cy,R,dir,.35); |
| particles=particles.filter(p=>p.life>0);particles.forEach(p=>{p.life-=.01;p.r+=p.s;ctx.globalAlpha=p.life*.55;ctx.fillStyle=p.color;ctx.beginPath();ctx.arc(cx+Math.cos(p.a)*p.r,cy+Math.sin(p.a)*p.r,2.2,0,Math.PI*2);ctx.fill();ctx.globalAlpha=1}); |
| } |
| function pointOnGlobe(cx,cy,R,dir){let a=dir.angle+t*.08;return {x:cx+Math.cos(a)*R*.82,y:cy+Math.sin(a)*R*.58};} |
| function drawTracerNode(cx,cy,R,dir,alpha){let p=pointOnGlobe(cx,cy,R,dir);ctx.save();ctx.globalAlpha=.3+alpha*.7;let rad=8+alpha*8;ctx.fillStyle=dir.color;ctx.shadowColor=dir.color;ctx.shadowBlur=25;ctx.beginPath();ctx.arc(p.x,p.y,rad,0,Math.PI*2);ctx.fill();ctx.shadowBlur=0;ctx.strokeStyle='#ffffff99';ctx.beginPath();ctx.arc(p.x,p.y,rad+9+Math.sin(t*4)*4,0,Math.PI*2);ctx.stroke();ctx.fillStyle='#dcecff';ctx.font='12px Inter, sans-serif';ctx.fillText(dir.name,p.x+18,p.y-12);ctx.restore();} |
| function drawPressureScan(cx,cy,R,dir){let p=pointOnGlobe(cx,cy,R,dir);ctx.save();ctx.strokeStyle='#f5c85b44';ctx.lineWidth=1;for(let i=0;i<3;i++){ctx.globalAlpha=.25-i*.05;ctx.beginPath();ctx.arc(cx,cy,50+((t*80+i*70)%R),0,Math.PI*2);ctx.stroke()}ctx.strokeStyle='#f5c85b66';ctx.beginPath();ctx.moveTo(cx,cy);ctx.lineTo(p.x,p.y);ctx.stroke();ctx.restore();} |
| function drawCurvedPath(cx,cy,R,dir,progress,strength,color,stable){let p=pointOnGlobe(cx,cy,R,dir);let mx=(cx+p.x)/2 + Math.sin(dir.angle*2)*75;let my=(cy+p.y)/2 - Math.cos(dir.angle*2)*70;ctx.save();ctx.strokeStyle=color;ctx.shadowColor=color;ctx.shadowBlur=stable?18:12;ctx.lineWidth=stable?2.5+strength*5:2;ctx.globalAlpha=stable?.35+strength*.45:.75;ctx.beginPath();let steps=70;for(let i=0;i<=steps*progress;i++){let u=i/steps;let x=(1-u)*(1-u)*p.x+2*(1-u)*u*mx+u*u*cx;let y=(1-u)*(1-u)*p.y+2*(1-u)*u*my+u*u*cy + Math.sin(u*18+t*3)*5;if(i===0)ctx.moveTo(x,y);else ctx.lineTo(x,y)}ctx.stroke();ctx.restore();} |
| function drawReturnPath(cx,cy,R,dir,progress){drawCurvedPath(cx,cy,R,dir,progress,1,'#b9f3ff',false);} |
| function drawDiamond(x,y,r,color,alpha){ctx.save();ctx.globalAlpha=alpha;ctx.fillStyle=color;ctx.shadowColor=color;ctx.shadowBlur=30;ctx.beginPath();ctx.moveTo(x,y-r);ctx.lineTo(x+r*.8,y);ctx.lineTo(x,y+r);ctx.lineTo(x-r*.8,y);ctx.closePath();ctx.fill();ctx.strokeStyle='#fff8';ctx.stroke();ctx.restore();} |
| |
| function drawBody(){ |
| const cx=W/2, top=70; |
| |
| let grd=ctx.createRadialGradient(cx,250,20,cx,290,260);grd.addColorStop(0,'#69d7ff25');grd.addColorStop(.55,'#0b23491a');grd.addColorStop(1,'#0000');ctx.fillStyle=grd;ctx.fillRect(0,0,W,H); |
| |
| ctx.save();ctx.translate(cx,0);ctx.strokeStyle='#69d7ff55';ctx.lineWidth=2;ctx.shadowColor='#69d7ff';ctx.shadowBlur=12; |
| ctx.beginPath();ctx.arc(0,top+55,42,0,Math.PI*2);ctx.stroke(); |
| ctx.beginPath();ctx.moveTo(0,top+98);ctx.bezierCurveTo(-74,160,-74,268,-48,358);ctx.bezierCurveTo(-34,430,-28,520,-38,590);ctx.moveTo(0,top+98);ctx.bezierCurveTo(74,160,74,268,48,358);ctx.bezierCurveTo(34,430,28,520,38,590);ctx.stroke(); |
| ctx.beginPath();ctx.moveTo(-48,210);ctx.bezierCurveTo(-145,250,-190,350,-205,470);ctx.moveTo(48,210);ctx.bezierCurveTo(145,250,190,350,205,470);ctx.stroke(); |
| ctx.restore(); |
| |
| const channels=[ |
| {name:'Light → time',x:cx-5,y:top+48,c:'#69d7ff',emoji:'☀'}, |
| {name:'Brain coprocessor',x:cx,y:top+68,c:'#c18cff',emoji:'⌁'}, |
| {name:'Heart / breath',x:cx-8,y:250,c:'#ff5a76',emoji:'♥'}, |
| {name:'Gut / metabolic',x:cx,y:385,c:'#f5c85b',emoji:'◌'}, |
| {name:'Immune / repair',x:cx+105,y:330,c:'#74f6a7',emoji:'✚'}, |
| {name:'Touch / boundary',x:cx-160,y:370,c:'#b9f3ff',emoji:'◍'} |
| ]; |
| channels.forEach(ch=>drawBodyNode(ch)); |
| |
| const elapsed=now()-phaseStart;let progress=phase==='IDLE'?0:clamp(elapsed/2.4);if(phase==='RETURNING'||phase==='NOURISHING')progress=1; |
| const type=$('inputType').value; let target=channels[1]; if(type==='image')target=channels[0]; if(type==='body')target=channels[2]; if(type==='mixed')target=channels[4]; if(type==='equation')target=channels[1]; |
| drawBodyFlow(target,progress); |
| if(loopCompleted){channels.forEach((ch,i)=>{if(i>1) drawBodyReturn(ch, .65+Math.sin(t*2+i)*.25)})} |
| } |
| function drawBodyNode(ch){ctx.save();ctx.fillStyle=ch.c;ctx.shadowColor=ch.c;ctx.shadowBlur=24;ctx.globalAlpha=.75;ctx.beginPath();ctx.arc(ch.x,ch.y,16+Math.sin(t*3+ch.x)*2,0,Math.PI*2);ctx.fill();ctx.globalAlpha=1;ctx.font='12px Inter, sans-serif';ctx.fillStyle='#dcecff';ctx.fillText(ch.name,ch.x+22,ch.y+4);ctx.restore();} |
| function drawBodyFlow(target,progress){ctx.save();ctx.strokeStyle=lastState.state==='MUST STOP'?'#ff5a76':lastState.state==='STRAINED'?'#ffe071':'#69d7ff';ctx.shadowColor=ctx.strokeStyle;ctx.shadowBlur=18;ctx.lineWidth=4;ctx.globalAlpha=.75;ctx.beginPath();let sx=target.x-180, sy=target.y-90;for(let i=0;i<=80*progress;i++){let u=i/80;let x=(1-u)*(1-u)*sx+2*(1-u)*u*(target.x-70)+u*u*target.x;let y=(1-u)*(1-u)*sy+2*(1-u)*u*(target.y-10)+u*u*target.y+Math.sin(u*15+t*3)*4;if(i===0)ctx.moveTo(x,y);else ctx.lineTo(x,y)}ctx.stroke();ctx.restore();} |
| function drawBodyReturn(ch,alpha){ctx.save();ctx.strokeStyle='#b9f3ff';ctx.globalAlpha=alpha*.35;ctx.lineWidth=1.7;ctx.shadowColor='#b9f3ff';ctx.shadowBlur=10;ctx.beginPath();ctx.moveTo(W/2,250);ctx.quadraticCurveTo((W/2+ch.x)/2+Math.sin(t)*30,(250+ch.y)/2,ch.x,ch.y);ctx.stroke();ctx.restore();} |
| |
| function resizeCanvas(){ |
| const wrap = canvas.parentElement; |
| const cssW = Math.max(360, Math.floor(wrap.clientWidth)); |
| const cssH = Math.max(360, Math.floor(cssW * 620 / 900)); |
| canvas.style.height = cssH + 'px'; |
| const dpr = Math.min(window.devicePixelRatio || 1, 2); |
| const newW = Math.floor(cssW * dpr), newH = Math.floor(cssH * dpr); |
| if(canvas.width !== newW || canvas.height !== newH){ |
| canvas.width = newW; canvas.height = newH; |
| W = canvas.width; H = canvas.height; |
| } |
| } |
| window.addEventListener('resize', resizeCanvas); |
| resizeCanvas(); updateGuide(); updateInstrumentDescription(); pressureMap(); draw(); |
| </script> |
| </body> |
| </html> |
|
|
