app.js

const $=id=>document.getElementById(id);
const esc=v=>String(v??'').replace(/[&<>"']/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
let bundle;
function structure(b){
  if(b?.schema_version!=='clw-reliability-lab/1'||!Array.isArray(b.experiments)||b.experiments.length!==4||typeof b.source_sha256!=='string')throw Error('Not a four-fixture Reliability Lab result.');
  for(const e of b.experiments)for(const p of ['before','after'])if(!e[p]?.trace?.messages||!Array.isArray(e[p].attempts))throw Error('Incomplete evidence.');
}
function phase(p,label){return `<article class="panel"><div class="phase">${label}</div><p class="metric">${esc(p.outcome.replaceAll('_',' '))}</p><p>${p.attempts.length} attempt${p.attempts.length===1?'':'s'} · ${esc(p.policy.timeout_ms)} ms deadline</p><ul class="trace">${p.attempts.map(a=>`<li>Call ${a.attempt}: ${esc(a.outcome)} · ${esc(a.elapsed_ms)} ms</li>`).join('')}</ul><details><summary>Clinic findings (${p.clinic.findings.filter(f=>f.severity!=='info').length})</summary>${p.clinic.findings.filter(f=>f.severity!=='info').map(f=>`<p><strong>${esc(f.id)}</strong>: ${esc(f.explain)}</p>`).join('')||'<p>No heuristic findings.</p>'}</details><details><summary>Trace and integrity digest</summary><p>${esc(p.trace_sha256)}</p><pre>${esc(JSON.stringify(p.trace,null,2))}</pre></details></article>`;}
function render(){const e=bundle.experiments.find(x=>x.id===$('fixture').value);$('experiment').innerHTML=`<h2>${esc(e.title)}</h2><p class="note">${esc(e.change)}</p><div class="grid">${phase(e.before,'BEFORE')}${phase(e.after,'AFTER')}</div><h3>Fixture checks <span class="${e.verification.pass?'pass':'fail'}">${e.verification.pass?'pass':'fail'}</span></h3><ul class="checks">${e.verification.checks.map(c=>`<li><span class="${c.pass?'pass':'fail'}">${c.pass?'PASS':'FAIL'}</span> · ${esc(c.name)}${c.observed!==undefined?' · observed '+esc(c.observed):''}</li>`).join('')}</ul><p class="note">Tradeoff: ${esc(e.tradeoff)}</p>`;}
function download(data){const a=document.createElement('a'),url=URL.createObjectURL(new Blob([JSON.stringify(data,null,2)],{type:'application/json'}));a.href=url;a.download='reliability-evidence.json';a.click();setTimeout(()=>URL.revokeObjectURL(url),1000);}
async function integrity(b){for(const e of b.experiments)for(const p of ['before','after']){const bytes=new TextEncoder().encode(JSON.stringify(e[p].trace));const digest=Array.from(new Uint8Array(await crypto.subtle.digest('SHA-256',bytes)),x=>x.toString(16).padStart(2,'0')).join('');if(digest!==e[p].trace_sha256)throw Error('Trace integrity mismatch.');}}
$('upload').onchange=async()=>{try{const file=$('upload').files[0];if(!file)return;if(file.size>2097152)throw Error('Maximum comparison file size is 2 MiB.');const other=JSON.parse(await file.text());structure(other);await integrity(other);if(other.source_sha256!==bundle.source_sha256||other.fixture_version!==bundle.fixture_version)throw Error('Source or fixture version differs. These runs are not directly comparable.');const rows=bundle.experiments.map(e=>{const o=other.experiments.find(x=>x.id===e.id);if(!o)throw Error('Missing fixture.');const agrees=['before','after'].every(p=>e[p].outcome===o[p].outcome&&e[p].attempts.length===o[p].attempts.length&&JSON.stringify(e[p].policy)===JSON.stringify(o[p].policy));return `<p class="${agrees?'pass':'fail'}">${esc(e.id)}: ${agrees?'same outcome and policy':'DIFFERENT outcome or policy'}</p>`;});$('comparison').hidden=false;$('comparison').innerHTML=`<h2>Result comparison</h2><p>${esc(bundle.runtime.platform)} → ${esc(other.runtime.platform)} (declared runtimes)</p>${rows.join('')}<p>Trace hashes checked. Timings are observations, not a cloud ranking.</p>`;$('status').textContent='Comparison stays in this browser.';}catch(e){$('comparison').hidden=true;$('comparison').replaceChildren();$('status').textContent=e.message;}};
$('fixture').onchange=render;$('download').onclick=()=>bundle&&download(bundle);
try{const response=await fetch('sample.json');if(!response.ok)throw Error('Recorded sample unavailable.');bundle=await response.json();structure(bundle);await integrity(bundle);$('fixture').innerHTML=bundle.experiments.map(e=>`<option value="${esc(e.id)}">${esc(e.title)}</option>`).join('');$('status').textContent=`Recorded ${bundle.generated_at} · ${bundle.runtime.platform} / ${bundle.runtime.os} ${bundle.runtime.arch}. This page replays evidence; it does not launch cloud jobs.`;$('provenance').textContent='Source SHA-256 '+bundle.source_sha256;render();}catch(e){$('status').textContent=e.message;$('download').disabled=true;}