aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-06-07 14:58:41 +0200
committerChocobozzz <me@florianbigard.com>2018-06-07 14:58:41 +0200
commit3baf9be283d75cddc8aab918e6d6557371fbd9e9 (patch)
tree8c783b1d0cf842687b42b5363a497880a1addc24 /client/src
parent734a5ceb3d04088743d72babcb9b05e6142043f6 (diff)
downloadPeerTube-3baf9be283d75cddc8aab918e6d6557371fbd9e9.tar.gz
PeerTube-3baf9be283d75cddc8aab918e6d6557371fbd9e9.tar.zst
PeerTube-3baf9be283d75cddc8aab918e6d6557371fbd9e9.zip
Fix player resolution change that plays even if the video was paused
Diffstat (limited to 'client/src')
-rw-r--r--client/src/app/+accounts/accounts.component.ts4
-rw-r--r--client/src/assets/player/peertube-videojs-plugin.ts63
2 files changed, 44 insertions, 23 deletions
diff --git a/client/src/app/+accounts/accounts.component.ts b/client/src/app/+accounts/accounts.component.ts
index 2a6856c10..af0451e91 100644
--- a/client/src/app/+accounts/accounts.component.ts
+++ b/client/src/app/+accounts/accounts.component.ts
@@ -1,4 +1,4 @@
1import { Component, OnInit } from '@angular/core' 1import { Component, OnInit, OnDestroy } from '@angular/core'
2import { ActivatedRoute } from '@angular/router' 2import { ActivatedRoute } from '@angular/router'
3import { AccountService } from '@app/shared/account/account.service' 3import { AccountService } from '@app/shared/account/account.service'
4import { Account } from '@app/shared/account/account.model' 4import { Account } from '@app/shared/account/account.model'
@@ -10,7 +10,7 @@ import { Subscription } from 'rxjs'
10 templateUrl: './accounts.component.html', 10 templateUrl: './accounts.component.html',
11 styleUrls: [ './accounts.component.scss' ] 11 styleUrls: [ './accounts.component.scss' ]
12}) 12})
13export class AccountsComponent implements OnInit { 13export class AccountsComponent implements OnInit, OnDestroy {
14 account: Account 14 account: Account
15 15
16 private routeSub: Subscription 16 private routeSub: Subscription
diff --git a/client/src/assets/player/peertube-videojs-plugin.ts b/client/src/assets/player/peertube-videojs-plugin.ts
index 68e98f170..9babe556a 100644
--- a/client/src/assets/player/peertube-videojs-plugin.ts
+++ b/client/src/assets/player/peertube-videojs-plugin.ts
@@ -126,11 +126,15 @@ class PeerTubePlugin extends Plugin {
126 return this.currentVideoFile ? this.currentVideoFile.resolution.label : '' 126 return this.currentVideoFile ? this.currentVideoFile.resolution.label : ''
127 } 127 }
128 128
129 updateVideoFile (videoFile?: VideoFile, delay = 0, done?: () => void) { 129 updateVideoFile (
130 if (done === undefined) { 130 videoFile?: VideoFile,
131 done = () => { /* empty */ } 131 options: {
132 } 132 forcePlay?: boolean,
133 133 seek?: number,
134 delay?: number
135 } = {},
136 done: () => void = () => { /* empty */ }
137 ) {
134 // Automatically choose the adapted video file 138 // Automatically choose the adapted video file
135 if (videoFile === undefined) { 139 if (videoFile === undefined) {
136 const savedAverageBandwidth = getAverageBandwidth() 140 const savedAverageBandwidth = getAverageBandwidth()
@@ -153,7 +157,7 @@ class PeerTubePlugin extends Plugin {
153 const previousVideoFile = this.currentVideoFile 157 const previousVideoFile = this.currentVideoFile
154 this.currentVideoFile = videoFile 158 this.currentVideoFile = videoFile
155 159
156 this.addTorrent(this.currentVideoFile.magnetUri, previousVideoFile, delay, () => { 160 this.addTorrent(this.currentVideoFile.magnetUri, previousVideoFile, options, () => {
157 this.player.playbackRate(oldPlaybackRate) 161 this.player.playbackRate(oldPlaybackRate)
158 return done() 162 return done()
159 }) 163 })
@@ -161,17 +165,26 @@ class PeerTubePlugin extends Plugin {
161 this.trigger('videoFileUpdate') 165 this.trigger('videoFileUpdate')
162 } 166 }
163 167
164 addTorrent (magnetOrTorrentUrl: string, previousVideoFile: VideoFile, delay = 0, done: Function) { 168 addTorrent (
169 magnetOrTorrentUrl: string,
170 previousVideoFile: VideoFile,
171 options: {
172 forcePlay?: boolean,
173 seek?: number,
174 delay?: number
175 },
176 done: Function
177 ) {
165 console.log('Adding ' + magnetOrTorrentUrl + '.') 178 console.log('Adding ' + magnetOrTorrentUrl + '.')
166 179
167 const oldTorrent = this.torrent 180 const oldTorrent = this.torrent
168 const options = { 181 const torrentOptions = {
169 store: (chunkLength, storeOpts) => new CacheChunkStore(new PeertubeChunkStore(chunkLength, storeOpts), { 182 store: (chunkLength, storeOpts) => new CacheChunkStore(new PeertubeChunkStore(chunkLength, storeOpts), {
170 max: 100 183 max: 100
171 }) 184 })
172 } 185 }
173 186
174 this.torrent = webtorrent.add(magnetOrTorrentUrl, options, torrent => { 187 this.torrent = webtorrent.add(magnetOrTorrentUrl, torrentOptions, torrent => {
175 console.log('Added ' + magnetOrTorrentUrl + '.') 188 console.log('Added ' + magnetOrTorrentUrl + '.')
176 189
177 // Pause the old torrent 190 // Pause the old torrent
@@ -183,19 +196,24 @@ class PeerTubePlugin extends Plugin {
183 196
184 // Render the video in a few seconds? (on resolution change for example, we wait some seconds of the new video resolution) 197 // Render the video in a few seconds? (on resolution change for example, we wait some seconds of the new video resolution)
185 this.addTorrentDelay = setTimeout(() => { 198 this.addTorrentDelay = setTimeout(() => {
199 const paused = this.player.paused()
200
186 this.flushVideoFile(previousVideoFile) 201 this.flushVideoFile(previousVideoFile)
187 202
188 const options = { autoplay: true, controls: true } 203 const renderVideoOptions = { autoplay: false, controls: true }
189 renderVideo(torrent.files[0], this.playerElement, options,(err, renderer) => { 204 renderVideo(torrent.files[0], this.playerElement, renderVideoOptions,(err, renderer) => {
190 this.renderer = renderer 205 this.renderer = renderer
191 206
192 if (err) return this.fallbackToHttp(done) 207 if (err) return this.fallbackToHttp(done)
193 208
194 if (!this.player.paused()) return this.tryToPlay(done) 209 return this.tryToPlay(err => {
210 if (err) return done(err)
195 211
196 return done() 212 if (options.seek) this.seek(options.seek)
213 if (options.forcePlay === false && paused === true) this.player.pause()
214 })
197 }) 215 })
198 }, delay) 216 }, options.delay || 0)
199 }) 217 })
200 218
201 this.torrent.on('error', err => this.handleError(err)) 219 this.torrent.on('error', err => this.handleError(err))
@@ -213,7 +231,8 @@ class PeerTubePlugin extends Plugin {
213 // Magnet hash is not up to date with the torrent file, add directly the torrent file 231 // Magnet hash is not up to date with the torrent file, add directly the torrent file
214 if (err.message.indexOf('incorrect info hash') !== -1) { 232 if (err.message.indexOf('incorrect info hash') !== -1) {
215 console.error('Incorrect info hash detected, falling back to torrent file.') 233 console.error('Incorrect info hash detected, falling back to torrent file.')
216 return this.addTorrent(this.torrent['xs'], previousVideoFile, 0, done) 234 const options = { forcePlay: true }
235 return this.addTorrent(this.torrent['xs'], previousVideoFile, options, done)
217 } 236 }
218 237
219 return this.handleError(err) 238 return this.handleError(err)
@@ -234,7 +253,12 @@ class PeerTubePlugin extends Plugin {
234 } 253 }
235 254
236 const newVideoFile = this.videoFiles.find(f => f.resolution.id === resolutionId) 255 const newVideoFile = this.videoFiles.find(f => f.resolution.id === resolutionId)
237 this.updateVideoFile(newVideoFile, delay, () => this.seek(currentTime)) 256 const options = {
257 forcePlay: false,
258 delay,
259 seek: currentTime
260 }
261 this.updateVideoFile(newVideoFile, options)
238 } 262 }
239 263
240 flushVideoFile (videoFile: VideoFile, destroyRenderer = true) { 264 flushVideoFile (videoFile: VideoFile, destroyRenderer = true) {
@@ -342,10 +366,7 @@ class PeerTubePlugin extends Plugin {
342 if (this.autoplay === true) { 366 if (this.autoplay === true) {
343 this.player.posterImage.hide() 367 this.player.posterImage.hide()
344 368
345 this.updateVideoFile(undefined, 0, () => { 369 this.updateVideoFile(undefined, { forcePlay: true, seek: this.startTime })
346 this.seek(this.startTime)
347 this.tryToPlay()
348 })
349 } else { 370 } else {
350 // Don't try on iOS that does not support MediaSource 371 // Don't try on iOS that does not support MediaSource
351 if (this.isIOS()) { 372 if (this.isIOS()) {
@@ -359,7 +380,7 @@ class PeerTubePlugin extends Plugin {
359 this.player.addClass('vjs-has-big-play-button-clicked') 380 this.player.addClass('vjs-has-big-play-button-clicked')
360 this.player.play = oldPlay 381 this.player.play = oldPlay
361 382
362 this.updateVideoFile(undefined, 0, () => this.seek(this.startTime)) 383 this.updateVideoFile(undefined, { forcePlay: true, seek: this.startTime })
363 } 384 }
364 } 385 }
365 } 386 }