1 import { Component, OnInit, ElementRef } from 'angular2/core';
2 import { RouteParams, CanDeactivate, ComponentInstruction } from 'angular2/router';
3 import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe';
5 // TODO import it with systemjs
6 declare var WebTorrent: any;
8 import { Video } from '../../models/video';
9 import { VideosService } from '../../services/videos.service';
12 selector: 'my-video-watch',
13 templateUrl: 'app/angular/videos/components/watch/videos-watch.component.html',
14 styleUrls: [ 'app/angular/videos/components/watch/videos-watch.component.css' ],
18 export class VideosWatchComponent implements OnInit, CanDeactivate {
20 downloadSpeed: number;
24 private _interval: number;
28 private _videosService: VideosService,
29 private _routeParams: RouteParams,
30 private _elementRef: ElementRef
32 // TODO: use a service
33 this.client = new WebTorrent({ dht: false });
37 let id = this._routeParams.get('id');
38 this._videosService.getVideo(id).subscribe(
39 video => this.loadVideo(video),
44 loadVideo(video: Video) {
46 console.log('Adding ' + this.video.magnetUri + '.');
47 this.client.add(this.video.magnetUri, (torrent) => {
48 console.log('Added ' + this.video.magnetUri + '.');
49 torrent.files[0].appendTo(this._elementRef.nativeElement.querySelector('.embed-responsive'), (err) => {
51 alert('Cannot append the file.');
56 // Refresh each second
57 this._interval = setInterval(() => {
58 this.downloadSpeed = torrent.downloadSpeed;
59 this.uploadSpeed = torrent.uploadSpeed;
60 this.numPeers = torrent.numPeers;
65 routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) : any {
66 console.log('Removing video from webtorrent.');
67 clearInterval(this._interval);
68 this.client.remove(this.video.magnetUri);