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

Revert "Keep progress bar always visible in VideoJSPlayer"

Browse Source 
This reverts commit 24e9fb4e40e6cfd2e37ba8e2a75e2b070d83c725.
This commit is contained in:
Yiannis Christodoulou 2025-10-11 02:42:26 +03:00
parent 8fd1b5e875
commit f07e5b9e5a
1 changed files with 16 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
frontend-tools/video-js/src/components/video-player/VideoJSPlayer.jsx
View File

@ -1250,7 +1250,7 @@ function VideoJSPlayer({ videoId = 'default-video' }) {
media_type: 'video', media_type: 'video',
original_media_url: original_media_url:
'/media/original/user/markos/db52140de7204022a1e5f08e078b4ec6.UniversityofCopenhagenMærskTower.mp4', '/media/original/user/markos/db52140de7204022a1e5f08e078b4ec6.UniversityofCopenhagenMærskTower.mp4',
hls_info: { _hls_info: {
master_file: '/media/hls/5073e97457004961a163c5b504e2d7e8/master.m3u8', master_file: '/media/hls/5073e97457004961a163c5b504e2d7e8/master.m3u8',
'240_iframe': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-1/iframes.m3u8', '240_iframe': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-1/iframes.m3u8',
'480_iframe': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-2/iframes.m3u8', '480_iframe': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-2/iframes.m3u8',
@ -1263,7 +1263,7 @@ function VideoJSPlayer({ videoId = 'default-video' }) {
'144_playlist': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-4/stream.m3u8', '144_playlist': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-4/stream.m3u8',
'360_playlist': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-5/stream.m3u8', '360_playlist': '/media/hls/5073e97457004961a163c5b504e2d7e8/media-5/stream.m3u8',
}, },
// hls_info: {}, hls_info: {},
/* hls_info: { /* hls_info: {
master_file: '/media/hls/c1ab03cab3bb46b5854a5e217cfe3013/master.m3u8', master_file: '/media/hls/c1ab03cab3bb46b5854a5e217cfe3013/master.m3u8',
'240_iframe': '/media/hls/c1ab03cab3bb46b5854a5e217cfe3013/media-1/iframes.m3u8', '240_iframe': '/media/hls/c1ab03cab3bb46b5854a5e217cfe3013/media-1/iframes.m3u8',
@ -2731,26 +2731,19 @@ function VideoJSPlayer({ videoId = 'default-video' }) {
// Also store on player instance for sprite preview access // Also store on player instance for sprite preview access
playerRef.current.customComponents = customComponents.current; playerRef.current.customComponents = customComponents.current;
// Keep progress bar always visible like the control bar // Hide/show progress bar with control bar based on user activity
const syncProgressVisibility = () => { const syncProgressVisibility = () => {
const isControlBarVisible = const isControlBarVisible =
controlBar.hasClass('vjs-visible') || controlBar.hasClass('vjs-visible') ||
!playerRef.current.hasClass('vjs-user-inactive'); !playerRef.current.hasClass('vjs-user-inactive');
// Always show progress bar when control bar is visible
if (isControlBarVisible) { if (isControlBarVisible) {
progressEl.style.opacity = '1'; progressEl.style.opacity = '1';
progressEl.style.visibility = 'visible'; progressEl.style.visibility = 'visible';
} else { } else {
// For embed players, hide with controls. For regular players, keep visible progressEl.style.opacity = '0';
if (isEmbedPlayer) { progressEl.style.visibility = 'hidden';
progressEl.style.opacity = '0';
progressEl.style.visibility = 'hidden';
} else {
// Keep progress bar visible even when controls are hidden
progressEl.style.opacity = '1';
progressEl.style.visibility = 'visible';
}
} }
}; };
@ -2758,14 +2751,18 @@ function VideoJSPlayer({ videoId = 'default-video' }) {
playerRef.current.on('useractive', syncProgressVisibility); playerRef.current.on('useractive', syncProgressVisibility);
playerRef.current.on('userinactive', syncProgressVisibility); playerRef.current.on('userinactive', syncProgressVisibility);
// Initial sync - show progress bar immediately // Initial sync
progressEl.style.opacity = '1'; syncProgressVisibility();
progressEl.style.visibility = 'visible';
// Show when video starts (ensure it's always visible) // if (isEmbedPlayer) {
// Initial sync - hide until video starts
progressEl.style.opacity = '0';
progressEl.style.visibility = 'hidden';
// }
// Show when video starts
const showOnPlay = () => { const showOnPlay = () => {
progressEl.style.opacity = '1'; syncProgressVisibility();
progressEl.style.visibility = 'visible';
playerRef.current.off('play', showOnPlay); playerRef.current.off('play', showOnPlay);
playerRef.current.off('seeking', showOnPlay); playerRef.current.off('seeking', showOnPlay);
}; };