Fix video play promise error on non supported browsers
This commit is contained in:
parent
8cac1b6446
commit
3bcfff7f44
4 changed files with 28 additions and 19 deletions
|
@ -1,6 +1,7 @@
|
||||||
import { Directive, EventEmitter, Input, OnInit, Output } from '@angular/core'
|
import { Directive, EventEmitter, Input, OnInit, Output } from '@angular/core'
|
||||||
import 'rxjs/add/operator/debounceTime'
|
import 'rxjs/add/operator/debounceTime'
|
||||||
import 'rxjs/add/operator/distinct'
|
import 'rxjs/add/operator/distinct'
|
||||||
|
import 'rxjs/add/operator/distinctUntilChanged'
|
||||||
import 'rxjs/add/operator/filter'
|
import 'rxjs/add/operator/filter'
|
||||||
import 'rxjs/add/operator/map'
|
import 'rxjs/add/operator/map'
|
||||||
import 'rxjs/add/operator/startWith'
|
import 'rxjs/add/operator/startWith'
|
||||||
|
|
|
@ -330,7 +330,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
|
||||||
videoFiles: this.video.files,
|
videoFiles: this.video.files,
|
||||||
playerElement: this.playerElement,
|
playerElement: this.playerElement,
|
||||||
peerTubeLink: false,
|
peerTubeLink: false,
|
||||||
videoViewUrl: this.videoService.getVideoViewUrl(this.video.uuid)
|
videoViewUrl: this.videoService.getVideoViewUrl(this.video.uuid),
|
||||||
|
videoDuration: this.video.duration
|
||||||
},
|
},
|
||||||
hotkeys: {
|
hotkeys: {
|
||||||
enableVolumeScroll: false
|
enableVolumeScroll: false
|
||||||
|
@ -350,7 +351,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
this.player.peertube().setVideoFiles(this.video.files, this.videoService.getVideoViewUrl(this.video.uuid))
|
const videoViewUrl = this.videoService.getVideoViewUrl(this.video.uuid)
|
||||||
|
this.player.peertube().setVideoFiles(this.video.files, videoViewUrl, this.video.duration)
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setVideoDescriptionHTML()
|
this.setVideoDescriptionHTML()
|
||||||
|
|
|
@ -25,6 +25,7 @@ type PeertubePluginOptions = {
|
||||||
playerElement: HTMLVideoElement
|
playerElement: HTMLVideoElement
|
||||||
peerTubeLink: boolean
|
peerTubeLink: boolean
|
||||||
videoViewUrl: string
|
videoViewUrl: string
|
||||||
|
videoDuration: number
|
||||||
}
|
}
|
||||||
|
|
||||||
// https://github.com/danrevah/ngx-pipes/blob/master/src/pipes/math/bytes.ts
|
// https://github.com/danrevah/ngx-pipes/blob/master/src/pipes/math/bytes.ts
|
||||||
|
@ -221,7 +222,9 @@ class PeerTubePlugin extends Plugin {
|
||||||
private torrent: WebTorrent.Torrent
|
private torrent: WebTorrent.Torrent
|
||||||
private autoplay = false
|
private autoplay = false
|
||||||
private videoViewUrl: string
|
private videoViewUrl: string
|
||||||
|
private videoDuration: number
|
||||||
private videoViewInterval
|
private videoViewInterval
|
||||||
|
private torrentInfoInterval
|
||||||
|
|
||||||
constructor (player: videojs.Player, options: PeertubePluginOptions) {
|
constructor (player: videojs.Player, options: PeertubePluginOptions) {
|
||||||
super(player, options)
|
super(player, options)
|
||||||
|
@ -232,6 +235,7 @@ class PeerTubePlugin extends Plugin {
|
||||||
|
|
||||||
this.videoFiles = options.videoFiles
|
this.videoFiles = options.videoFiles
|
||||||
this.videoViewUrl = options.videoViewUrl
|
this.videoViewUrl = options.videoViewUrl
|
||||||
|
this.videoDuration = options.videoDuration
|
||||||
|
|
||||||
// Hack to "simulate" src link in video.js >= 6
|
// Hack to "simulate" src link in video.js >= 6
|
||||||
// Without this, we can't play the video after pausing it
|
// Without this, we can't play the video after pausing it
|
||||||
|
@ -245,11 +249,14 @@ class PeerTubePlugin extends Plugin {
|
||||||
this.player.ready(() => {
|
this.player.ready(() => {
|
||||||
this.initializePlayer(options)
|
this.initializePlayer(options)
|
||||||
this.runTorrentInfoScheduler()
|
this.runTorrentInfoScheduler()
|
||||||
this.prepareRunViewAdd()
|
this.runViewAdd()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
dispose () {
|
dispose () {
|
||||||
|
clearInterval(this.videoViewInterval)
|
||||||
|
clearInterval(this.torrentInfoInterval)
|
||||||
|
|
||||||
// Don't need to destroy renderer, video player will be destroyed
|
// Don't need to destroy renderer, video player will be destroyed
|
||||||
this.flushVideoFile(this.currentVideoFile, false)
|
this.flushVideoFile(this.currentVideoFile, false)
|
||||||
}
|
}
|
||||||
|
@ -291,8 +298,14 @@ class PeerTubePlugin extends Plugin {
|
||||||
if (err) return this.handleError(err)
|
if (err) return this.handleError(err)
|
||||||
|
|
||||||
this.renderer = renderer
|
this.renderer = renderer
|
||||||
if (!this.player.paused()) this.player.play().then(done)
|
if (!this.player.paused()) {
|
||||||
else done()
|
const playPromise = this.player.play()
|
||||||
|
if (playPromise !== undefined) return playPromise.then(done)
|
||||||
|
|
||||||
|
return done()
|
||||||
|
}
|
||||||
|
|
||||||
|
return done()
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -340,12 +353,13 @@ class PeerTubePlugin extends Plugin {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
setVideoFiles (files: VideoFile[], videoViewUrl: string) {
|
setVideoFiles (files: VideoFile[], videoViewUrl: string, videoDuration: number) {
|
||||||
this.videoViewUrl = videoViewUrl
|
this.videoViewUrl = videoViewUrl
|
||||||
|
this.videoDuration = videoDuration
|
||||||
this.videoFiles = files
|
this.videoFiles = files
|
||||||
|
|
||||||
// Re run view add for the new video
|
// Re run view add for the new video
|
||||||
this.prepareRunViewAdd()
|
this.runViewAdd()
|
||||||
this.updateVideoFile(undefined, () => this.player.play())
|
this.updateVideoFile(undefined, () => this.player.play())
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -375,7 +389,7 @@ class PeerTubePlugin extends Plugin {
|
||||||
}
|
}
|
||||||
|
|
||||||
private runTorrentInfoScheduler () {
|
private runTorrentInfoScheduler () {
|
||||||
setInterval(() => {
|
this.torrentInfoInterval = setInterval(() => {
|
||||||
if (this.torrent !== undefined) {
|
if (this.torrent !== undefined) {
|
||||||
this.trigger('torrentInfo', {
|
this.trigger('torrentInfo', {
|
||||||
downloadSpeed: this.torrent.downloadSpeed,
|
downloadSpeed: this.torrent.downloadSpeed,
|
||||||
|
@ -386,22 +400,13 @@ class PeerTubePlugin extends Plugin {
|
||||||
}, 1000)
|
}, 1000)
|
||||||
}
|
}
|
||||||
|
|
||||||
private prepareRunViewAdd () {
|
|
||||||
if (this.player.readyState() < 1) {
|
|
||||||
return this.player.one('loadedmetadata', () => this.runViewAdd())
|
|
||||||
}
|
|
||||||
|
|
||||||
this.runViewAdd()
|
|
||||||
}
|
|
||||||
|
|
||||||
private runViewAdd () {
|
private runViewAdd () {
|
||||||
this.clearVideoViewInterval()
|
this.clearVideoViewInterval()
|
||||||
|
|
||||||
// After 30 seconds (or 3/4 of the video), add a view to the video
|
// After 30 seconds (or 3/4 of the video), add a view to the video
|
||||||
let minSecondsToView = 30
|
let minSecondsToView = 30
|
||||||
|
|
||||||
const duration = this.player.duration()
|
if (this.videoDuration < minSecondsToView) minSecondsToView = (this.videoDuration * 3) / 4
|
||||||
if (duration < minSecondsToView) minSecondsToView = (duration * 3) / 4
|
|
||||||
|
|
||||||
let secondsViewed = 0
|
let secondsViewed = 0
|
||||||
this.videoViewInterval = setInterval(() => {
|
this.videoViewInterval = setInterval(() => {
|
||||||
|
|
|
@ -32,7 +32,8 @@ loadVideoInfo(videoId)
|
||||||
videoFiles: videoInfo.files,
|
videoFiles: videoInfo.files,
|
||||||
playerElement: videoElement,
|
playerElement: videoElement,
|
||||||
peerTubeLink: true,
|
peerTubeLink: true,
|
||||||
videoViewUrl: getVideoUrl(videoId) + '/views'
|
videoViewUrl: getVideoUrl(videoId) + '/views',
|
||||||
|
videoDuration: videoInfo.duration
|
||||||
},
|
},
|
||||||
hotkeys: {
|
hotkeys: {
|
||||||
enableVolumeScroll: false
|
enableVolumeScroll: false
|
||||||
|
|
Loading…
Reference in a new issue