mirror of
https://github.com/mediacms-io/mediacms.git
synced 2025-11-09 17:08:58 -05:00
fix: Store reference to the current chapter span for dynamic updates
This commit is contained in:
parent
31bc0ac0b2
commit
d37eab41c7
@ -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() {
|
||||||
|
|||||||
@ -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 &&
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user