CopyBot/mediacms
1
0
Fork 0
mirror of https://github.com/mediacms-io/mediacms.git synced 2025-11-09 17:08:58 -05:00
Code Issues Packages Projects Releases Wiki Activity

Remove play icon from chapter drag handle

Browse Source 
Updated the CustomChaptersOverlay component to always display the chapter index in the drag handle, removing the conditional play icon ('▶') for the active chapter. This simplifies the UI and ensures consistent labeling of chapter handles.
This commit is contained in:
Yiannis Christodoulou 2025-10-13 01:18:21 +03:00
parent cf1b84d538
commit 13ac69bd50
1 changed files with 1 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend-tools/video-js/src/components/controls/CustomChaptersOverlay.js
View File

@ -211,7 +211,7 @@ class CustomChaptersOverlay extends Component {
const drag = document.createElement('div'); const drag = document.createElement('div');
drag.className = 'playlist-drag-handle'; drag.className = 'playlist-drag-handle';
drag.textContent = index === 0 ? '▶' : String(index + 1); drag.textContent = String(index + 1);
const meta = document.createElement('div'); const meta = document.createElement('div');
meta.className = 'thumbnail-meta'; meta.className = 'thumbnail-meta';
@ -411,12 +411,10 @@ class CustomChaptersOverlay extends Component {
if (isPlaying) { if (isPlaying) {
currentChapterIndex = index; currentChapterIndex = index;
item.classList.add('selected'); item.classList.add('selected');
if (handle) handle.textContent = '▶';
if (dynamic) if (dynamic)
dynamic.textContent = dynamic.getAttribute('data-time-range') || this.getChapterTimeRange(chapter); 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 (dynamic) if (dynamic)
dynamic.textContent = dynamic.getAttribute('data-time-range') || this.getChapterTimeRange(chapter); dynamic.textContent = dynamic.getAttribute('data-time-range') || this.getChapterTimeRange(chapter);
} }
@ -431,15 +429,12 @@ class CustomChaptersOverlay extends Component {
updateActiveItem(activeIndex) { updateActiveItem(activeIndex) {
const items = this.chaptersList.querySelectorAll('.playlist-items'); const items = this.chaptersList.querySelectorAll('.playlist-items');
items.forEach((el, idx) => { items.forEach((el, idx) => {
const handle = el.querySelector('.playlist-drag-handle');
const dynamic = el.querySelector('.meta-dynamic'); const dynamic = el.querySelector('.meta-dynamic');
if (idx === activeIndex) { if (idx === activeIndex) {
el.classList.add('selected'); el.classList.add('selected');
if (handle) handle.textContent = '▶';
if (dynamic) dynamic.textContent = dynamic.getAttribute('data-duration') || ''; if (dynamic) dynamic.textContent = dynamic.getAttribute('data-duration') || '';
} else { } else {
el.classList.remove('selected'); el.classList.remove('selected');
if (handle) handle.textContent = String(idx + 1);
if (dynamic) { if (dynamic) {
const timeRange = dynamic.getAttribute('data-time-range'); const timeRange = dynamic.getAttribute('data-time-range');
if (timeRange) { if (timeRange) {