From 8cfecb2ad70062edd448b00c57db241ad3d257cc Mon Sep 17 00:00:00 2001
From: Chocobozzz <florian.bigard@gmail.com>
Date: Thu, 28 Apr 2016 20:40:56 +0200
Subject: Add torrent informations (speed...) below the video
---
.../videos/components/watch/videos-watch.component.html | 5 +++++
.../videos/components/watch/videos-watch.component.ts | 16 +++++++++++++++-
client/index.html | 5 ++++-
client/package.json | 1 +
4 files changed, 25 insertions(+), 2 deletions(-)
(limited to 'client')
diff --git a/client/angular/videos/components/watch/videos-watch.component.html b/client/angular/videos/components/watch/videos-watch.component.html
index e47222751..1ec0b1e19 100644
--- a/client/angular/videos/components/watch/videos-watch.component.html
+++ b/client/angular/videos/components/watch/videos-watch.component.html
@@ -1,2 +1,7 @@
<div class="embed-responsive embed-responsive-19by9">
</div>
+<div id="torrent-info">
+ <div>Download: {{ downloadSpeed | bytes }}/s</div>
+ <div>Upload: {{ uploadSpeed | bytes }}/s</div>
+ <div>Number of peers: {{ numPeers }}</div>
+<div>
diff --git a/client/angular/videos/components/watch/videos-watch.component.ts b/client/angular/videos/components/watch/videos-watch.component.ts
index c35c0ab19..9a8909b75 100644
--- a/client/angular/videos/components/watch/videos-watch.component.ts
+++ b/client/angular/videos/components/watch/videos-watch.component.ts
@@ -1,5 +1,6 @@
import { Component, OnInit, ElementRef } from 'angular2/core';
import { RouteParams, CanDeactivate, ComponentInstruction } from 'angular2/router';
+import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe';
// TODO import it with systemjs
declare var WebTorrent: any;
@@ -10,12 +11,17 @@ import { VideosService } from '../../services/videos.service';
@Component({
selector: 'my-video-watch',
templateUrl: 'app/angular/videos/components/watch/videos-watch.component.html',
- styleUrls: [ 'app/angular/videos/components/watch/videos-watch.component.css' ]
+ styleUrls: [ 'app/angular/videos/components/watch/videos-watch.component.css' ],
+ pipes: [ BytesPipe ]
})
export class VideosWatchComponent implements OnInit, CanDeactivate {
video: Video;
+ downloadSpeed: number;
+ uploadSpeed: number;
+ numPeers: number;
+ private _interval: number;
private client: any;
constructor(
@@ -46,11 +52,19 @@ export class VideosWatchComponent implements OnInit, CanDeactivate {
console.error(err);
}
});
+
+ // Refresh each second
+ this._interval = setInterval(() => {
+ this.downloadSpeed = torrent.downloadSpeed;
+ this.uploadSpeed = torrent.uploadSpeed;
+ this.numPeers = torrent.numPeers;
+ }, 1000);
});
}
routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) : any {
console.log('Removing video from webtorrent.');
+ clearInterval(this._interval)
this.client.remove(this.video.magnetUri);
return true;
}
diff --git a/client/index.html b/client/index.html
index 4b273aae4..6a2085ca6 100644
--- a/client/index.html
+++ b/client/index.html
@@ -31,7 +31,10 @@
format: 'register',
defaultExtension: 'js'
}
- },
+ }
+ },
+ map: {
+ 'angular-pipes/src/math/bytes.pipe': '/app/node_modules/angular-pipes/src/math/bytes.pipe.js'
}
});
System.import('/app/angular/bootstrap')
diff --git a/client/package.json b/client/package.json
index 8070881f5..d44ea8ff0 100644
--- a/client/package.json
+++ b/client/package.json
@@ -21,6 +21,7 @@
},
"license": "ISC",
"dependencies": {
+ "angular-pipes": "^1.4.1",
"angular2": "2.0.0-beta.14",
"blueimp-file-upload": "^9.12.1",
"bootstrap-sass": "^3.3.6",
--
cgit v1.2.3