X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2Fvideo-watch%2Fvideo-watch.component.ts;h=2a60e932770be3903495644004ae0ed518df48a7;hb=ab32b0fc805b92c5a1d7ac5901cb1a38e94622ca;hp=05e844f60e5be0569ade01a93de61400c85e2a5a;hpb=3ad109e44916e82709ac0016f1f9c31c860299c9;p=github%2FChocobozzz%2FPeerTube.git

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 05e844f60..2a60e9327 100644
--- a/client/src/app/videos/video-watch/video-watch.component.ts
+++ b/client/src/app/videos/video-watch/video-watch.component.ts
@@ -1,21 +1,16 @@
-import { Component, ElementRef, OnInit } from '@angular/core';
-import { CanDeactivate, ComponentInstruction, RouteParams } from '@angular/router-deprecated';
+import { Component, ElementRef, NgZone, OnDestroy, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
 
-import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe';
-
-import { LoaderComponent, Video, VideoService } from '../shared';
+import { Video, VideoService } from '../shared';
 import { WebTorrentService } from './webtorrent.service';
 
 @Component({
   selector: 'my-video-watch',
   template: require('./video-watch.component.html'),
-  styles: [ require('./video-watch.component.scss') ],
-  providers: [ WebTorrentService ],
-  directives: [ LoaderComponent ],
-  pipes: [ BytesPipe ]
+  styles: [ require('./video-watch.component.scss') ]
 })
 
-export class VideoWatchComponent implements OnInit, CanDeactivate {
+export class VideoWatchComponent implements OnInit, OnDestroy {
   private static LOADTIME_TOO_LONG: number = 30000;
 
   downloadSpeed: number;
@@ -26,11 +21,13 @@ export class VideoWatchComponent implements OnInit, CanDeactivate {
   video: Video;
 
   private errorTimer: NodeJS.Timer;
+  private sub: any;
   private torrentInfosInterval: NodeJS.Timer;
 
   constructor(
     private elementRef: ElementRef,
-    private routeParams: RouteParams,
+    private ngZone: NgZone,
+    private route: ActivatedRoute,
     private videoService: VideoService,
     private webTorrentService: WebTorrentService
   ) {}
@@ -64,35 +61,44 @@ export class VideoWatchComponent implements OnInit, CanDeactivate {
         }
       });
 
-      // Refresh each second
-      this.torrentInfosInterval = setInterval(() => {
-        this.downloadSpeed = torrent.downloadSpeed;
-        this.numPeers = torrent.numPeers;
-        this.uploadSpeed = torrent.uploadSpeed;
-      }, 1000);
+      this.runInProgress(torrent);
     });
   }
 
-  ngOnInit() {
-    let id = this.routeParams.get('id');
-    this.videoService.getVideo(id).subscribe(
-      video => {
-        this.video = video;
-        this.loadVideo();
-      },
-      error => alert(error)
-    );
-  }
-
-  routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
+  ngOnDestroy() {
     console.log('Removing video from webtorrent.');
     clearInterval(this.torrentInfosInterval);
     this.webTorrentService.remove(this.video.magnetUri);
-    return true;
+
+    this.sub.unsubscribe();
+  }
+
+  ngOnInit() {
+    this.sub = this.route.params.subscribe(routeParams => {
+      let id = routeParams['id'];
+      this.videoService.getVideo(id).subscribe(
+        video => {
+          this.video = video;
+          this.loadVideo();
+        },
+        error => alert(error.text)
+      );
+    });
   }
 
   private loadTooLong() {
     this.error = true;
     console.error('The video load seems to be abnormally long.');
   }
+
+  private runInProgress(torrent: any) {
+    // Refresh each second
+    this.torrentInfosInterval = setInterval(() => {
+      this.ngZone.run(() => {
+        this.downloadSpeed = torrent.downloadSpeed;
+        this.numPeers = torrent.numPeers;
+        this.uploadSpeed = torrent.uploadSpeed;
+      });
+    }, 1000);
+  }
 }