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

Hide HLS buffer segment boundaries and update dev mode

Browse Source
This commit is contained in:
Yiannis Christodoulou 2025-10-02 14:47:56 +03:00
parent 94d8a70d59
commit ccfe93a0f4
2 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend-tools/video-js/src/VideoJS.css
View File

@ -524,6 +524,14 @@ html {
background: rgba(255, 255, 255, 0.5) !important; background: rgba(255, 255, 255, 0.5) !important;
} }
/* Hide HLS buffer segment boundaries while keeping overall load progress */
/* Target only the HLS buffer segment divs (they have data-start and data-end attributes) */
.vjs-load-progress > div[data-start][data-end] {
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
.video-js .vjs-progress-control { .video-js .vjs-progress-control {
position: absolute !important; position: absolute !important;
bottom: 42px !important; /* Moved up to prevent overlap with controls */ bottom: 42px !important; /* Moved up to prevent overlap with controls */

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

@ -34,7 +34,7 @@ function VideoJSPlayer({ videoId = 'default-video' }) {
}, []); }, []);
// Environment-based development mode configuration // Environment-based development mode configuration
const isDevMode = false; // import.meta.env.VITE_DEV_MODE === 'true' || window.location.hostname.includes('vercel.app'); const isDevMode = import.meta.env.VITE_DEV_MODE === 'true' || window.location.hostname.includes('vercel.app');
// Safely access window.MEDIA_DATA with fallback using useMemo // Safely access window.MEDIA_DATA with fallback using useMemo
const mediaData = useMemo( const mediaData = useMemo(
() => () =>
@ -50,17 +50,17 @@ function VideoJSPlayer({ videoId = 'default-video' }) {
url: 'https://videojs.mediacms.io/view?m=meivs1H3R', url: 'https://videojs.mediacms.io/view?m=meivs1H3R',
poster_url: poster_url:
'/media/original/thumbnails/user/markos/d6ae9093cb1648529432f38ee1198200_6BfyhyM.video.mp4.jpg', '/media/original/thumbnails/user/markos/d6ae9093cb1648529432f38ee1198200_6BfyhyM.video.mp4.jpg',
chapter_data: [],
__chapter_data: [ chapter_data: [
{ {
startTime: '00:00:00.000', startTime: '00:00:00.000',
endTime: '00:00:08.295', endTime: '00:00:02.295',
chapterTitle: 'A1 Lorem ipsum dolor sit amet consectetur adipisicing elit.', chapterTitle: 'A1 Lorem ipsum dolor sit amet consectetur adipisicing elit.',
}, },
{ startTime: '00:00:08.295', endTime: '00:00:15.590', chapterTitle: 'A2 of Marine Life' }, { startTime: '00:00:02.295', endTime: '00:00:04.590', chapterTitle: 'A2 of Marine Life' },
{ {
startTime: '00:00:15.590', startTime: '00:00:04.590',
endTime: '00:00:22.885', endTime: '00:00:06.885',
chapterTitle: 'A3 Reef Ecosystems', chapterTitle: 'A3 Reef Ecosystems',
}, },
], ],