fddda9727a
- Move input files to input/amuta_2026-01-12_1/
- Move output files to outputs/{format}/amuta_2026-01-12_1/
- Create config.js with Pythonic-style configuration
- Update app.js to use CONFIG values
- Update index.html to load config.js
- Update .gitignore (exclude large audio files, track only .opus)
74 lines
2.9 KiB
HTML
74 lines
2.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Amuta Space Talkers</title>
|
|
<link rel="stylesheet" href="styles.css" />
|
|
</head>
|
|
<body>
|
|
<main class="app">
|
|
<section class="stage">
|
|
<div class="brand-overlay">Amuta Space Talkers</div>
|
|
<div class="speaker-overlay" id="activeSpeaker">-</div>
|
|
<div class="menu-overlay">
|
|
<button class="menu-button" id="configToggle" type="button" aria-label="Settings">...</button>
|
|
<div class="menu-panel" id="configPanel">
|
|
<div class="menu-title">Transcript</div>
|
|
<label class="menu-row">
|
|
<span>Opacity</span>
|
|
<input id="opacityRange" type="range" min="0.2" max="1" step="0.05" value="0.85" />
|
|
</label>
|
|
<label class="menu-row">
|
|
<span>Rows</span>
|
|
<input id="rowsRange" type="range" min="2" max="12" step="1" value="6" />
|
|
</label>
|
|
<label class="menu-row">
|
|
<span>Text Size</span>
|
|
<select id="sizeSelect">
|
|
<option value="small">Small</option>
|
|
<option value="medium" selected>Medium</option>
|
|
<option value="large">Large</option>
|
|
</select>
|
|
</label>
|
|
<div class="menu-title">Waveform</div>
|
|
<label class="menu-row menu-row-checkbox">
|
|
<input id="waveformEmbedded" type="checkbox" />
|
|
<span>Under captions</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<canvas id="spaceCanvas" class="space-canvas"></canvas>
|
|
<div class="stage-overlay">
|
|
<div class="transcript-panel" id="transcriptPanel"></div>
|
|
<div class="speaker-list" id="speakerList"></div>
|
|
</div>
|
|
<div class="embedded-waveform" id="embeddedWaveform">
|
|
<canvas id="embeddedWaveformCanvas" class="spectrogram"></canvas>
|
|
<canvas id="embeddedWaveformOverlay" class="spectrogram overlay"></canvas>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="transport">
|
|
<div class="controls">
|
|
<button class="control-button" id="playPause" type="button">Play</button>
|
|
<div class="timecode">
|
|
<span id="currentTime">0:00</span>
|
|
<span class="time-divider">/</span>
|
|
<span id="duration">0:00</span>
|
|
</div>
|
|
</div>
|
|
<div class="spectrogram-wrap">
|
|
<canvas id="spectrogramCanvas" class="spectrogram"></canvas>
|
|
<canvas id="spectrogramOverlay" class="spectrogram overlay"></canvas>
|
|
</div>
|
|
<div class="scrub-hint">Drag anywhere on the waveform to scrub.</div>
|
|
</section>
|
|
</main>
|
|
|
|
<audio id="audio" preload="metadata"></audio>
|
|
<script src="config.js"></script>
|
|
<script src="app.js"></script>
|
|
</body>
|
|
</html>
|