83a78fa8cd
Third PE system added. Adolescent respiratory fully fleshed out with
the same teaching-focused depth as neuro: overview, grading scales,
per-component significance + pearls, detailed step methods with HOW
and NORMAL labels, and a watch-for red-flag block.
New respiratorySounds.js uses the Web Audio API to synthesize 8 classic
breath sounds on demand — no network, no audio files, no licensing:
- Normal vesicular
- Wheeze (two-partial + vibrato, filtered sawtooth)
- Stridor (inspiratory, bandpass-filtered sawtooth sweep)
- Fine crackles (dense brief high-freq noise bursts, late inspiration)
- Coarse crackles (sparser, longer, lower-freq bursts)
- Rhonchi (low-pitched warbled sawtooth, expiratory)
- Pleural friction rub (bandpass noise, biphasic)
- Expiratory grunting (square-wave short grunts)
Sounds are synthesised approximations intended to teach the pattern
(what makes a wheeze a wheeze vs a stridor). Labelled as such in the UI.
Controls: one play at a time, auto-stop ~3s.
Respiratory-specific grading scales:
- RR by age (WHO tachypnea cutoffs)
- Pulse ox (SpO2) with hypoxemia thresholds
- Silverman–Andersen (neonatal retractions, 0–10)
- Westley croup severity score
Components in adolescent respiratory:
1. Inspection (observation-first — RR, pattern, WOB, audible sounds,
chest shape, colour, clubbing with Schamroth sign)
2. Palpation (trachea, expansion symmetry, tactile fremitus,
tenderness, subcutaneous emphysema)
3. Percussion (technique + systematic zones + cardiac/hepatic
dullness + diaphragmatic excursion)
4. Auscultation — normal breath sounds (vesicular, bronchovesicular,
bronchial) with systematic side-to-side comparison
5. Auscultation — adventitious sounds with per-sound listen buttons
linking directly to the sounds library
6. Special maneuvers — bronchophony, egophony, whispered pectoriloquy
Older age groups (newborn through school-age) will get their own resp
blocks incrementally — v1 focused on adolescent for the quality bar.
UI: new sub-tab pill "Respiratory" with lung icon, sky-blue accent.
renderSystem refactored to use accent/icon maps instead of per-system
if/else — scales to future systems (cardiovascular coming next).
78 lines
3.8 KiB
HTML
78 lines
3.8 KiB
HTML
<div class="module-header">
|
||
<h2><i class="fas fa-stethoscope"></i> Physical Exam Guide</h2>
|
||
<p>OSCE-style reference for age-appropriate MSK and Neuro exam + narrative report generator</p>
|
||
</div>
|
||
|
||
<div class="demographics-bar">
|
||
<div class="demo-field">
|
||
<label>Age Group</label>
|
||
<select id="pe-age-group">
|
||
<option value="">-- Select --</option>
|
||
<option value="newborn">Newborn (0–28 days)</option>
|
||
<option value="infant">Infant (1–12 months)</option>
|
||
<option value="toddler">Toddler (1–3 years)</option>
|
||
<option value="preschool">Preschool (3–5 years)</option>
|
||
<option value="school">School-age (6–11 years)</option>
|
||
<option value="adolescent">Adolescent (12–21 years)</option>
|
||
</select>
|
||
</div>
|
||
<div class="demo-field">
|
||
<label>Patient Age</label>
|
||
<input type="text" id="pe-age" placeholder="e.g., 4 months">
|
||
</div>
|
||
<div class="demo-field">
|
||
<label>Gender</label>
|
||
<select id="pe-gender">
|
||
<option value="">Select</option>
|
||
<option>Male</option>
|
||
<option>Female</option>
|
||
</select>
|
||
</div>
|
||
<div class="demo-field">
|
||
<label>Report Style</label>
|
||
<select id="pe-format">
|
||
<option value="narrative">Narrative (paragraphs)</option>
|
||
<option value="list">Structured List</option>
|
||
</select>
|
||
</div>
|
||
<div class="demo-field demo-field-model">
|
||
<label><i class="fas fa-robot"></i> Model</label>
|
||
<select class="tab-model-select"></select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="wv-subtab-bar">
|
||
<button class="wv-subtab-btn active" data-pesystem="msk">
|
||
<i class="fas fa-bone"></i> Musculoskeletal
|
||
</button>
|
||
<button class="wv-subtab-btn" data-pesystem="neuro">
|
||
<i class="fas fa-brain"></i> Neurologic
|
||
</button>
|
||
<button class="wv-subtab-btn" data-pesystem="resp">
|
||
<i class="fas fa-lungs"></i> Respiratory
|
||
</button>
|
||
</div>
|
||
|
||
<div id="pe-content">
|
||
<p style="text-align:center;color:#9ca3af;padding:40px;">Select an age group above to see the exam guide.</p>
|
||
</div>
|
||
|
||
<div class="milestone-actions" id="pe-actions" style="display:none">
|
||
<button id="pe-all-normal" class="btn-sm btn-success"><i class="fas fa-check-double"></i> All Normal</button>
|
||
<button id="pe-all-clear" class="btn-sm btn-ghost"><i class="fas fa-eraser"></i> Clear All</button>
|
||
<button id="pe-generate-btn" class="btn-generate btn-generate-teal"><i class="fas fa-wand-magic-sparkles"></i> Generate Exam Report</button>
|
||
</div>
|
||
|
||
<div id="pe-output" class="card output-card hidden">
|
||
<div class="card-header output-header">
|
||
<h3><i class="fas fa-file-medical"></i> Physical Exam Report</h3>
|
||
<div class="output-actions">
|
||
<span id="pe-model-tag" class="model-tag"></span>
|
||
<button class="btn-sm btn-primary" data-action="copy" data-target="pe-narrative-text"><i class="fas fa-copy"></i> Copy</button>
|
||
<button class="btn-sm btn-ghost" data-action="speak" data-target="pe-narrative-text"><i class="fas fa-volume-high"></i> Read</button>
|
||
<button class="btn-sm btn-ghost" data-action="nc-export" data-target="pe-narrative-text" data-label="physical-exam"><i class="fas fa-cloud-arrow-up"></i></button>
|
||
</div>
|
||
</div>
|
||
<div id="pe-summary-bar" class="summary-bar hidden"></div>
|
||
<div id="pe-narrative-text" class="output-text" contenteditable="true"></div>
|
||
</div>
|