Configuration
Here is a list of the configuration options:
| Property | Description | Default |
|---|---|---|
| defaultQuality | The default quality level (default,medium,large,hd720). If used in conjunction with the hd toggle feature, setting a default quality here will start playback with the desired default bitrate, if setting to hd720 as default, the hd button feature will toggle to hd automatically. | |
| bitrates | Enable bitrates menu selection support. | |
| vr | Enable Youtube 360 VR controls support through the player. | |
| hasAds | Works the same as the vr config to enable access to the Youtube ui to disable overlay ads. | |
| cc | Enable close caption toggling menu button support. | |
| ccEnabled | Turn captions on and toggle the cc button by default. Set to false to disable captions on startup to be manually toggled on. | |
| subtitles | Enable Flowplayer managed external subtitles and menu support. | |
| ccLangList | A list of language country codes to filter the subtitles menu list if too large. | |
| ccDisplaySettings | Control the css styling of the Youtube derived subtitles display. ie. | |
| qualityLabels | The custom bitrate labels to be used with the bitrate menu support. | { tiny: "140p", small: "240p", medium: '360p', large: '480p', hd720: '720p', hd1080: '1080p', hd1140: '1140p', hd2160: '2160p', hd2880: "2880p", highres: '4320p', "default": "auto"} |
Start offsets and durations
Start offsets can be applied using either the clip or playlist configs. This will allow the player to start playlist of the video at a certain time.
clip: {
start: 100,
sources: [
{type: "youtube", src: "http://www.youtube.com/watch?v=YE7VzlLtp-4"}
]
}
playlist: [
{
start: 100,
sources:[
{type: "video/youtube", src: "http://www.youtube.com/watch?v=YE7VzlLtp-4"}
]
}
]
Flowplayer 7 has no api for playback durations therefore it can be scripted using events
player.on("progress", function () {
if (api.video.time > 20) {
api.pause();
}
});
Youtube Available Quality Levels
- tiny
- small
- medium
- large
- 720p - HD
- 1080p - HD
- 1140p - 2K
- 2160p - 4K
- 2880p - 5K
- highres - 8K
- default - auto switching
Youtube Closed Caption Styling
The following properties can be configured to style the Youtube derived subtitles.
background: "#CCCCCC"
backgroundOpacity: 1
charEdgeStyle: "uniform"
color: "#fff"
fontFamily: 4
fontFamilyOption: "propSans"
fontSizeIncrement: 3
textOpacity: 1
windowColor: "#080808"
windowOpacity: 0
Live Events
Simply configuring the player as live will determine that it is a live stream with no duration. If the stream is configured to publish as DVR, setting the player config to dvr will enable dvr playback and to play at the current live time. For mobile browsers this will be set as live.
flowplayer({
...
live: true,
});
flowplayer({
...
dvr: true,
...
});