your personal website on atproto - mirror blento.app
26
fork

Configure Feed

Select the types of activity you want to include in your feed.

fix safari?

Florian 2ad0f78c 62463319

+22 -5
+22 -5
src/lib/cards/BlueskyMediaCard/Video.svelte
··· 12 12 }; 13 13 } = $props(); 14 14 15 - onMount(async () => { 15 + onMount(() => { 16 + // Ensure muted is set programmatically (some browsers require this) 17 + element.muted = true; 18 + 16 19 if (Hls.isSupported()) { 17 - var hls = new Hls(); 20 + // Use hls.js for browsers that don't support HLS natively 21 + const hls = new Hls(); 18 22 hls.loadSource(video.playlist); 19 23 hls.attachMedia(element); 24 + hls.on(Hls.Events.MANIFEST_PARSED, () => { 25 + element.muted = true; 26 + element.play().catch((e) => { 27 + console.error('HLS play error:', e); 28 + }); 29 + }); 30 + } else if (element.canPlayType('application/vnd.apple.mpegurl')) { 31 + // Safari supports HLS natively 32 + element.src = video.playlist; 33 + element.addEventListener('canplay', () => { 34 + element.muted = true; 35 + element.play().catch((e) => { 36 + console.error('Native HLS play error:', e); 37 + }); 38 + }); 20 39 } 21 - 22 - element.play(); 23 40 }); 24 41 25 - let element: HTMLMediaElement; 42 + let element: HTMLVideoElement; 26 43 </script> 27 44 28 45 <img src={video.thumbnail} class="absolute inset-0 -z-10 h-full w-full object-cover" alt="" />