Sascha/Aime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

GUI: Sprecher-Verlauf als Vollbreiten-Streifen unter dem Player

Browse Source 
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0113vDKdSNtD3Dwcw4QMu9yV
This commit is contained in:
schakal00783
2026-07-17 00:55:15 +02:00
co-authored by Claude Fable 5
parent 795892cb9f
commit d9ae8f819b
3 changed files with 27 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/web/src/main.js
+12 -10
View File
@@ -389,14 +389,11 @@ async function openRecording(id) {
const durMs = r.duration_ms || (r.words && r.words.length ? r.words[r.words.length - 1].t_end_ms : 0) || 1;
// Draggable module blocks; the saved order wins, unknown/new modules append.
// The transcript is NOT a module: it lives in its own sticky, inner-scrolling
// right column so the (long) text never stretches the page.
const MOD_TITLES = { analyse: 'Zusammenfassung', viz: 'Sprecher-Verlauf', todos: 'ToDos', speakers: 'Sprecher' };
const mods = {
analyse: `
${r.summary ? `<p class="summary">${escapeHtml(r.summary)}</p>` : '<div class="muted">Noch keine Zusammenfassung.</div>'}
${(r.participants && r.participants.length) ? `<h3>Teilnehmer</h3><ul class="parts">${r.participants.map(p => `<li>👤 ${escapeHtml(p)}</li>`).join('')}</ul>` : ''}`,
viz: spkOrder.length ? `
// NOT modules: the transcript (own sticky right column) and the speaker-lane
// visualizer (fixed full-width strip under the player, spanning both columns).
const MOD_TITLES = { analyse: 'Zusammenfassung', todos: 'ToDos', speakers: 'Sprecher' };
const vizHtml = spkOrder.length ? `
<div class="viz-top">
<div class="viz-wrap">
<div class="lanes" id="lanes">
${spkOrder.map((sp, i) => `
@@ -410,7 +407,11 @@ async function openRecording(id) {
</div>
<div class="livebox" id="livebox"><div class="muted">▶ Abspielen — hier erscheint, was gerade gesprochen wird.</div></div>
</div>
<div class="hint">Klick in die Spuren springt an die Stelle.</div>` : '<div class="muted">Keine Sprecherdaten.</div>',
</div>` : '';
const mods = {
analyse: `
${r.summary ? `<p class="summary">${escapeHtml(r.summary)}</p>` : '<div class="muted">Noch keine Zusammenfassung.</div>'}
${(r.participants && r.participants.length) ? `<h3>Teilnehmer</h3><ul class="parts">${r.participants.map(p => `<li>👤 ${escapeHtml(p)}</li>`).join('')}</ul>` : ''}`,
todos: (r.todos && r.todos.length) ? `<ul class="todos">${r.todos.map(t => `<li>${escapeHtml(t)}</li>`).join('')}</ul>` : '<div class="muted">Keine ToDos erkannt.</div>',
speakers: spkOrder.length ? `
<div class="hint">Namen vergeben → App lernt die Stimme.</div>
@@ -423,7 +424,7 @@ async function openRecording(id) {
</div>`).join('')}
</div>` : '',
};
const defOrder = ['analyse', 'viz', 'todos', 'speakers'];
const defOrder = ['analyse', 'todos', 'speakers'];
let order = [];
try { order = JSON.parse(localStorage.getItem('aime-detail-order') || '[]'); } catch {}
order = order.filter(m => mods[m] !== undefined).concat(defOrder.filter(m => !order.includes(m)));
@@ -432,6 +433,7 @@ async function openRecording(id) {
<div class="card">
<h2>${escapeHtml(r.title) || 'Aufnahme #' + r.id} ${analysisBadge(r.analysis_status)}</h2>
<audio id="player" controls src="/media/${r.mp3_file}" preload="metadata"></audio>
${vizHtml}
<div class="status-line">
${anaTimeSpan(r) ? `<div class="muted ana-line">⏱ Analysezeit: ${anaTimeSpan(r)}</div>` : ''}
${transcribing ? '<div class="muted">📝 Transkription läuft… lange Aufnahmen dauern (A76-Takt gegen Überhitzung gedrosselt).</div>' : ''}