MediaWiki:Gadget-DiagnosticTreeScoring.js: Difference between revisions

From Painwiki
Jump to navigation Jump to search
No edit summary
Tag: Manual revert
No edit summary
Line 9: Line 9:
  *
  *
  * Requires: mediawiki.api
  * Requires: mediawiki.api
*
* PATCH NOTES (2026-06):
*  - buildRedFlags() now reads emergency/urgent arrays from CURRENT_SCHEMA
*    with fallback to hardcoded RF_EMERGENCY / RF_URGENT constants.
*    All existing regions (Upper Thoracic, Anterior Shoulder, etc.) are
*    unaffected — they have no emergency/urgent fields in their JSON so
*    the fallback fires and behaviour is identical to before.
*  - renderInterfaceHTML() now accepts schema param and uses
*    schema.region_label for the masthead region string.
*  - bootHost() passes schema to renderInterfaceHTML().
  */
  */


Line 28: Line 38:
// ── RED FLAGS ──────────────────────────────────────────────────────
// ── RED FLAGS ──────────────────────────────────────────────────────
function buildRedFlags(){
function buildRedFlags(){
  // PATCH: read from schema if present, otherwise fall back to hardcoded constants
  var emergency = (CURRENT_SCHEMA.emergency && CURRENT_SCHEMA.emergency.length)
    ? CURRENT_SCHEMA.emergency : RF_EMERGENCY;
  var urgent = (CURRENT_SCHEMA.urgent && CURRENT_SCHEMA.urgent.length)
    ? CURRENT_SCHEMA.urgent : RF_URGENT;
   function makeFlags(arr,id,isUrgent){
   function makeFlags(arr,id,isUrgent){
     document.getElementById(id).innerHTML=arr.map(rf=>
     document.getElementById(id).innerHTML=arr.map(rf=>
Line 40: Line 55:
     ).join('');
     ).join('');
   }
   }
   makeFlags(RF_EMERGENCY,'rf-emergency-items',false);
   makeFlags(emergency,'rf-emergency-items',false);
   makeFlags(RF_URGENT,'rf-urgent-items',true);
   makeFlags(urgent,'rf-urgent-items',true);
   document.getElementById('btn-affirm').addEventListener('click',()=>{
   document.getElementById('btn-affirm').addEventListener('click',()=>{
     document.getElementById('btn-affirm').style.display='none';
     document.getElementById('btn-affirm').style.display='none';
Line 57: Line 72:
// ── BROAD DIFFERENTIAL ─────────────────────────────────────────────
// ── BROAD DIFFERENTIAL ─────────────────────────────────────────────
function buildBroadDiff(){
function buildBroadDiff(){
   document.getElementById('broad-grid').innerHTML=BROAD_DIFF.map(d=>
  const broadDiff = (CURRENT_SCHEMA.broad_differential && CURRENT_SCHEMA.broad_differential.length)
    ? CURRENT_SCHEMA.broad_differential : BROAD_DIFF;
   document.getElementById('broad-grid').innerHTML=broadDiff.map(d=>
     '<div class="dt-diff-item">'+
     '<div class="dt-diff-item">'+
     '<div class="dt-diff-confidence '+d.confidence+'">'+d.confidence+'</div>'+
     '<div class="dt-diff-confidence '+d.confidence+'">'+d.confidence+'</div>'+
Line 230: Line 247:
       }
       }


       // Render the interface HTML into the host element
       // PATCH: pass schema to renderInterfaceHTML for region label
      // then boot the scoring engine
       renderInterfaceHTML( hostEl, schema );
       renderInterfaceHTML( hostEl );
       bootScoringInterface( hostEl, schema );
       bootScoringInterface( hostEl, schema );


Line 246: Line 262:
     Builds the shell, red flag panels, grid, and broad diff
     Builds the shell, red flag panels, grid, and broad diff
     into the host element — without any JS execution
     into the host element — without any JS execution
    PATCH: accepts schema param for region_label
     ══════════════════════════════════════════════════════ */
     ══════════════════════════════════════════════════════ */


   function renderInterfaceHTML( hostEl ) {
   function renderInterfaceHTML( hostEl, schema ) {
    // PATCH: use schema.region_label if present, fall back to original string
    var regionLabel = ( schema && schema.region_label )
      ? schema.region_label
      : 'Upper Thoracic Back Pain';
 
     hostEl.innerHTML = [
     hostEl.innerHTML = [
       '<div class="proto-shell">',
       '<div class="proto-shell">',
Line 256: Line 278:
       '  <div class="proto-logo">Pain<span>Wiki</span></div>',
       '  <div class="proto-logo">Pain<span>Wiki</span></div>',
       '  <div class="proto-right">',
       '  <div class="proto-right">',
       '    <span class="proto-region">Diagnostic Algorithm &middot; Upper Thoracic Back Pain</span>',
       '    <span class="proto-region">Diagnostic Algorithm &middot; ' + regionLabel + '</span>',
       '    <button class="learning-toggle" id="learning-toggle-btn">Learning: ON</button>',
       '    <button class="learning-toggle" id="learning-toggle-btn">Learning: ON</button>',
       '  </div>',
       '  </div>',

Revision as of 16:43, 5 June 2026

/**
 * DiagnosticTree-Scoring.js — Upper Thoracic Probabilistic Scoring Model
 * Copy entire contents to: MediaWiki:Gadget-DiagnosticTreeScoring.js
 *
 * Embed on a wiki page with:
 *   <div class="scoring-tree-host"
 *        data-tree-page="DiagnosticTree/UpperThoracicBackPain">
 *   </div>
 *
 * Requires: mediawiki.api
 *
 * PATCH NOTES (2026-06):
 *   - buildRedFlags() now reads emergency/urgent arrays from CURRENT_SCHEMA
 *     with fallback to hardcoded RF_EMERGENCY / RF_URGENT constants.
 *     All existing regions (Upper Thoracic, Anterior Shoulder, etc.) are
 *     unaffected — they have no emergency/urgent fields in their JSON so
 *     the fallback fires and behaviour is identical to before.
 *   - renderInterfaceHTML() now accepts schema param and uses
 *     schema.region_label for the masthead region string.
 *   - bootHost() passes schema to renderInterfaceHTML().
 */

( function () {
  'use strict';

  /* ══════════════════════════════════════════════════════
     ALL SCORING ENGINE FUNCTIONS
     T, MUSCLE_IDS, DAG are module-level vars set from schema
     ══════════════════════════════════════════════════════ */

// T, MUSCLE_IDS, DAG, CURRENT_SCHEMA set in bootScoringInterface after schema loads
var T, MUSCLE_IDS, DAG, CURRENT_SCHEMA;
const LS_KEY='painwiki_upper_thoracic_counts_v1';
const RF_EMERGENCY=[{"id": "rf-e1", "label": "Aortic dissection", "question": "Sudden tearing or ripping interscapular pain; hypertension or Marfan features; pulse or BP difference between arms?"}, {"id": "rf-e2", "label": "Pulmonary embolism", "question": "Sudden-onset pleuritic chest or back pain (sharp, worse on inhalation); unexplained breathlessness, tachycardia, or hypoxia; recent immobility, surgery, or long-haul travel?"}, {"id": "rf-e3", "label": "Spinal cord compression / myelopathy", "question": "Bilateral arm or leg weakness, gait disturbance, loss of hand dexterity, or bowel/bladder dysfunction alongside neck or upper back pain?"}, {"id": "rf-e4", "label": "Meningism", "question": "Neck and upper back pain with fever, photophobia, or cerebellar signs (ataxia, dysarthria, nystagmus)?"}];
const RF_URGENT=[{"id": "rf-u1", "label": "Vertebral fracture", "question": "History of significant trauma, or patient is osteoporotic (post-menopausal, long-term corticosteroids, age > 70) with sudden-onset upper thoracic pain?"}, {"id": "rf-u2", "label": "Serious spinal pathology (tumour / infection)", "question": "Constant, progressive upper thoracic pain unrelated to posture or movement, worse at night lying down? Unexplained weight loss, fever, or history of cancer?"}, {"id": "rf-u3", "label": "Cervical instability", "question": "History of head or neck trauma combined with bilateral upper limb symptoms, gait disturbance, or upper cervical pain?"}, {"id": "rf-u4", "label": "Cardiac angina (exertional component)", "question": "Upper thoracic or interscapular pain with a clear exertional component, relieved by rest or GTN? Left-sided with arm radiation?"}, {"id": "rf-u5", "label": "Inflammatory arthropathy", "question": "Bilateral posterior neck or thoracic stiffness WORSE in the morning and improving with movement, with peripheral joint swelling or systemic symptoms?"}];
const BROAD_DIFF=[{"condition": "Cervical disc herniation (C5\u2013C7)", "confidence": "uncommon", "mimics": "Upper thoracic and interscapular referred pain via dorsal rami; arm symptoms overlapping with scaleni and trapezius TrP patterns", "distinguishing_feature": "Dermatomal arm pain; reflex change (biceps C5\u2013C6, triceps C7); true myotomal weakness; Spurling's test positive. TrP pain does not produce reflex changes or dermatomal sensory deficit. TrPs commonly develop secondarily to radiculopathy.", "action": "MRI cervical spine if neurological signs present. Treat TrPs concurrently \u2014 they frequently coexist with disc pathology and may be the dominant pain source."}, {"condition": "Thoracic outlet syndrome \u2014 neurological", "confidence": "rare", "mimics": "Arm and hand symptoms with upper thoracic pain; ulnar symptoms overlap with scaleni and pectoralis minor patterns", "distinguishing_feature": "Roos test (EAST test) positive at 3 minutes; nerve conduction studies confirm. Scaleni TrPs frequently coexist with and drive TOS symptoms \u2014 TrP inactivation often resolves or substantially reduces TOS.", "action": "Inactivate scaleni TrPs first before TOS workup. Refer for nerve conduction studies if symptoms persist after TrP treatment."}, {"condition": "Thoracic outlet syndrome \u2014 vascular", "confidence": "rare", "mimics": "Anterior shoulder and arm pain with upper thoracic aching; overlaps with subclavius and scaleni TrP patterns", "distinguishing_feature": "Radial pulse reduction or loss with arm abduction; hand oedema and finger stiffness. Wright manoeuvre positive. Scaleni and subclavius TrPs contribute to vascular compression via taut band tension.", "action": "Check radial pulse in standard and abducted positions. Scaleni and subclavius TrP inactivation is first-line. Refer for vascular assessment if pulse loss persists after TrP treatment."}, {"condition": "Rotator cuff tendinopathy / subacromial impingement", "confidence": "uncommon", "mimics": "Painful arc on shoulder abduction and lateral arm aching overlapping with supraspinatus TrP referral to the upper thoracic region", "distinguishing_feature": "Tenderness at greater tuberosity insertion; positive Neer's or Hawkins-Kennedy sign; imaging confirms tendon changes. TrP taut bands impose sustained enthesopathic tension \u2014 coexistence is common and causally related.", "action": "Treat supraspinatus TrPs first and reassess tendon findings after inactivation. Both conditions require treatment when identified together."}, {"condition": "Thoracic zygapophyseal (facet) joint pain", "confidence": "uncommon", "mimics": "Deep upper thoracic paraspinal pain in the same zone as multifidi TrP referral", "distinguishing_feature": "Pain reproduced by passive PA intersegmental pressures over the facet joints; hard end-feel on accessory movement testing. Multifidi TrPs and facet dysfunction coexist at the same segment and perpetuate each other \u2014 soft end-feel suggests TrP predominance.", "action": "Segmental accessory movement testing. Treat multifidi TrPs first \u2014 articular dysfunction often resolves with TrP inactivation. Mobilise the segment if hard end-feel persists."}, {"condition": "Herpes zoster \u2014 pre-eruptive and post-herpetic", "confidence": "uncommon", "mimics": "Unilateral burning upper thoracic pain before the rash appears \u2014 indistinguishable from rhomboid, multifidi, or intercostal TrP patterns at onset", "distinguishing_feature": "Dermatomal distribution; allodynia (light touch painful in a band); vesicles appear 1\u20134 days after pain onset. Age > 50 or immunocompromised increases suspicion. Post-herpetic: TrP pain coexists with neurogenic shooting pain.", "action": "Examine the skin carefully at every visit for unilateral burning thoracic pain. If vesicles present, refer urgently \u2014 antiviral window is 72 hours from rash onset."}, {"condition": "First rib dysfunction", "confidence": "rare", "mimics": "Upper thoracic and arm symptoms closely associated with scaleni TrP presentation \u2014 scaleni attach to the first rib and their taut bands directly elevate it", "distinguishing_feature": "First rib elevated and tender on posterior superior palpation; restricted first rib caudal glide on accessory movement testing. Scaleni TrPs are almost universally present concurrently.", "action": "First rib mobilisation in conjunction with scaleni TrP inactivation \u2014 the two conditions are mechanically linked and must be treated together."}, {"condition": "Winged scapula / serratus anterior weakness", "confidence": "rare", "mimics": "Medial scapular border pain and upper thoracic aching overlapping with rhomboid TrP presentation", "distinguishing_feature": "Scapular winging visible on push-up against wall or forward arm elevation; serratus anterior weakness on manual muscle testing. Rhomboid TrPs develop secondarily to serratus anterior inhibition \u2014 the rhomboids are overloaded trying to retract a scapula that serratus cannot stabilise.", "action": "Serratus anterior rehabilitation is the primary treatment. Treat rhomboid TrPs concurrently but address serratus anterior as the underlying driver \u2014 rhomboid TrPs will recur without it."}, {"condition": "Glenohumeral osteoarthritis", "confidence": "uncommon", "mimics": "Diffuse shoulder girdle and upper thoracic pain, particularly in older patients with supraspinatus and biceps TrP patterns", "distinguishing_feature": "Capsular pattern restriction (external rotation > abduction > internal rotation); crepitus on movement; radiological changes. Arthritis does not produce spot-tender taut bands. TrPs coexist and are independently treatable.", "action": "Shoulder radiograph. Inactivate TrPs concurrently with joint management \u2014 TrP treatment can substantially reduce pain even in the presence of established arthritis."}, {"condition": "Fibromyalgia", "confidence": "uncommon", "mimics": "Widespread upper back and shoulder girdle tenderness overlapping with all muscles in this algorithm simultaneously", "distinguishing_feature": "Widespread pain \u2265 3 months across multiple body regions; diffuse tenderness without specific TrP referral patterns; fatigue and non-restorative sleep. TrPs produce specific referred pain patterns and are a treatable component of fibromyalgia.", "action": "Systematic TrP examination alongside fibromyalgia management. Treating active TrPs reduces the overall pain burden independently \u2014 do not withhold TrP treatment because fibromyalgia is also present."}, {"condition": "Residual pain after spinal manipulation or injection", "confidence": "atypical", "mimics": "Persistent upper thoracic pain after a spinal procedure \u2014 may be re-attributed to the joint when myofascial TrPs are the active pain source", "distinguishing_feature": "After a spinal intervention, pain persisting at a lower level or shifting in character indicates TrPs masked by dominant segmental pain are now the primary source. The TrPs were pre-existing \u2014 not created by the procedure.", "action": "Re-examine muscles systematically after any spinal intervention. Most commonly harbouring residual TrPs: trapezius (upper and mid), levator scapulae, rhomboids, multifidi."}];

// ── RED FLAGS ──────────────────────────────────────────────────────
function buildRedFlags(){
  // PATCH: read from schema if present, otherwise fall back to hardcoded constants
  var emergency = (CURRENT_SCHEMA.emergency && CURRENT_SCHEMA.emergency.length)
    ? CURRENT_SCHEMA.emergency : RF_EMERGENCY;
  var urgent = (CURRENT_SCHEMA.urgent && CURRENT_SCHEMA.urgent.length)
    ? CURRENT_SCHEMA.urgent : RF_URGENT;
  function makeFlags(arr,id,isUrgent){
    document.getElementById(id).innerHTML=arr.map(rf=>
      '<div class="rf-item">'+
      '<label class="rf-check-wrap" for="'+rf.id+'">'+
      '<input type="checkbox" class="rf-cb" id="'+rf.id+'">'+
      '</label>'+
      '<div class="rf-body">'+
      '<div class="rf-label">'+rf.label+'</div>'+
      '<div class="rf-question">'+rf.question+'</div>'+
      '</div></div>'
    ).join('');
  }
  makeFlags(emergency,'rf-emergency-items',false);
  makeFlags(urgent,'rf-urgent-items',true);
  document.getElementById('btn-affirm').addEventListener('click',()=>{
    document.getElementById('btn-affirm').style.display='none';
    document.getElementById('affirmed-badge').classList.add('show');
    const mg=document.getElementById('main-grid');
    mg.classList.add('visible');
    posteriors=getUpdatedPriors();advance();renderLearnPanel();
    // Collapse red flag panel to summary bar
    const rfWrap=document.getElementById('rf-outer-wrap');
    if(rfWrap) rfWrap.classList.add('rf-collapsed');
    setTimeout(()=>mg.scrollIntoView({behavior:'smooth',block:'start'}),80);
  });
}

// ── BROAD DIFFERENTIAL ─────────────────────────────────────────────
function buildBroadDiff(){
  const broadDiff = (CURRENT_SCHEMA.broad_differential && CURRENT_SCHEMA.broad_differential.length)
    ? CURRENT_SCHEMA.broad_differential : BROAD_DIFF;
  document.getElementById('broad-grid').innerHTML=broadDiff.map(d=>
    '<div class="dt-diff-item">'+
    '<div class="dt-diff-confidence '+d.confidence+'">'+d.confidence+'</div>'+
    '<div class="dt-diff-name">'+d.condition+'</div>'+
    '<div class="dt-diff-mimics">'+d.mimics+'</div>'+
    '<div class="dt-diff-detail">'+
    '<div class="dt-diff-distinguisher"><strong>Distinguishing features</strong>'+d.distinguishing_feature+'</div>'+
    '<div class="dt-diff-action"><strong>Action</strong>'+d.action+'</div>'+
    '</div></div>'
  ).join('');
  // click to expand
  document.getElementById('broad-grid').addEventListener('click',e=>{
    const item=e.target.closest('.dt-diff-item');
    if(item) item.classList.toggle('open');
  });
  // toggle visibility
  document.getElementById('broad-toggle-btn').addEventListener('click',()=>{
    const grid=document.getElementById('broad-grid');
    const hidden=grid.classList.toggle('hidden');
    document.getElementById('broad-toggle-btn').textContent=hidden?'Show':'Hide';
  });
}

// ── LEARNING ───────────────────────────────────────────────────────
function loadCounts(){try{const r=localStorage.getItem(LS_KEY);if(r)return JSON.parse(r);}catch(e){}const c={};MUSCLE_IDS.forEach(m=>c[m]=0);return c;}
function saveCounts(c){try{localStorage.setItem(LS_KEY,JSON.stringify(c));}catch(e){}}
function incrementCount(mid){const c=loadCounts();c[mid]=(c[mid]||0)+1;saveCounts(c);return c;}
function getUpdatedPriors(){const counts=loadCounts(),p={};MUSCLE_IDS.forEach(m=>p[m]=CURRENT_SCHEMA.muscles[m].prior+(counts[m]||0)*0.02);return normalise(p);}

// ── STATE & MATH ───────────────────────────────────────────────────
let answers={},posteriors={},trail=[],pairwiseDone=new Set(),queueIdx=0,earlyDone=false;
function normalise(p){let t=0;MUSCLE_IDS.forEach(m=>t+=p[m]);const o={};MUSCLE_IDS.forEach(m=>o[m]=p[m]/t);return o;}
function applyLR(p,lr){const o={};MUSCLE_IDS.forEach(m=>o[m]=p[m]*(lr[m]||1.0));return normalise(o);}
function ranked(){return MUSCLE_IDS.map(m=>({id:m,p:posteriors[m],label:CURRENT_SCHEMA.muscles[m].label,subtitle:CURRENT_SCHEMA.muscles[m].subtitle||'',page:CURRENT_SCHEMA.muscles[m].page,note:CURRENT_SCHEMA.muscles[m].key_trp_note||null})).sort((a,b)=>b.p-a.p);}
function shouldEarlyExit(r){return r[0].p>=T.early_exit_posterior&&(r[0].p-r[1].p)>=T.early_exit_gap;}
function getPairwise(r){if(Object.keys(answers).length===0)return null;if((r[0].p-r[1].p)>=T.pairwise_trigger)return null;const s=new Set([r[0].id,r[1].id]);for(const pw of CURRENT_SCHEMA.pairwise)if(!pairwiseDone.has(pw.id)&&pw.pair.every(x=>s.has(x)))return pw;return null;}
function condMet(q){if(!q.condition)return true;return Object.entries(q.condition).every(([k,v])=>answers[k]===v);}
function nextQ(){for(let i=queueIdx;i<CURRENT_SCHEMA.questions.length;i++){const q=CURRENT_SCHEMA.questions[i];if(answers[q.id]!==undefined)continue;if(!condMet(q))continue;queueIdx=i;return q;}return null;}
function buildTreatmentOrder(r){const active=r.filter(m=>m.p>=0.05).map(m=>m.id);if(!active.length)return[];const steps=[],placed=new Set(),eL=DAG.edge_type_labels;active.forEach(mid=>{const out=DAG.edges.filter(e=>e.from===mid&&e.type==='key_satellite'&&active.includes(e.to));if(out.length&&!placed.has(mid)){const m=r.find(x=>x.id===mid);steps.push({label:m.label,page:m.page,edgeType:'key_satellite',edgeLabel:eL['key_satellite'],note:out.map(e=>e.label).join('; ')});placed.add(mid);}});active.filter(m=>!placed.has(m)).forEach(mid=>{const m=r.find(x=>x.id===mid);const inE=DAG.edges.find(e=>e.to===mid&&placed.has(e.from));const wE=DAG.edges.find(e=>e.type==='antagonist_risk'&&((e.from===mid&&active.includes(e.to))||(e.to===mid&&active.includes(e.from))));const et=wE?'antagonist_risk':(inE?inE.type:'functional_unit');steps.push({label:m.label,page:m.page,edgeType:et,edgeLabel:eL[et]||'Treat in session',note:wE?wE.label:(inE?inE.label:'')});placed.add(mid);});return steps;}

// ── RENDER ─────────────────────────────────────────────────────────
function renderDiff(){const r=ranked();const html=r.map((m,i)=>{const rank=i+1,w=(m.p*100).toFixed(1),bw=Math.max(0.5,m.p*100).toFixed(1),dim=rank>6?' dimmed':'',rc=rank<=3?' r'+rank:'';return'<div class="dt-diff-bar-row'+rc+dim+'"><div class="dt-diff-bar-rank">'+rank+'</div><div class="dt-diff-bar-name">'+m.label+'</div><div class="dt-diff-bar-track"><div class="dt-diff-bar-fill" style="width:'+bw+'%"></div></div><div class="dt-diff-bar-weight">'+w+'</div></div>';}).join('');const dr=document.getElementById('diff-rows');if(dr)dr.innerHTML=html;const drr=document.getElementById('diff-rows-result');if(drr)drr.innerHTML=html;}
function renderTrail(){const el=document.getElementById('trail-panel');if(!trail.length){el.classList.remove('visible');return;}el.classList.add('visible');document.getElementById('trail-counter').textContent=trail.length+' feature'+(trail.length>1?'s':'')+' recorded';document.getElementById('trail-items').innerHTML=trail.map(t=>'<div class="dt-trail-item"><div class="dt-trail-q">'+t.q+'</div><div class="dt-trail-a">&#8627; '+t.a+'</div></div>').join('');}
function renderCounter(){const tot=CURRENT_SCHEMA.questions.length,ans=Object.keys(answers).length;const txt=ans===0?'Prior weights':ans+'\u202f/\u202f'+tot+' features';const qc=document.getElementById('q-counter');if(qc)qc.textContent=txt;}
function renderLearnPanel(){const counts=loadCounts(),total=Object.values(counts).reduce((a,b)=>a+b,0);const el=document.getElementById('learn-panel');if(!total){el.classList.remove('visible');return;}el.classList.add('visible');document.getElementById('learn-total').textContent=total+' confirmation'+(total>1?'s':'');document.getElementById('learn-rows').innerHTML=MUSCLE_IDS.filter(m=>counts[m]>0).sort((a,b)=>counts[b]-counts[a]).map(m=>'<div class="learn-row"><div class="learn-muscle">'+CURRENT_SCHEMA.muscles[m].label+'</div><div class="learn-count">'+counts[m]+'&times;</div></div>').join('');}
function renderQuestion(q,isPW){const qText=q.text||q.question;const label=isPW?'<div class="dt-card-label pairwise">Tiebreaker</div>':'<div class="dt-card-label">Clinical Feature '+(trail.length+1)+'</div>';const sub=q.sublabel?'<div class="dt-rationale">'+q.sublabel+'</div>':'';const btns='<div class="dt-answers"><button class="dt-answer dt-answer-yes" data-qid="'+(isPW?'__pw__'+q.id:q.id)+'" data-aid="yes" data-qlabel="'+encodeURIComponent(qText)+'" data-alabel="'+encodeURIComponent('Yes')+'">Yes</button><button class="dt-answer dt-answer-no" data-qid="'+(isPW?'__pw__'+q.id:q.id)+'" data-aid="no" data-qlabel="'+encodeURIComponent(qText)+'" data-alabel="'+encodeURIComponent('No')+'">No</button></div>';document.getElementById('question-area').innerHTML='<div class="dt-card"><div class="dt-card-head">'+label+'</div><div class="dt-question">'+qText+'</div>'+sub+btns+'</div>';}

// Fix: answer buttons need correct aid from schema
function renderQuestionFull(q,isPW){
  const qText=q.text||q.question;
  const label=isPW?'<div class="dt-card-label pairwise">Tiebreaker</div>':'<div class="dt-card-label">Clinical Feature '+(trail.length+1)+'</div>';
  const sub=q.sublabel?'<div class="dt-rationale" style="font-size:.78rem;color:#57534e;font-style:italic;margin-bottom:.55rem;line-height:1.5">'+q.sublabel+'</div>':'';
  const btns=q.answers.map(a=>{
    const asub=a.sublabel?'<div style="font-size:.72rem;color:#57534e;font-weight:400;margin-top:2px">'+a.sublabel+'</div>':'';
    const cls=q.answers.length===2
      ? (q.answers.indexOf(a)===0?'dt-answer dt-answer-yes':'dt-answer dt-answer-no')
      : 'dt-answer dt-answer-yes';
    return'<button class="'+cls+'" style="'+(q.answers.length>2?'flex:none;flex-direction:column;align-items:flex-start;':'')+'" data-qid="'+(isPW?'__pw__'+q.id:q.id)+'" data-aid="'+a.id+'" data-qlabel="'+encodeURIComponent(qText)+'" data-alabel="'+encodeURIComponent(a.label)+'">'+a.label+asub+'</button>';
  }).join('');
  const ansWrap=q.answers.length>2
    ?'<div style="display:flex;flex-direction:column;gap:.5rem;margin-top:1rem">'+btns+'</div>'
    :'<div class="dt-answers">'+btns+'</div>';
  document.getElementById('question-area').innerHTML='<div class="dt-card"><div class="dt-card-head">'+label+'</div><div class="dt-question">'+qText+'</div>'+sub+ansWrap+'</div>';
}

function renderEarlyExit(r){earlyDone=true;const top=r[0];document.getElementById('question-area').innerHTML='<div class="dt-card"><div class="dt-early-badge">Confident result available</div><div class="dt-early-muscle">'+top.label+'</div><div class="dt-early-sub">'+top.subtitle+'<br>Relative weight '+(top.p*100).toFixed(0)+' &mdash; accept to view result, or continue refining.</div><div class="dt-early-btns"><button class="dt-btn-primary" id="btn-accept">Accept result</button><button class="dt-btn-secondary" id="btn-continue">Continue refining</button></div></div>';document.getElementById('btn-accept').addEventListener('click',showResult);document.getElementById('btn-continue').addEventListener('click',()=>{earlyDone=true;advance();});}

function buildAddConfirm(r){const rem=r.slice(3);if(!rem.length)return'';const opts=rem.map(m=>'<option value="'+m.id+'">'+m.label+' (rank '+(r.indexOf(m)+1)+', weight '+(m.p*100).toFixed(1)+')</option>').join('');return'<div class="dt-add-confirm"><div class="dt-add-confirm-label">Also confirm a muscle not in the top three</div><div class="dt-add-confirm-row"><select class="dt-add-select" id="add-select"><option value="">— select muscle —</option>'+opts+'</select><button class="dt-btn-add-confirm" id="btn-add-confirm-ok">Confirm</button></div><div class="dt-add-confirm-done" id="add-confirm-done">&#10003; Confirmed and model updated</div></div>';}

function showResult(){
  var mg=document.getElementById('main-grid');
  if(mg) mg.classList.add('result-phase');
  const r=ranked();
  const ranks=['Most likely','2nd','3rd'],rk=['rk1','rk2','rk3'],card_cls=['dt-card-result','dt-card','dt-card'];
  const cards=r.slice(0,3).map((m,i)=>{
    const w=(m.p*100).toFixed(1);
    const note=m.note?'<div class="dt-key-note"><div class="dt-key-note-label">Key TrP relationship</div>'+m.note+'</div>':'';
    return'<div class="dt-card '+card_cls[i]+'" style="margin-bottom:10px">'+
      '<div class="dt-result-rank '+rk[i]+'">'+ranks[i]+'</div>'+
      '<div class="dt-result-name">'+m.label+'</div>'+
      '<div class="dt-result-sub">'+m.subtitle+'</div>'+
      '<div class="dt-result-weight">Relative weight: '+w+'</div>'+
      '<div class="dt-result-actions">'+
      '<a class="dt-wiki-link" href="https://painwiki.com/wiki/index.php?title='+m.page+'" target="_blank" rel="noopener">'+m.label+' on PainWiki</a>'+
      '<button class="dt-confirm-btn" data-muscle="'+m.id+'" data-label="'+encodeURIComponent(m.label)+'">Confirm this muscle</button>'+
      '</div>'+note+'</div>';
  }).join('');
  const addSec=buildAddConfirm(r);
  document.getElementById('question-area').innerHTML=
    '<div style="font-family:\'DM Mono\',monospace;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:#a8a29e;margin-bottom:8px">Differential &mdash; final weights</div>'+
    cards+
    (addSec?'<div class="dt-card" style="margin-top:4px"><div style="font-family:\'DM Mono\',monospace;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:#a8a29e;margin-bottom:10px">Additional Confirmation</div>'+addSec+'</div>':'');

  const addBtn=document.getElementById('btn-add-confirm-ok');
  if(addBtn){addBtn.addEventListener('click',()=>{const sel=document.getElementById('add-select'),mid=sel.value;if(!mid)return;incrementCount(mid);addBtn.disabled=true;sel.disabled=true;document.getElementById('add-confirm-done').style.display='block';renderLearnPanel();});}

  const steps=buildTreatmentOrder(r);
  if(steps.length){
    const tp=document.getElementById('treat-panel');tp.classList.add('visible');
    document.getElementById('treat-items').innerHTML=steps.map((s,i)=>{const isW=s.edgeType==='antagonist_risk';return'<div class="dt-treat-item"><div class="dt-treat-step">'+(i+1)+'</div><div><div class="dt-treat-muscle">'+s.label+'</div><div class="dt-treat-edge'+(isW?' warn':'')+'">'+s.edgeLabel+'</div>'+(s.note&&!isW?'<div class="dt-treat-edge" style="margin-top:2px;font-size:10px;color:#a8a29e">'+s.note+'</div>':'')+'</div></div>';}).join('');
  }
  renderLearnPanel();
}

function advance(){renderDiff();renderTrail();renderCounter();const r=ranked(),pw=getPairwise(r);if(pw){pairwiseDone.add(pw.id);renderQuestionFull(pw,true);return;}if(!earlyDone&&shouldEarlyExit(r)){renderEarlyExit(r);return;}const q=nextQ();if(q){queueIdx++;renderQuestionFull(q,false);return;}showResult();}

/* Click handler, reset, toggle, buildRedFlags and buildBroadDiff
   are all wired inside renderInterfaceHTML() and bootScoringInterface()
   after the DOM elements exist. Do not call them here. */

/* ══════════════════════════════════════════════════════
     BOOT — called after schema is loaded from wiki data page
     Injects interface HTML then wires all event listeners
     ══════════════════════════════════════════════════════ */

  function bootScoringInterface( hostEl, SCHEMA ) {
    // 1. Set schema-derived globals FIRST — functions depend on these
    CURRENT_SCHEMA = SCHEMA;
    T          = CURRENT_SCHEMA.thresholds;
    MUSCLE_IDS = Object.keys( CURRENT_SCHEMA.muscles );
    DAG        = CURRENT_SCHEMA.treatment_dag;

    // 2. Rebuild posteriors from schema priors + any stored confirmations
    posteriors = getUpdatedPriors();

    // 3. Run the interface build functions — DOM elements now exist
    buildRedFlags();
    buildBroadDiff();
    advance();
    renderLearnPanel();
  }

  /* ══════════════════════════════════════════════════════
     SCHEMA LOADER — fetches JSON from wiki data page
     ══════════════════════════════════════════════════════ */

  function bootHost( hostEl ) {
    var treePage = hostEl.getAttribute( 'data-tree-page' );
    if ( !treePage ) return;

    hostEl.innerHTML =
      '<div style="padding:1.5em;font-family:DM Mono,monospace;' +
      'font-size:0.8em;color:#a8a29e;text-align:center">' +
      'Loading scoring model…</div>';

    var api = new mw.Api();
    api.get( {
      action:   'query',
      titles:   treePage,
      prop:     'revisions',
      rvprop:   'content',
      rvslots:  'main',
      format:   'json'
    } ).done( function ( data ) {
      var pages  = data.query.pages;
      var pageId = Object.keys( pages )[0];
      if ( pageId === '-1' ) {
        hostEl.innerHTML =
          '<div style="color:#b91c1c;padding:1em;font-family:monospace">' +
          'Scoring model not found: ' + treePage + '</div>';
        return;
      }
      var raw = pages[ pageId ].revisions[0].slots.main['*'];
      var schema;
      try {
        schema = JSON.parse( raw );
      } catch ( e ) {
        hostEl.innerHTML =
          '<div style="color:#b91c1c;padding:1em;font-family:monospace">' +
          'Invalid JSON in ' + treePage + ': ' + e.message + '</div>';
        return;
      }

      // PATCH: pass schema to renderInterfaceHTML for region label
      renderInterfaceHTML( hostEl, schema );
      bootScoringInterface( hostEl, schema );

    } ).fail( function () {
      hostEl.innerHTML =
        '<div style="color:#b91c1c;padding:1em;font-family:monospace">' +
        'Failed to load: ' + treePage + '</div>';
    } );
  }

  /* ══════════════════════════════════════════════════════
     INTERFACE HTML RENDERER
     Builds the shell, red flag panels, grid, and broad diff
     into the host element — without any JS execution
     PATCH: accepts schema param for region_label
     ══════════════════════════════════════════════════════ */

  function renderInterfaceHTML( hostEl, schema ) {
    // PATCH: use schema.region_label if present, fall back to original string
    var regionLabel = ( schema && schema.region_label )
      ? schema.region_label
      : 'Upper Thoracic Back Pain';

    hostEl.innerHTML = [
      '<div class="proto-shell">',

      // Masthead
      '<header class="proto-masthead">',
      '  <div class="proto-logo">Pain<span>Wiki</span></div>',
      '  <div class="proto-right">',
      '    <span class="proto-region">Diagnostic Algorithm &middot; ' + regionLabel + '</span>',
      '    <button class="learning-toggle" id="learning-toggle-btn">Learning: ON</button>',
      '  </div>',
      '</header>',

      // Red flags — collapsible after affirm
      '<div class="rf-outer" id="rf-outer-wrap">',
      '  <div class="rf-collapsed-bar" id="rf-collapsed-bar">',
      '    <span class="rf-collapsed-label">Red flags cleared</span>',
      '    <button class="rf-expand-btn" id="rf-expand-toggle">Expand &#9663;</button>',
      '  </div>',
      '  <div class="rf-expandable" id="rf-expandable">',
      '    <div class="rf-panel-wrap" id="rf-emergency-panel">',
      '      <div class="rf-col-header">&#9888; Emergency &mdash; stop and act if any are present</div>',
      '      <div class="rf-items" id="rf-emergency-items"></div>',
      '    </div>',
      '    <div class="rf-panel-wrap urgent" id="rf-urgent-panel">',
      '      <div class="rf-col-header">&#9888; Urgent &mdash; refer before myofascial assessment</div>',
      '      <div class="rf-items" id="rf-urgent-items"></div>',
      '      <div class="rf-affirm">',
      '        <div class="rf-affirm-note">All emergency and urgent flags screened and negative &mdash; or appropriate action taken.</div>',
      '        <button class="btn-affirm" id="btn-affirm">Proceed to clinical interview &rarr;</button>',
      '        <div class="affirmed-badge" id="affirmed-badge">Red flags cleared</div>',
      '      </div>',
      '    </div>',
      '  </div>',
      '</div>',

      // Main content — hidden until affirmed
      '<div id="main-grid">',

      // Question card — always single column
      '<div id="question-area"></div>',

      // Running diff — single column during interview
      '<div class="dt-running-panel" id="interview-diff-panel">',
      '  <div class="dt-running-head">',
      '    <span class="dt-running-title">Running Differential</span>',
      '    <span class="dt-running-meta" id="q-counter">Prior weights</span>',
      '  </div>',
      '  <div id="diff-rows"></div>',
      '  <div class="dt-diff-caption">Diagnostic weights are relative, not absolute probabilities.</div>',
      '</div>',

      // Result side grid — 2 columns: running diff | treatment order
      // Hidden during interview, shown in result phase
      '<div id="result-side-grid">',
      '  <div class="dt-running-panel">',
      '    <div class="dt-running-head">',
      '      <span class="dt-running-title">Running Differential</span>',
      '      <span class="dt-running-meta" id="q-counter-result">Final weights</span>',
      '    </div>',
      '    <div id="diff-rows-result"></div>',
      '    <div class="dt-diff-caption">Diagnostic weights are relative, not absolute probabilities.</div>',
      '  </div>',
      '  <div class="dt-treat-panel" id="treat-panel">',
      '    <div class="dt-treat-head"><span class="dt-treat-title">Suggested Treatment Order</span></div>',
      '    <div id="treat-items"></div>',
      '  </div>',
      '</div>',

      // Trail — single column
      '<div class="dt-trail-panel" id="trail-panel">',
      '  <div class="dt-trail-head">',
      '    <span class="dt-trail-title">Clinical Interview Record</span>',
      '    <span class="dt-trail-meta" id="trail-counter"></span>',
      '  </div>',
      '  <div id="trail-items"></div>',
      '</div>',

      // Learn panel — single column
      '<div class="learn-panel" id="learn-panel">',
      '  <div class="learn-head">',
      '    <span class="learn-title">Confirmed Cases &mdash; This Device</span>',
      '    <span class="learn-meta" id="learn-total"></span>',
      '  </div>',
      '  <div class="learn-intro"><strong>Multiple muscles can be confirmed per case.</strong></div>',
      '  <div id="learn-rows"></div>',
      '</div>',

      // Broad differential — single column, 2-col grid inside
      '<div class="dt-broad-panel" id="broad-panel">',
      '  <div class="dt-broad-header">',
      '    <div class="dt-broad-header-top">',
      '      <div class="dt-broad-title">&#9632; Broad Differential Diagnosis</div>',
      '      <button class="dt-broad-toggle" id="broad-toggle-btn">Hide</button>',
      '    </div>',
      '    <div class="dt-epigraph">',
      '      &#8220;If he does not expect the unexpected, he will not discover it &mdash;',
      '      for it is difficult to discover and intractable.&#8221;',
      '      <cite>&mdash; Heraclitus, Fr. 18</cite>',
      '    </div>',
      '  </div>',
      '  <div class="dt-broad-grid" id="broad-grid"></div>',
      '</div>',

      '</div>',  // end main-grid

      // Footer
      '<div class="proto-foot">',
      '  <div class="proto-disclaimer"><strong>Not validated for clinical use.</strong> Research prototype.</div>',
      '  <button class="btn-reset" id="reset-btn">&#8635; Start over</button>',
      '</div>',

      '</div>'   // end proto-shell
    ].join( '\n' );
    // Wire all event listeners — DOM elements exist now

    // Answer and confirm button clicks (delegated)
    document.addEventListener( 'click', function ( e ) {
      var ab = e.target.closest( '.dt-answer,.answer-btn' );
      if ( ab && ab.dataset.qid ) {
        var qid    = ab.dataset.qid;
        var aid    = ab.dataset.aid;
        var qLabel = decodeURIComponent( ab.dataset.qlabel );
        var aLabel = decodeURIComponent( ab.dataset.alabel );
        if ( qid.indexOf( '__pw__' ) === 0 ) {
          var pwId = qid.replace( '__pw__', '' );
          var pw   = CURRENT_SCHEMA.pairwise.find( function(x){ return x.id === pwId; } );
          var pa   = pw.answers.find( function(x){ return x.id === aid; } );
          posteriors = applyLR( posteriors, pa.lr );
          trail.push( { q: qLabel, a: aLabel } );
          earlyDone = false;
        } else {
          var q = CURRENT_SCHEMA.questions.find( function(x){ return x.id === qid; } );
          var a = q.answers.find( function(x){ return x.id === aid; } );
          answers[ qid ] = aid;
          posteriors = applyLR( posteriors, a.lr );
          trail.push( { q: qLabel, a: aLabel } );
          queueIdx++;
        }
        advance();
        return;
      }
      var cb = e.target.closest( '.dt-confirm-btn' );
      if ( cb && !cb.classList.contains( 'confirmed' ) ) {
        var mid    = cb.dataset.muscle;
        var mlabel = decodeURIComponent( cb.dataset.label );
        incrementCount( mid );
        cb.classList.add( 'confirmed' );
        cb.textContent = '\u2713\u2713 ' + mlabel + ' confirmed';
        renderLearnPanel();
        return;
      }
    } );

    // Reset button
    var resetBtn = document.getElementById( 'reset-btn' );
    if ( resetBtn ) {
      resetBtn.addEventListener( 'click', function () {
        answers = {}; trail = [];
        pairwiseDone = new Set();
        queueIdx = 0; earlyDone = false;
        posteriors = getUpdatedPriors();
        var tp  = document.getElementById( 'trail-panel' );
        var tp2 = document.getElementById( 'treat-panel' );
        if ( tp  ) tp.classList.remove( 'visible' );
        if ( tp2 ) tp2.classList.remove( 'visible' );
        var mg  = document.getElementById( 'main-grid' );
        if ( mg ) mg.classList.remove( 'result-phase' );
        // Re-collapse red flags (stay collapsed on reset)
        var rfWrap = document.getElementById( 'rf-outer-wrap' );
        if ( rfWrap ) rfWrap.classList.add( 'rf-collapsed' );
        advance();
      } );
    }

    // Learning toggle
    var learnBtn = document.getElementById( 'learning-toggle-btn' );
    if ( learnBtn ) {
      learnBtn.addEventListener( 'click', function () {
        var h = document.body.classList.toggle( 'hide-learning' );
        learnBtn.textContent = 'Learning: ' + ( h ? 'OFF' : 'ON' );
      } );
    }

    // Red flag expand toggle
    var rfExpandBtn = document.getElementById( 'rf-expand-toggle' );
    if ( rfExpandBtn ) {
      rfExpandBtn.addEventListener( 'click', function () {
        var wrap = document.getElementById( 'rf-outer-wrap' );
        if ( wrap ) {
          var collapsed = wrap.classList.toggle( 'rf-collapsed' );
          rfExpandBtn.textContent = collapsed ? 'Expand \u25be' : 'Collapse \u25b2';
        }
      } );
    }

  }

  /* ══════════════════════════════════════════════════════
     MEDIAWIKI ENTRY POINT
     ══════════════════════════════════════════════════════ */

  function init() {
    document.querySelectorAll( '.scoring-tree-host' ).forEach( function ( el ) {
      // Only boot if not already initialised
      if ( !el.dataset.scoringBooted ) {
        el.dataset.scoringBooted = '1';
        bootHost( el );
      }
    } );
  }

  if ( typeof mw !== 'undefined' ) {
    // Register with the hook for future page loads (e.g. after Ajax navigation)
    mw.hook( 'wikipage.content' ).add( init );

    // Also run immediately in case wikipage.content already fired.
    // Using $.ready ensures the DOM is available.
    mw.loader.using( 'mediawiki.api' ).done( function () {
      if ( document.readyState === 'loading' ) {
        document.addEventListener( 'DOMContentLoaded', init );
      } else {
        init();
      }
    } );
  }

}() );