theater/qrun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify qrunweb timeline rendering

Browse Source
This commit is contained in:
Ian Gulliver
2026-02-19 00:07:32 -07:00
parent 3e458bfce0
commit ea932d3225
1 changed files with 11 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
cmd/qrunweb/static/index.html
View File

@@ -161,6 +161,7 @@ fetch('show.json').then(r => r.json()).then(render);
function render(data) { function render(data) {
const blocks = new Map(data.blocks.map(b => [b.id, b])); const blocks = new Map(data.blocks.map(b => [b.id, b]));
const trackById = new Map(data.tracks.map(t => [t.id, t]));
const getTrack = id => blocks.get(id).type === 'cue' ? '_cue' : blocks.get(id).track; const getTrack = id => blocks.get(id).type === 'cue' ? '_cue' : blocks.get(id).track;
const trackIds = ['_cue', ...data.tracks.map(t => t.id)]; const trackIds = ['_cue', ...data.tracks.map(t => t.id)];
@@ -201,6 +202,13 @@ function render(data) {
const mid = tid => active.has(tid) ? { blockId: active.get(tid), segment: 'mid' } : { empty: true }; const mid = tid => active.has(tid) ? { blockId: active.get(tid), segment: 'mid' } : { empty: true };
const mkCells = evs => trackIds.map(tid => evs.get(tid) || mid(tid)); const mkCells = evs => trackIds.map(tid => evs.get(tid) || mid(tid));
const applySideEffect = (map, blockId, hook) => {
const tid = getTrack(blockId);
if (map.has(tid)) return;
if (hook === 'START') { active.set(tid, blockId); map.set(tid, { blockId, segment: 'start', event: 'START', isHook: true }); }
else if (hook === 'END') { map.set(tid, { blockId, segment: 'end', event: 'END', isHook: true }); active.delete(tid); }
else if (hook === 'FADE_OUT') { map.set(tid, { blockId, segment: 'mid', event: 'FADE_OUT' }); pending.add(blockId); }
};
const flush = () => { const flush = () => {
const toEnd = [...pending].filter(bid => !data.triggers.some(t => t.source.block === bid && t.source.signal === 'END')); const toEnd = [...pending].filter(bid => !data.triggers.some(t => t.source.block === bid && t.source.signal === 'END'));
@@ -233,13 +241,7 @@ function render(data) {
starts.set(tid, { blockId: tgt, segment: 'start', event: 'START', isSignal: true }); starts.set(tid, { blockId: tgt, segment: 'start', event: 'START', isSignal: true });
noTitle.add(rows.length-1); noTitle.add(rows.length-1);
sideEffects.forEach((h, b) => { sideEffects.forEach((h, b) => applySideEffect(starts, b, h));
const ttid = getTrack(b);
if (starts.has(ttid)) return;
if (h === 'START') { active.set(ttid, b); starts.set(ttid, { blockId: b, segment: 'start', event: 'START', isHook: true }); }
else if (h === 'END') { starts.set(ttid, { blockId: b, segment: 'end', event: 'END', isHook: true }); active.delete(ttid); }
else if (h === 'FADE_OUT') { starts.set(ttid, { blockId: b, segment: 'mid', event: 'FADE_OUT' }); pending.add(b); }
});
addRow(mkCells(starts), sideEffects.size ? 'sig-row' : ''); addRow(mkCells(starts), sideEffects.size ? 'sig-row' : '');
continue; continue;
} }
@@ -273,13 +275,7 @@ function render(data) {
}); });
noTitle.add(rows.length-1); noTitle.add(rows.length-1);
sideEffects.forEach((h, b) => { sideEffects.forEach((h, b) => applySideEffect(starts, b, h));
const tid = getTrack(b);
if (starts.has(tid)) return;
if (h === 'START') { active.set(tid, b); starts.set(tid, { blockId: b, segment: 'start', event: 'START', isHook: true }); }
else if (h === 'END') { starts.set(tid, { blockId: b, segment: 'end', event: 'END', isHook: true }); active.delete(tid); }
else if (h === 'FADE_OUT') { starts.set(tid, { blockId: b, segment: 'mid', event: 'FADE_OUT' }); pending.add(b); }
});
addRow(mkCells(starts), sideEffects.size ? 'sig-row' : ''); addRow(mkCells(starts), sideEffects.size ? 'sig-row' : '');
i = j - 1; i = j - 1;
@@ -389,7 +385,7 @@ function render(data) {
trackIds.forEach(tid => { trackIds.forEach(tid => {
const el = document.createElement('div'); const el = document.createElement('div');
el.className = 'track-header'; el.className = 'track-header';
el.textContent = tid === '_cue' ? 'Cue' : (data.tracks.find(t => t.id === tid)||{}).name; el.textContent = tid === '_cue' ? 'Cue' : (trackById.get(tid)||{}).name;
timeline.appendChild(el); timeline.appendChild(el);
}); });