Skip to content

Commit 06d9ed2

Browse files
committed
Fix videos being invisible on Safari in some cases
1 parent fd9e80a commit 06d9ed2

File tree

1 file changed

+14
-4
lines changed

1 file changed

+14
-4
lines changed

static/js/video-playback.js

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,14 +37,24 @@ function setupPlayer(video) {
3737

3838
video.style.transition = 'opacity 150ms';
3939

40-
if (video.readyState >= 2) {
40+
const show = () => {
4141
video.style.opacity = '1';
42+
};
43+
44+
if (video.readyState >= 2) {
45+
show();
4246
} else {
4347
video.style.opacity = '0';
4448

45-
video.addEventListener('loadeddata', () => {
46-
video.style.opacity = '1';
47-
});
49+
video.addEventListener('loadeddata', show);
50+
video.addEventListener('canplay', show);
51+
video.addEventListener('canplaythrough', show);
52+
53+
if (video.readyState >= 2) {
54+
show();
55+
}
56+
57+
setTimeout(show, 1000);
4858
}
4959
}
5060

0 commit comments

Comments
 (0)