Fix changing video we are watching

client/src/app/videos/+video-watch/video-watch.component.ts

@@ -69,6 +69,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
       )
 
     this.paramsSub = this.route.params.subscribe(routeParams => {
+      if (this.videoPlayerLoaded) {
+        this.player.pause()
+      }
+
       let uuid = routeParams['uuid']
       this.videoService.getVideo(uuid).subscribe(
         video => this.onVideoFetched(video),
@@ -276,6 +280,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
           return this.router.navigate([ '/videos/list' ])
         }
 
+        // Player was already loaded
+        if (this.videoPlayerLoaded !== true) {
           this.playerElement = this.elementRef.nativeElement.querySelector('#video-element')
 
           const videojsOptions = {
@@ -300,6 +306,9 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
               self.handleError(data.err)
             })
           })
+        } else {
+          (this.player as any).setVideoFiles(this.video.files)
+        }
 
         this.setVideoDescriptionHTML()
 

client/src/assets/player/peertube-videojs-plugin.ts

@@ -283,6 +283,12 @@ const peertubePlugin = function (options: PeertubePluginOptions) {
     }
   }
 
+  player.setVideoFiles = function (files: VideoFile[]) {
+    player.videoFiles = files
+
+    player.updateVideoFile(undefined, () => player.play())
+  }
+
   player.ready(function () {
     const controlBar = player.controlBar