]>
Commit | Line | Data |
---|---|---|
0629423c C |
1 | import { Component, ElementRef, OnDestroy, OnInit } from '@angular/core'; |
2 | import { ActivatedRoute } from '@angular/router'; | |
8140a704 | 3 | |
230809ef | 4 | import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe'; |
dc8bc31b | 5 | |
4a6995be | 6 | import { LoaderComponent, Video, VideoService } from '../shared'; |
d3ef341a | 7 | import { WebTorrentService } from './webtorrent.service'; |
dc8bc31b | 8 | |
dc8bc31b C |
9 | @Component({ |
10 | selector: 'my-video-watch', | |
4a6995be C |
11 | template: require('./video-watch.component.html'), |
12 | styles: [ require('./video-watch.component.scss') ], | |
d3ef341a | 13 | providers: [ WebTorrentService ], |
157cb9c9 | 14 | directives: [ LoaderComponent ], |
8cfecb2a | 15 | pipes: [ BytesPipe ] |
dc8bc31b C |
16 | }) |
17 | ||
0629423c | 18 | export class VideoWatchComponent implements OnInit, OnDestroy { |
3ad109e4 C |
19 | private static LOADTIME_TOO_LONG: number = 30000; |
20 | ||
8cfecb2a | 21 | downloadSpeed: number; |
3ad109e4 | 22 | error: boolean = false; |
da932efc | 23 | loading: boolean = false; |
4fd8aa32 C |
24 | numPeers: number; |
25 | uploadSpeed: number; | |
26 | video: Video; | |
dc8bc31b | 27 | |
3ad109e4 | 28 | private errorTimer: NodeJS.Timer; |
0629423c | 29 | private sub: any; |
3ad109e4 | 30 | private torrentInfosInterval: NodeJS.Timer; |
dc8bc31b C |
31 | |
32 | constructor( | |
4fd8aa32 | 33 | private elementRef: ElementRef, |
0629423c | 34 | private route: ActivatedRoute, |
d3ef341a C |
35 | private videoService: VideoService, |
36 | private webTorrentService: WebTorrentService | |
37 | ) {} | |
dc8bc31b | 38 | |
3ad109e4 C |
39 | loadVideo() { |
40 | // Reset the error | |
41 | this.error = false; | |
42 | // We are loading the video | |
da932efc | 43 | this.loading = true; |
3ad109e4 | 44 | |
2c4a0b5d | 45 | console.log('Adding ' + this.video.magnetUri + '.'); |
d3ef341a | 46 | |
3ad109e4 C |
47 | // The callback might never return if there are network issues |
48 | // So we create a timer to inform the user the load is abnormally long | |
49 | this.errorTimer = setTimeout(() => this.loadTooLong(), VideoWatchComponent.LOADTIME_TOO_LONG); | |
50 | ||
d3ef341a | 51 | this.webTorrentService.add(this.video.magnetUri, (torrent) => { |
3ad109e4 C |
52 | // Clear the error timer |
53 | clearTimeout(this.errorTimer); | |
54 | // Maybe the error was fired by the timer, so reset it | |
55 | this.error = false; | |
56 | ||
57 | // We are not loading the video anymore | |
da932efc | 58 | this.loading = false; |
3ad109e4 | 59 | |
2c4a0b5d | 60 | console.log('Added ' + this.video.magnetUri + '.'); |
ccf6ed16 | 61 | torrent.files[0].appendTo(this.elementRef.nativeElement.querySelector('.embed-responsive'), (err) => { |
dc8bc31b C |
62 | if (err) { |
63 | alert('Cannot append the file.'); | |
64 | console.error(err); | |
65 | } | |
44124980 | 66 | }); |
8cfecb2a C |
67 | |
68 | // Refresh each second | |
3ad109e4 | 69 | this.torrentInfosInterval = setInterval(() => { |
8cfecb2a | 70 | this.downloadSpeed = torrent.downloadSpeed; |
8cfecb2a | 71 | this.numPeers = torrent.numPeers; |
4fd8aa32 | 72 | this.uploadSpeed = torrent.uploadSpeed; |
8cfecb2a | 73 | }, 1000); |
44124980 | 74 | }); |
dc8bc31b | 75 | } |
98b01bac | 76 | |
0629423c | 77 | ngOnDestroy() { |
98b01bac | 78 | console.log('Removing video from webtorrent.'); |
3ad109e4 | 79 | clearInterval(this.torrentInfosInterval); |
d3ef341a | 80 | this.webTorrentService.remove(this.video.magnetUri); |
0629423c C |
81 | |
82 | this.sub.unsubscribe(); | |
83 | } | |
84 | ||
85 | ngOnInit() { | |
86 | this.sub = this.route.params.subscribe(routeParams => { | |
87 | let id = routeParams['id']; | |
88 | this.videoService.getVideo(id).subscribe( | |
89 | video => { | |
90 | this.video = video; | |
91 | this.loadVideo(); | |
92 | }, | |
93 | error => alert(error) | |
94 | ); | |
95 | }); | |
98b01bac | 96 | } |
3ad109e4 C |
97 | |
98 | private loadTooLong() { | |
99 | this.error = true; | |
100 | console.error('The video load seems to be abnormally long.'); | |
101 | } | |
dc8bc31b | 102 | } |