fix: Store reference to the current chapter span for dynamic updates

This commit is contained in:
Yiannis Christodoulou 2025-09-16 12:39:32 +03:00
parent 31bc0ac0b2
commit d37eab41c7
2 changed files with 46 additions and 1 deletions

View File

@ -97,6 +97,9 @@ class CustomChaptersOverlay extends Component {
`; `;
playlistTitle.appendChild(chapterTitle); playlistTitle.appendChild(chapterTitle);
// Store reference to the current chapter span for dynamic updates
this.currentChapterSpan = chapterTitle.querySelector('span');
const chapterClose = document.createElement('div'); const chapterClose = document.createElement('div');
chapterClose.className = 'chapter-close'; chapterClose.className = 'chapter-close';
const closeBtn = document.createElement('button'); const closeBtn = document.createElement('button');
@ -224,6 +227,7 @@ class CustomChaptersOverlay extends Component {
const currentTime = this.player().currentTime(); const currentTime = this.player().currentTime();
const chapterItems = this.chaptersList.querySelectorAll('.playlist-items'); const chapterItems = this.chaptersList.querySelectorAll('.playlist-items');
let currentChapterIndex = -1;
chapterItems.forEach((item, index) => { chapterItems.forEach((item, index) => {
const chapter = this.chaptersData[index]; const chapter = this.chaptersData[index];
@ -234,15 +238,21 @@ class CustomChaptersOverlay extends Component {
const handle = item.querySelector('.playlist-drag-handle'); const handle = item.querySelector('.playlist-drag-handle');
const dynamic = item.querySelector('.meta-dynamic'); const dynamic = item.querySelector('.meta-dynamic');
if (isPlaying) { if (isPlaying) {
currentChapterIndex = index;
item.classList.add('selected'); item.classList.add('selected');
if (handle) handle.textContent = '▶'; if (handle) handle.textContent = '▶';
if (dynamic) dynamic.textContent = dynamic.getAttribute('data-duration') || ''; if (dynamic) dynamic.textContent = dynamic.getAttribute('data-time-range') || this.getChapterTimeRange(chapter);
} else { } else {
item.classList.remove('selected'); item.classList.remove('selected');
if (handle) handle.textContent = String(index + 1); if (handle) handle.textContent = String(index + 1);
if (dynamic) dynamic.textContent = dynamic.getAttribute('data-time-range') || this.getChapterTimeRange(chapter); if (dynamic) dynamic.textContent = dynamic.getAttribute('data-time-range') || this.getChapterTimeRange(chapter);
} }
}); });
// Update the header chapter number
if (this.currentChapterSpan && currentChapterIndex !== -1) {
this.currentChapterSpan.textContent = `${currentChapterIndex + 1} / ${this.chaptersData.length}`;
}
} }
updateActiveItem(activeIndex) { updateActiveItem(activeIndex) {
@ -271,6 +281,11 @@ class CustomChaptersOverlay extends Component {
} }
} }
}); });
// Update the header chapter number
if (this.currentChapterSpan) {
this.currentChapterSpan.textContent = `${activeIndex + 1} / ${this.chaptersData.length}`;
}
} }
closeOverlay() { closeOverlay() {

View File

@ -37,6 +37,7 @@ class CustomSettingsMenu extends Component {
this.createSettingsButton(); this.createSettingsButton();
this.createSettingsOverlay(); this.createSettingsOverlay();
this.setupEventListeners(); this.setupEventListeners();
this.restoreSubtitlePreference();
}); });
} }
@ -929,6 +930,35 @@ class CustomSettingsMenu extends Component {
this.subtitlesSubmenu.style.display = 'none'; this.subtitlesSubmenu.style.display = 'none';
} }
restoreSubtitlePreference() {
const savedLanguage = this.userPreferences.getPreference('subtitleLanguage');
if (savedLanguage) {
setTimeout(() => {
const player = this.player();
const tracks = player.textTracks();
for (let i = 0; i < tracks.length; i++) {
const track = tracks[i];
if (track.kind === 'subtitles') {
track.mode = 'disabled';
}
}
for (let i = 0; i < tracks.length; i++) {
const track = tracks[i];
if (track.kind === 'subtitles' && track.language === savedLanguage) {
track.mode = 'showing';
console.log('✓ Restored subtitle preference:', savedLanguage, track.label);
this.refreshSubtitlesSubmenu();
break;
}
}
}, 500);
}
}
handleClickOutside(e) { handleClickOutside(e) {
if ( if (
this.settingsOverlay && this.settingsOverlay &&