aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-02-14 17:20:39 +0100
committerChocobozzz <me@florianbigard.com>2018-02-14 18:04:30 +0100
commit3bcfff7f446d0a1d8ef5adf340375e178259a42c (patch)
tree7dc09e67525babb81c9d5d9e8ae3b034fdab0b6d /client
parent8cac1b6446a97b16387c9590ce5c799a79a759fa (diff)
downloadPeerTube-3bcfff7f446d0a1d8ef5adf340375e178259a42c.tar.gz
PeerTube-3bcfff7f446d0a1d8ef5adf340375e178259a42c.tar.zst
PeerTube-3bcfff7f446d0a1d8ef5adf340375e178259a42c.zip
Fix video play promise error on non supported browsers
Diffstat (limited to 'client')
-rw-r--r--client/src/app/shared/video/infinite-scroller.directive.ts1
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.ts6
-rw-r--r--client/src/assets/player/peertube-videojs-plugin.ts37
-rw-r--r--client/src/standalone/videos/embed.ts3
4 files changed, 28 insertions, 19 deletions
diff --git a/client/src/app/shared/video/infinite-scroller.directive.ts b/client/src/app/shared/video/infinite-scroller.directive.ts
index 52d8b2b37..1da02f60f 100644
--- a/client/src/app/shared/video/infinite-scroller.directive.ts
+++ b/client/src/app/shared/video/infinite-scroller.directive.ts
@@ -1,6 +1,7 @@
1import { Directive, EventEmitter, Input, OnInit, Output } from '@angular/core' 1import { Directive, EventEmitter, Input, OnInit, Output } from '@angular/core'
2import 'rxjs/add/operator/debounceTime' 2import 'rxjs/add/operator/debounceTime'
3import 'rxjs/add/operator/distinct' 3import 'rxjs/add/operator/distinct'
4import 'rxjs/add/operator/distinctUntilChanged'
4import 'rxjs/add/operator/filter' 5import 'rxjs/add/operator/filter'
5import 'rxjs/add/operator/map' 6import 'rxjs/add/operator/map'
6import 'rxjs/add/operator/startWith' 7import 'rxjs/add/operator/startWith'
diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts
index b7779ae9a..7a64406e6 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -330,7 +330,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
330 videoFiles: this.video.files, 330 videoFiles: this.video.files,
331 playerElement: this.playerElement, 331 playerElement: this.playerElement,
332 peerTubeLink: false, 332 peerTubeLink: false,
333 videoViewUrl: this.videoService.getVideoViewUrl(this.video.uuid) 333 videoViewUrl: this.videoService.getVideoViewUrl(this.video.uuid),
334 videoDuration: this.video.duration
334 }, 335 },
335 hotkeys: { 336 hotkeys: {
336 enableVolumeScroll: false 337 enableVolumeScroll: false
@@ -350,7 +351,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
350 }) 351 })
351 }) 352 })
352 } else { 353 } else {
353 this.player.peertube().setVideoFiles(this.video.files, this.videoService.getVideoViewUrl(this.video.uuid)) 354 const videoViewUrl = this.videoService.getVideoViewUrl(this.video.uuid)
355 this.player.peertube().setVideoFiles(this.video.files, videoViewUrl, this.video.duration)
354 } 356 }
355 357
356 this.setVideoDescriptionHTML() 358 this.setVideoDescriptionHTML()
diff --git a/client/src/assets/player/peertube-videojs-plugin.ts b/client/src/assets/player/peertube-videojs-plugin.ts
index fecd4edec..01a630cb6 100644
--- a/client/src/assets/player/peertube-videojs-plugin.ts
+++ b/client/src/assets/player/peertube-videojs-plugin.ts
@@ -25,6 +25,7 @@ type PeertubePluginOptions = {
25 playerElement: HTMLVideoElement 25 playerElement: HTMLVideoElement
26 peerTubeLink: boolean 26 peerTubeLink: boolean
27 videoViewUrl: string 27 videoViewUrl: string
28 videoDuration: number
28} 29}
29 30
30// https://github.com/danrevah/ngx-pipes/blob/master/src/pipes/math/bytes.ts 31// https://github.com/danrevah/ngx-pipes/blob/master/src/pipes/math/bytes.ts
@@ -221,7 +222,9 @@ class PeerTubePlugin extends Plugin {
221 private torrent: WebTorrent.Torrent 222 private torrent: WebTorrent.Torrent
222 private autoplay = false 223 private autoplay = false
223 private videoViewUrl: string 224 private videoViewUrl: string
225 private videoDuration: number
224 private videoViewInterval 226 private videoViewInterval
227 private torrentInfoInterval
225 228
226 constructor (player: videojs.Player, options: PeertubePluginOptions) { 229 constructor (player: videojs.Player, options: PeertubePluginOptions) {
227 super(player, options) 230 super(player, options)
@@ -232,6 +235,7 @@ class PeerTubePlugin extends Plugin {
232 235
233 this.videoFiles = options.videoFiles 236 this.videoFiles = options.videoFiles
234 this.videoViewUrl = options.videoViewUrl 237 this.videoViewUrl = options.videoViewUrl
238 this.videoDuration = options.videoDuration
235 239
236 // Hack to "simulate" src link in video.js >= 6 240 // Hack to "simulate" src link in video.js >= 6
237 // Without this, we can't play the video after pausing it 241 // Without this, we can't play the video after pausing it
@@ -245,11 +249,14 @@ class PeerTubePlugin extends Plugin {
245 this.player.ready(() => { 249 this.player.ready(() => {
246 this.initializePlayer(options) 250 this.initializePlayer(options)
247 this.runTorrentInfoScheduler() 251 this.runTorrentInfoScheduler()
248 this.prepareRunViewAdd() 252 this.runViewAdd()
249 }) 253 })
250 } 254 }
251 255
252 dispose () { 256 dispose () {
257 clearInterval(this.videoViewInterval)
258 clearInterval(this.torrentInfoInterval)
259
253 // Don't need to destroy renderer, video player will be destroyed 260 // Don't need to destroy renderer, video player will be destroyed
254 this.flushVideoFile(this.currentVideoFile, false) 261 this.flushVideoFile(this.currentVideoFile, false)
255 } 262 }
@@ -291,8 +298,14 @@ class PeerTubePlugin extends Plugin {
291 if (err) return this.handleError(err) 298 if (err) return this.handleError(err)
292 299
293 this.renderer = renderer 300 this.renderer = renderer
294 if (!this.player.paused()) this.player.play().then(done) 301 if (!this.player.paused()) {
295 else done() 302 const playPromise = this.player.play()
303 if (playPromise !== undefined) return playPromise.then(done)
304
305 return done()
306 }
307
308 return done()
296 }) 309 })
297 }) 310 })
298 311
@@ -340,12 +353,13 @@ class PeerTubePlugin extends Plugin {
340 } 353 }
341 } 354 }
342 355
343 setVideoFiles (files: VideoFile[], videoViewUrl: string) { 356 setVideoFiles (files: VideoFile[], videoViewUrl: string, videoDuration: number) {
344 this.videoViewUrl = videoViewUrl 357 this.videoViewUrl = videoViewUrl
358 this.videoDuration = videoDuration
345 this.videoFiles = files 359 this.videoFiles = files
346 360
347 // Re run view add for the new video 361 // Re run view add for the new video
348 this.prepareRunViewAdd() 362 this.runViewAdd()
349 this.updateVideoFile(undefined, () => this.player.play()) 363 this.updateVideoFile(undefined, () => this.player.play())
350 } 364 }
351 365
@@ -375,7 +389,7 @@ class PeerTubePlugin extends Plugin {
375 } 389 }
376 390
377 private runTorrentInfoScheduler () { 391 private runTorrentInfoScheduler () {
378 setInterval(() => { 392 this.torrentInfoInterval = setInterval(() => {
379 if (this.torrent !== undefined) { 393 if (this.torrent !== undefined) {
380 this.trigger('torrentInfo', { 394 this.trigger('torrentInfo', {
381 downloadSpeed: this.torrent.downloadSpeed, 395 downloadSpeed: this.torrent.downloadSpeed,
@@ -386,22 +400,13 @@ class PeerTubePlugin extends Plugin {
386 }, 1000) 400 }, 1000)
387 } 401 }
388 402
389 private prepareRunViewAdd () {
390 if (this.player.readyState() < 1) {
391 return this.player.one('loadedmetadata', () => this.runViewAdd())
392 }
393
394 this.runViewAdd()
395 }
396
397 private runViewAdd () { 403 private runViewAdd () {
398 this.clearVideoViewInterval() 404 this.clearVideoViewInterval()
399 405
400 // After 30 seconds (or 3/4 of the video), add a view to the video 406 // After 30 seconds (or 3/4 of the video), add a view to the video
401 let minSecondsToView = 30 407 let minSecondsToView = 30
402 408
403 const duration = this.player.duration() 409 if (this.videoDuration < minSecondsToView) minSecondsToView = (this.videoDuration * 3) / 4
404 if (duration < minSecondsToView) minSecondsToView = (duration * 3) / 4
405 410
406 let secondsViewed = 0 411 let secondsViewed = 0
407 this.videoViewInterval = setInterval(() => { 412 this.videoViewInterval = setInterval(() => {
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index 9076f1dc9..da935ef4c 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -32,7 +32,8 @@ loadVideoInfo(videoId)
32 videoFiles: videoInfo.files, 32 videoFiles: videoInfo.files,
33 playerElement: videoElement, 33 playerElement: videoElement,
34 peerTubeLink: true, 34 peerTubeLink: true,
35 videoViewUrl: getVideoUrl(videoId) + '/views' 35 videoViewUrl: getVideoUrl(videoId) + '/views',
36 videoDuration: videoInfo.duration
36 }, 37 },
37 hotkeys: { 38 hotkeys: {
38 enableVolumeScroll: false 39 enableVolumeScroll: false