fix: hide idle badge by default, remove duplicate next-idle badge, remove chapter numbers under nav arrows
This commit is contained in:
@@ -2282,9 +2282,8 @@ const chapterTmpl = `
|
||||
hx-get="/books/{{.Slug}}/chapters/{{.PrevN}}"
|
||||
hx-target="#main-content" hx-push-url="true" hx-swap="innerHTML"
|
||||
title="Previous chapter" aria-label="Previous chapter"
|
||||
class="flex-shrink-0 flex flex-col items-center justify-center w-10 h-10 rounded-xl text-zinc-400 hover:text-zinc-100 hover:bg-zinc-800 transition-colors no-underline gap-0.5">
|
||||
class="flex-shrink-0 flex items-center justify-center w-10 h-10 rounded-xl text-zinc-400 hover:text-zinc-100 hover:bg-zinc-800 transition-colors no-underline">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><polyline points="15 18 9 12 15 6"/></svg>
|
||||
<span class="text-[0.55rem] tabular-nums leading-none text-zinc-600">{{.PrevN}}</span>
|
||||
</a>
|
||||
{{else}}<span class="flex-shrink-0 w-10"></span>{{end}}
|
||||
|
||||
@@ -2296,10 +2295,10 @@ const chapterTmpl = `
|
||||
</button>
|
||||
|
||||
<!-- Centre info -->
|
||||
<div class="flex-1 min-w-0 flex items-center gap-1.5 px-1">
|
||||
<div class="flex-1 min-w-0 flex items-center gap-2 px-1">
|
||||
<span id="player-title" class="text-xs font-medium text-zinc-300 truncate">Ch. {{.ChapterN}}</span>
|
||||
<span id="player-state-badge" class="queue-badge queue-badge-idle flex-shrink-0">idle</span>
|
||||
<!-- next-chapter prefetch badge -->
|
||||
<span id="player-state-badge" class="queue-badge queue-badge-idle flex-shrink-0" hidden></span>
|
||||
<!-- next-chapter prefetch badge — shown only during/after prefetch -->
|
||||
<span id="player-next-row" hidden class="flex-shrink-0">
|
||||
<span id="player-next-badge" class="queue-badge queue-badge-idle">next</span>
|
||||
</span>
|
||||
@@ -2318,9 +2317,8 @@ const chapterTmpl = `
|
||||
hx-get="/books/{{.Slug}}/chapters/{{.NextN}}"
|
||||
hx-target="#main-content" hx-push-url="true" hx-swap="innerHTML"
|
||||
title="Next chapter" aria-label="Next chapter"
|
||||
class="flex-shrink-0 flex flex-col items-center justify-center w-10 h-10 rounded-xl text-zinc-400 hover:text-zinc-100 hover:bg-zinc-800 transition-colors no-underline gap-0.5">
|
||||
class="flex-shrink-0 flex items-center justify-center w-10 h-10 rounded-xl text-zinc-400 hover:text-zinc-100 hover:bg-zinc-800 transition-colors no-underline">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><polyline points="9 18 15 12 9 6"/></svg>
|
||||
<span class="text-[0.55rem] tabular-nums leading-none text-zinc-600">{{.NextN}}</span>
|
||||
</a>
|
||||
{{else}}<span class="flex-shrink-0 w-10"></span>{{end}}
|
||||
|
||||
@@ -2595,7 +2593,8 @@ const chapterTmpl = `
|
||||
playerPlayBtn.disabled = true;
|
||||
voiceSel.disabled = true; speedSlider.disabled = true;
|
||||
setBadge(playerStateBadge, 'generating');
|
||||
playerTitle.textContent = 'Ch.\u00a0' + CHAPTER_N + '\u00a0— generating\u2026';
|
||||
playerStateBadge.hidden = false;
|
||||
playerTitle.textContent = 'Ch.\u00a0' + CHAPTER_N;
|
||||
setStatus('Generating audio\u2026');
|
||||
hideSeek();
|
||||
}
|
||||
@@ -2605,6 +2604,7 @@ const chapterTmpl = `
|
||||
playerPlayBtn.disabled = false;
|
||||
voiceSel.disabled = false; speedSlider.disabled = false;
|
||||
setBadge(playerStateBadge, 'playing');
|
||||
playerStateBadge.hidden = false;
|
||||
var pct = (audio.duration && isFinite(audio.duration))
|
||||
? Math.round((audio.currentTime / audio.duration) * 100) : 0;
|
||||
playerStateBadge.textContent = pct + '%';
|
||||
@@ -2617,6 +2617,7 @@ const chapterTmpl = `
|
||||
if (stale()) return;
|
||||
setPlayIcon(SVG_PLAY);
|
||||
setBadge(playerStateBadge, 'paused');
|
||||
playerStateBadge.hidden = false;
|
||||
var pct = (audio.duration && isFinite(audio.duration))
|
||||
? Math.round((audio.currentTime / audio.duration) * 100) : 0;
|
||||
playerStateBadge.textContent = pct + '%';
|
||||
@@ -2629,13 +2630,16 @@ const chapterTmpl = `
|
||||
setPlayIcon(SVG_PLAY);
|
||||
playerPlayBtn.disabled = false;
|
||||
voiceSel.disabled = false; speedSlider.disabled = false;
|
||||
setBadge(playerStateBadge, 'idle');
|
||||
if (genStartTime > 0) {
|
||||
var elapsed = Math.round((Date.now() - genStartTime) / 1000);
|
||||
var label = elapsed >= 60 ? Math.floor(elapsed/60) + 'm ' + (elapsed%60) + 's' : elapsed + 's';
|
||||
setBadge(playerStateBadge, 'idle');
|
||||
playerStateBadge.textContent = label;
|
||||
playerStateBadge.classList.add('queue-badge-time');
|
||||
playerStateBadge.hidden = false;
|
||||
genStartTime = 0;
|
||||
} else {
|
||||
playerStateBadge.hidden = true;
|
||||
}
|
||||
playerTitle.textContent = 'Ch.\u00a0' + CHAPTER_N;
|
||||
setStatus('');
|
||||
@@ -2648,6 +2652,7 @@ const chapterTmpl = `
|
||||
playerPlayBtn.disabled = false;
|
||||
voiceSel.disabled = false; speedSlider.disabled = false;
|
||||
setBadge(playerStateBadge, 'error');
|
||||
playerStateBadge.hidden = false;
|
||||
playerTitle.textContent = 'Error';
|
||||
setStatus('Error: ' + msg);
|
||||
hideSeek();
|
||||
@@ -2811,8 +2816,6 @@ const chapterTmpl = `
|
||||
setTimeout(startAudio, 100);
|
||||
}
|
||||
|
||||
if (NEXT_N) setNextState('idle');
|
||||
|
||||
// ── double-tap left/right to navigate ────────────────────────────────────
|
||||
if (window.__ttsDoubleTap) document.removeEventListener('touchend', window.__ttsDoubleTap);
|
||||
(function initDoubleTap() {
|
||||
|
||||
Reference in New Issue
Block a user