Follow a catalog's recovery dependencies and compare two model rehearsal records

Select the code and use your copy shortcut. Changes in this preview are temporary.

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Harbor Catalog · recovery plan review</title><style>*{box-sizing:border-box}body{margin:0;background:#eef2f4;color:#203943;font:16px/1.55 system-ui,sans-serif}main{max-width:980px;margin:auto;padding:24px}h1{font-size:32px;line-height:1.18}h2{font-size:23px}h3{font-size:19px}.eyebrow{color:#4c6978;letter-spacing:.05em}.card{background:white;border:1px solid #c1cfd4;border-radius:5px;padding:18px;margin:16px 0}.boundary{background:#244856;color:white}.dependencies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.dependency{border-top:5px solid #567e8a}.toolbar{display:flex;flex-wrap:wrap;gap:9px;margin:16px 0}button,textarea{font:inherit;color:inherit}button{min-height:44px;padding:9px 13px;background:#fff;border:1px solid #527484;border-radius:4px;cursor:pointer}button[aria-pressed=true]{background:#285063;color:white}button:focus-visible,textarea:focus-visible{outline:3px solid #ae571c;outline-offset:3px}.exception{border-left:5px solid #b06b28;background:#fff5df}.record{display:grid;grid-template-columns:1fr 1fr;gap:14px}.record .card{margin:0}label{display:block;font-weight:650;margin:14px 0 5px}textarea{width:100%;min-width:0;max-width:100%;min-height:95px;padding:10px;border:1px solid #7b929d;border-radius:4px;resize:vertical}.copy p{white-space:pre-wrap;overflow-wrap:anywhere}#status{color:#78451e;font-weight:650}footer{color:#516c79;margin:24px 0}[hidden]{display:none!important}@media(max-width:520px){main{padding:12px}h1{font-size:27px}.dependencies,.record{grid-template-columns:1fr}.card{padding:14px}}</style></head><body><main><p class="eyebrow">FICTIONAL HARBOR CATALOG · REHEARSAL REVIEW</p><h1>A homepage can load while a linked file is missing</h1><p>Trace the dependencies, then compare each check with its expected record-and-file relationship.</p><section class="card boundary"><h2>Teaching fixture</h2><p>A01 → F01 · A02 → F02</p><p>Planned sources: storage snapshot ST-7, database checkpoint DB-7, application build APP-7. These are illustrative references, not live systems or backups.</p></section><h2>Inspect a dependency</h2><div class="dependencies"><button id="storage" class="card dependency" type="button" aria-pressed="true">1 · Storage<br>ST-7</button><button id="database" class="card dependency" type="button" aria-pressed="false">2 · Catalog database<br>DB-7</button><button id="application" class="card dependency" type="button" aria-pressed="false">3 · Application<br>APP-7</button></div><section class="card" aria-live="polite"><h3 id="dependency-title">Storage snapshot ST-7</h3><p><strong>Prerequisite:</strong> <span id="prerequisite">Identify the isolated rehearsal target and intended recovery sources.</span></p><p><strong>Check to record:</strong> <span id="dependency-check">Storage restoration result and references to its checks.</span></p></section><section class="card"><h2>Six planned steps</h2><ol><li>Identify the isolated target and ST-7, DB-7 and APP-7 identities.</li><li>Restore private storage using the maintained system procedure; record the result.</li><li>Restore the matching catalog database; check expected A01/F01 and A02/F02 relationships.</li><li>Start APP-7 against the restored dependencies; check version and configuration.</li><li>Exercise known catalog lookups and open the linked files; retain actual exceptions.</li><li>Review the required results, remaining gaps and designated owner's return decision.</li></ol><p>The order belongs to this teaching system. Actual recovery steps and additional infrastructure belong in the system's maintained runbook.</p></section><section class="card"><h2>Two separate model rehearsal records</h2><div class="toolbar" aria-label="Model rehearsal record"><button id="r1" type="button" aria-pressed="true">Model R1</button><button id="r2" type="button" aria-pressed="false">Model R2</button></div><div class="record"><section class="card"><h3>Expected relationship</h3><p>A02 links to F02, and the linked file opens.</p></section><section class="card exception" aria-live="polite"><h3 id="record-title">Model R1 · initial fictional rehearsal</h3><div id="record-results"><p>Homepage: loads.</p><p>A01 lookup and F01 opening: record found; file opens.</p><p>A02 lookup: record found.</p><p>F02 opening from A02: file missing.</p></div><p id="record-limit">The F02 exception remains open. Homepage loading does not establish complete recovery.</p></section></div><section class="card exception"><h3>Original R1 exception · retained</h3><p>Affected relationship: A02/F02. Check: open the file linked from A02. Observed result in R1: file missing.</p><p>The actual cause, later investigation evidence and service return decision are not supplied.</p></section></section><section class="card"><h2>Prepare a plan and review note</h2><p>Use controlled runbook references. Keep credentials and sensitive infrastructure details in their established secure location.</p><div id="fields"></div><div class="toolbar"><button id="build" type="button">Build review copy</button><button id="reset" type="button">Reset typed work</button></div><section id="confirmation" hidden><h3>Clear all eight typed fields?</h3><div class="toolbar"><button id="keep" type="button">Keep my text</button><button id="clear" type="button">Clear typed fields</button></div></section><section id="review" class="card copy" hidden><h2>Your supplied recovery-plan review</h2><p>This page has not restored data, executed a check or made a return decision.</p><div id="review-content"></div></section></section><p id="status" role="status" aria-live="polite">Model records are fictional. No operational recovery is being performed.</p><footer>Temporary review copy only. Keep actual rehearsal evidence, exceptions and return decisions in the maintained recovery record.</footer></main><script>(()=>{'use strict';const $=s=>document.querySelector(s),dependencies={storage:['Storage snapshot ST-7','Identify the isolated rehearsal target and intended recovery sources.','Storage restoration result and references to its checks.'],database:['Catalog database checkpoint DB-7','Restore the private storage snapshot ST-7 using the maintained system procedure.','Database restoration result and expected A01/F01 and A02/F02 relationships.'],application:['Application build APP-7','Restore the compatible storage and matching catalog database checkpoints.','Application version and dependency configuration, then known catalog lookups and linked-file opening checks.']};for(const[id,row]of Object.entries(dependencies))$('#'+id).addEventListener('click',()=>{for(const key of Object.keys(dependencies))$('#'+key).setAttribute('aria-pressed',String(key===id));for(const[n,target]of ['dependency-title','prerequisite','dependency-check'].entries())$('#'+target).textContent=row[n];});const records={r1:['Model R1 · initial fictional rehearsal',['Homepage: loads.','A01 lookup and F01 opening: record found; file opens.','A02 lookup: record found.','F02 opening from A02: file missing.'],'The F02 exception remains open. Homepage loading does not establish complete recovery.'],r2:['Model R2 · later hypothetical entry',['A02 lookup: record found.','F02 opening from A02: file opens.'],'R2 covers A02/F02 only. It does not rewrite R1 or establish that every required recovery check has passed.']};for(const[id,row]of Object.entries(records))$('#'+id).addEventListener('click',()=>{for(const key of Object.keys(records))$('#'+key).setAttribute('aria-pressed',String(key===id));$('#record-title').textContent=row[0];$('#record-results').replaceChildren();for(const text of row[1]){const p=document.createElement('p');p.textContent=text;$('#record-results').append(p);}$('#record-limit').textContent=row[2];});const fields=[['scope','System scope and responsible owner/contact reference'],['objectives','Recovery objectives and their source'],['isolation','Rehearsal environment and isolation checks'],['checkpoints','Backup, checkpoint and build references'],['dependencies','Dependency order and maintained procedure references'],['validation','Expected data and functional checks'],['return','Return criteria and designated decision owner'],['notes','Actual results, exceptions and rehearsal review note, if supplied']];for(const[id,label]of fields){const l=document.createElement('label'),f=document.createElement('textarea');l.htmlFor=id;l.textContent=label;f.id=id;f.addEventListener('input',()=>{$('#review').hidden=true;$('#status').textContent='Plan changed. Build a new review copy; the original model records remain unchanged.';});$('#fields').append(l,f);}$('#build').addEventListener('click',()=>{const missing=['scope','checkpoints','validation','return'].filter(id=>!$('#'+id).value.trim());$('#review').hidden=true;if(missing.length){$('#status').textContent='Complete: '+missing.map(id=>fields.find(f=>f[0]===id)[1]).join(', ')+'.';return;}$('#review-content').replaceChildren();for(const[id,label]of fields){const h=document.createElement('h3'),p=document.createElement('p');h.textContent=label;p.textContent=$('#'+id).value.trim()||'Not supplied.';$('#review-content').append(h,p);}$('#review').hidden=false;$('#status').textContent='Review copy built. No recovery operation, validation result or return decision has been inferred.';});$('#reset').addEventListener('click',()=>{$('#confirmation').hidden=false;$('#keep').focus();});$('#keep').addEventListener('click',()=>{$('#confirmation').hidden=true;$('#reset').focus();$('#status').textContent='Kept all eight typed fields.';});$('#clear').addEventListener('click',()=>{for(const[id]of fields)$('#'+id).value='';$('#review').hidden=true;$('#confirmation').hidden=true;$('#scope').focus();$('#status').textContent='All eight typed fields were cleared. Model records and selected dependency are unchanged.';});})();</script></body></html>