web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2025-02-02 11:34:50 +02:00
Code Releases Activity

fix(liveui): make edge detection less strict, add docs for option (#5661)

Browse Source 
Use double the seekable increment for live edge detection.
Add liveui option.
This commit is contained in:
Brandon Casey 2018-12-10 14:13:56 -05:00 committed by Gary Katsevman
parent 98b4a1cf16
commit dce4a2c7d4
3 changed files with 18 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/guides/options.md
View File

@ -247,6 +247,18 @@ Learn more about [languages in Video.js][languages]
> **Note**: Generally, this option is not needed and it would be better to pass your custom languages to `videojs.addLanguage()`, so they are available in all players!
### `liveui`
> Type: `boolean`
> Default: `false`
Allows the player to use the new live ui that includes:
* A progress bar for seeking within the live window
* A button that can be clicked to seek to the live edge with a circle indicating if you are at the live edge or not.
Without this option the progress bar will be hidden and in its place will be text that indicates `LIVE` playback. There will be no progress control
and you will not be able click the text to seek to the live edge. `liveui` will default to `true` in a future version!
### `nativeControlsForTouch`
> Type: `boolean`

2
src/js/live-tracker.js
View File

@ -28,7 +28,7 @@ class LiveTracker extends Component {
// that a player can be, but still be considered live.
// we add 0.07 because the live tracking happens every 30ms
// and we want some wiggle room for short segment live playback
const liveEdgeWindow = seekableIncrement + 0.07;
const liveEdgeWindow = (seekableIncrement * 2) + 0.07;
// on Android liveCurrentTime can bee Infinity, because seekableEnd
// can be Infinity, so we handle that case.

8
test/unit/live-tracker.test.js
View File

@ -66,6 +66,8 @@ QUnit.module('LiveTracker', () => {
});
QUnit.test('Triggers liveedgechange when we fall behind and catch up', function(assert) {
this.liveTracker.seekableIncrement_ = 6;
this.player.trigger('timeupdate');
this.player.currentTime = () => 0;
this.clock.tick(20000);
@ -107,7 +109,7 @@ QUnit.module('LiveTracker', () => {
return 0;
};
this.clock.tick(3000);
this.clock.tick(6000);
assert.ok(this.liveTracker.pastSeekEnd() > 2, 'pastSeekEnd should be over 2s');
@ -154,7 +156,7 @@ QUnit.module('LiveTracker', () => {
QUnit.test('single seekable, helpers should be correct', function(assert) {
// simple
this.player.seekable = () => createTimeRanges(10, 50);
assert.strictEqual(this.liveTracker.liveWindow(), 40.03, 'liveWindow is 40s');
assert.strictEqual(Math.round(this.liveTracker.liveWindow()), 40, 'liveWindow is ~40s');
assert.strictEqual(this.liveTracker.seekableStart(), 10, 'seekableStart is 10s');
assert.strictEqual(this.liveTracker.seekableEnd(), 50, 'seekableEnd is 50s');
});
@ -162,7 +164,7 @@ QUnit.module('LiveTracker', () => {
QUnit.test('multiple seekables, helpers should be correct', function(assert) {
// multiple
this.player.seekable = () => createTimeRanges([[0, 1], [2, 3], [4, 5]]);
assert.strictEqual(this.liveTracker.liveWindow(), 5.03, 'liveWindow is 5s');
assert.strictEqual(Math.round(this.liveTracker.liveWindow()), 5, 'liveWindow is ~5s');
assert.strictEqual(this.liveTracker.seekableStart(), 0, 'seekableStart is 0s');
assert.strictEqual(this.liveTracker.seekableEnd(), 5, 'seekableEnd is 5s');
});