/ simulated_instruments / recorder
Sign in
simulated_instruments / recorder
recorder / webapp / src / components / DiagnosticsPanel.tsx
58 lines · 2.0 KBCodeBlameHistory
5623b11Recorder simulator: MATLAB jet-drive model and interactive web appJeremy Magland 1import { NOTE_NAMES } from '../params';
80e74e9Add instrument/: the recorder behind the track-render interfaceJeremy Magland 2import type { RenderResult } from '../hooks/useRenderer';
80e74e9Add instrument/: the recorder behind the track-render interfaceJeremy Magland 4export default function DiagnosticsPanel({ result }: { result: RenderResult }) {
6 const modes = Array.from(result.modeF);
7 const shown = modes.slice(0, 8);
8 return (
9 <div className="diag">
10 <table>
11 <tbody>
12 {Array.from(result.noteIdx).map((idx, i) => (
13 <tr key={i}>
14 <th>{d.noteCount === 1 ? 'Note' : `Note ${i + 1}`}</th>
15 <td>
16 {NOTE_NAMES[idx - 1] ?? '?'} ·{' '}
17 {result.fPlay[i] > 0
18 ? `played ${result.fPlay[i].toFixed(1)} Hz (${result.cents[i] >= 0 ? '+' : ''}${result.cents[i].toFixed(0)} cents of ${result.fTarget[i].toFixed(1)})`
19 : 'did not speak'}
20 </td>
21 </tr>
22 ))}
23 <tr>
24 <th>Bore modes</th>
25 <td className="partials">
26 {shown.map((f) => f.toFixed(0)).join(', ')}
27 {modes.length > shown.length ? `, … (${modes.length} total)` : ''} Hz
28 </td>
29 </tr>
30 <tr>
31 <th>Listener</th>
32 <td>{(d.listenerDistM * 100).toFixed(0)} cm from the window</td>
33 </tr>
34 <tr>
35 <th>Peak pressure</th>
36 <td>
37 {d.peakPa.toFixed(3)} Pa ({d.peakSplDb.toFixed(1)} dB SPL)
38 </td>
39 </tr>
40 <tr>
41 <th>Length</th>
42 <td>
43 {d.durationS.toFixed(2)} s · {result.quality} · oversample {d.oversample}
44 </td>
45 </tr>
46 </tbody>
47 </table>
48 <div className="cachenote">
49 bore solve: {d.basisCached ? 'cached' : `${(d.basisMs / 1000).toFixed(2)} s`} · jet:{' '}
50 {d.jetCached ? 'cached' : `${(d.jetMs / 1000).toFixed(2)} s`} · radiation:{' '}
51 {(d.radiateMs / 1000).toFixed(2)} s
52 </div>
53 {d.warnings.map((w, i) => (
54 <div key={i} className="warning">⚠ {w}</div>
55 ))}
56 </div>
57 );
↑↓ move↵openescclose