Skip to content

Latest commit

 

History

History
67 lines (50 loc) · 3.47 KB

video-js-7-1-and-6-11-autoplay-and-fullscreen-changes.mdx

File metadata and controls

67 lines (50 loc) · 3.47 KB
Raw
title tags author date
Video.js 7.1 and 6.11: Autoplay and Fullscreen changes
autoplay
fullscreen
name github
Gary Katsevman
gkatsev
2018-07-10 10:02:47 -0700

import BlogImage from '../../components/BlogComponents/BlogImage'

It's been a while since the last release post. The 7.1.0 and 6.11.0 releases of Video.js are full of great features from contributors and maintainers. The two big changes are related to autoplay -- when will we stop talking about autoplay? -- and fullscreen. Though, there's plenty more in there.

Video.js 7.1.0 and 6.11.0 are out as next and next-6 respectively on npm.

To get 7.1.0 via npm:

npm install video.js@next

And 6.11.0 via npm:

npm install video.js@next-6

Autoplay

We've been keeping track of changes happening around autoplay in browser vendors. We've also done a lot of work to make Video.js work as well as possible with the new autoplay policies. However, there were still some use cases that weren't accounted for. To address those, we decided to extend the existing Video.js autoplay option to include a few new values: muted, play, any. The current boolean options will work as they do now and unknown options will be treated as they do now.

  • muted - this will mute the video element before calling play() on loadstart.
  • play - this will call play() on loadstart. This is similar to the autoplay attribute but with a call to play instead of using the attribute.
  • any - this will call play() on loadstart but if it fails, it will try and mute the player and try play()ing again.

Fullscreen

There are two fullscreen related changes in these releases.

The first one is one that was often request and it's finally here: double click to toggle fullscreen. Double clicking inside the player area -- outside of the control bar and modal dialogs -- will enter or exit fullscreen playback.

The second change is to disable the fullscreen toggle if fullscreen is not available, for example, inside of an iframe without allowfullscreen attribute

Notable Changes

  • Make audio tracks that are of "main-desc" kind show up with an Audio Description icon
  • Run our CSS through autoprefixer which reduces the output size a bit.
  • Make the mute toggle show up if muting is possible even if changing volume programmatically isn't. For example, on iOS.
  • Make setSource be option for middleware.

Thanks

I'd like to thank everyone that contributed to this release!