diff options
-rw-r--r-- | client/src/assets/player/peertube-videojs-plugin.ts | 20 | ||||
-rw-r--r-- | client/src/assets/player/video-renderer.ts | 6 |
2 files changed, 10 insertions, 16 deletions
diff --git a/client/src/assets/player/peertube-videojs-plugin.ts b/client/src/assets/player/peertube-videojs-plugin.ts index 5ccfdce36..125ef64a4 100644 --- a/client/src/assets/player/peertube-videojs-plugin.ts +++ b/client/src/assets/player/peertube-videojs-plugin.ts | |||
@@ -217,10 +217,15 @@ class PeerTubePlugin extends Plugin { | |||
217 | private playerElement: HTMLVideoElement | 217 | private playerElement: HTMLVideoElement |
218 | private videoFiles: VideoFile[] | 218 | private videoFiles: VideoFile[] |
219 | private torrent: WebTorrent.Torrent | 219 | private torrent: WebTorrent.Torrent |
220 | private autoplay = false | ||
220 | 221 | ||
221 | constructor (player: videojs.Player, options: PeertubePluginOptions) { | 222 | constructor (player: videojs.Player, options: PeertubePluginOptions) { |
222 | super(player, options) | 223 | super(player, options) |
223 | 224 | ||
225 | // Fix canplay event on google chrome by disabling default videojs autoplay | ||
226 | this.autoplay = this.player.options_.autoplay | ||
227 | this.player.options_.autoplay = false | ||
228 | |||
224 | this.videoFiles = options.videoFiles | 229 | this.videoFiles = options.videoFiles |
225 | 230 | ||
226 | // Hack to "simulate" src link in video.js >= 6 | 231 | // Hack to "simulate" src link in video.js >= 6 |
@@ -281,6 +286,7 @@ class PeerTubePlugin extends Plugin { | |||
281 | 286 | ||
282 | this.renderer = renderer | 287 | this.renderer = renderer |
283 | if (!this.player.paused()) this.player.play().then(done) | 288 | if (!this.player.paused()) this.player.play().then(done) |
289 | else done() | ||
284 | }) | 290 | }) |
285 | }) | 291 | }) |
286 | 292 | ||
@@ -349,18 +355,12 @@ class PeerTubePlugin extends Plugin { | |||
349 | const webTorrentButton = new WebTorrentButton(this.player) | 355 | const webTorrentButton = new WebTorrentButton(this.player) |
350 | controlBar.webTorrent = controlBar.el().insertBefore(webTorrentButton.el(), controlBar.progressControl.el()) | 356 | controlBar.webTorrent = controlBar.el().insertBefore(webTorrentButton.el(), controlBar.progressControl.el()) |
351 | 357 | ||
352 | if (this.player.options_.autoplay === true) { | 358 | if (this.autoplay === true) { |
353 | this.updateVideoFile() | 359 | this.updateVideoFile(undefined, () => this.player.play()) |
354 | } else { | 360 | } else { |
355 | this.player.one('play', () => { | 361 | this.player.one('play', () => { |
356 | // On firefox, we need to wait to load the video before playing | 362 | this.player.pause() |
357 | if (navigator.userAgent.toLowerCase().indexOf('firefox') !== -1) { | 363 | this.updateVideoFile(undefined, () => this.player.play()) |
358 | this.player.pause() | ||
359 | this.updateVideoFile(undefined, () => this.player.play()) | ||
360 | return | ||
361 | } | ||
362 | |||
363 | this.updateVideoFile(undefined) | ||
364 | }) | 364 | }) |
365 | } | 365 | } |
366 | } | 366 | } |
diff --git a/client/src/assets/player/video-renderer.ts b/client/src/assets/player/video-renderer.ts index 8baa42533..3cd98242d 100644 --- a/client/src/assets/player/video-renderer.ts +++ b/client/src/assets/player/video-renderer.ts | |||
@@ -43,7 +43,6 @@ function renderMedia (file, elem: HTMLVideoElement, opts: RenderMediaOptions, ca | |||
43 | prepareElem() | 43 | prepareElem() |
44 | preparedElem.addEventListener('error', fallbackToMediaSource) | 44 | preparedElem.addEventListener('error', fallbackToMediaSource) |
45 | preparedElem.addEventListener('loadstart', onLoadStart) | 45 | preparedElem.addEventListener('loadstart', onLoadStart) |
46 | preparedElem.addEventListener('canplay', onCanPlay) | ||
47 | return videostream(file, preparedElem) | 46 | return videostream(file, preparedElem) |
48 | } | 47 | } |
49 | 48 | ||
@@ -51,7 +50,6 @@ function renderMedia (file, elem: HTMLVideoElement, opts: RenderMediaOptions, ca | |||
51 | prepareElem() | 50 | prepareElem() |
52 | preparedElem.addEventListener('error', callback) | 51 | preparedElem.addEventListener('error', callback) |
53 | preparedElem.addEventListener('loadstart', onLoadStart) | 52 | preparedElem.addEventListener('loadstart', onLoadStart) |
54 | preparedElem.addEventListener('canplay', onCanPlay) | ||
55 | 53 | ||
56 | const wrapper = new MediaElementWrapper(preparedElem) | 54 | const wrapper = new MediaElementWrapper(preparedElem) |
57 | const writable = wrapper.createWriteStream(getCodec(file.name)) | 55 | const writable = wrapper.createWriteStream(getCodec(file.name)) |
@@ -64,7 +62,6 @@ function renderMedia (file, elem: HTMLVideoElement, opts: RenderMediaOptions, ca | |||
64 | 62 | ||
65 | function fallbackToMediaSource () { | 63 | function fallbackToMediaSource () { |
66 | preparedElem.removeEventListener('error', fallbackToMediaSource) | 64 | preparedElem.removeEventListener('error', fallbackToMediaSource) |
67 | preparedElem.removeEventListener('canplay', onCanPlay) | ||
68 | 65 | ||
69 | useMediaSource() | 66 | useMediaSource() |
70 | } | 67 | } |
@@ -82,10 +79,7 @@ function renderMedia (file, elem: HTMLVideoElement, opts: RenderMediaOptions, ca | |||
82 | function onLoadStart () { | 79 | function onLoadStart () { |
83 | preparedElem.removeEventListener('loadstart', onLoadStart) | 80 | preparedElem.removeEventListener('loadstart', onLoadStart) |
84 | if (opts.autoplay) preparedElem.play() | 81 | if (opts.autoplay) preparedElem.play() |
85 | } | ||
86 | 82 | ||
87 | function onCanPlay () { | ||
88 | preparedElem.removeEventListener('canplay', onCanPlay) | ||
89 | callback(null, renderer) | 83 | callback(null, renderer) |
90 | } | 84 | } |
91 | } | 85 | } |