sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ensure video playback respects mute settings on various devices

Browse Source 
Update VideoCard component to correctly apply the muted state for HLS and native HLS playback, resolving issues where audio was intermittently muted or unmuted.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 946a0075-7e32-454b-b348-9e7f576d7f45
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/60d372ff-2c10-46c7-b01b-10c3435136b0/946a0075-7e32-454b-b348-9e7f576d7f45/JlONw6J
This commit is contained in:
sebastjanartic 2025-09-04 12:33:57 +00:00
parent b1657c251a
commit e2c6d9bee8
1 changed files with 13 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
client/src/components/video-card.tsx
View File

@ -141,6 +141,9 @@ export default function VideoCard({ video, onClick, className = "", hideOverlay
if (showPreview && videoRef.current && video.videoUrl.includes('.m3u8')) {
const videoElement = videoRef.current;
// Ensure video element respects current mute state
videoElement.muted = isMuted;
if (Hls.isSupported()) {
const hls = new Hls({
startLevel: 0, // Start with lowest quality
@ -153,24 +156,33 @@ export default function VideoCard({ video, onClick, className = "", hideOverlay
hlsRef.current = hls;
hls.on(Hls.Events.MANIFEST_PARSED, () => {
// Set muted state before playing
videoElement.muted = isMuted;
videoElement.play().catch(e => console.log('Preview autoplay failed:', e));
});
hls.on(Hls.Events.MEDIA_ATTACHED, () => {
// Set muted state after media is attached
videoElement.muted = isMuted;
videoElement.addEventListener('loadedmetadata', () => {
setDuration(videoElement.duration);
// Ensure muted state is preserved after metadata loads
videoElement.muted = isMuted;
});
});
} else if (videoElement.canPlayType('application/vnd.apple.mpegurl')) {
// Safari native HLS support
videoElement.src = video.videoUrl;
videoElement.muted = isMuted;
videoElement.addEventListener('loadedmetadata', () => {
setDuration(videoElement.duration);
// Ensure muted state is preserved after metadata loads
videoElement.muted = isMuted;
});
videoElement.play().catch(e => console.log('Preview autoplay failed:', e));
}
}
}, [showPreview, video.videoUrl]);
}, [showPreview, video.videoUrl, isMuted]);
return (
<div