aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/app/videos
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2016-05-27 17:49:18 +0200
committerChocobozzz <florian.bigard@gmail.com>2016-05-27 17:49:18 +0200
commit4fd8aa327004b27530fd96bdde5df60e6745a1f6 (patch)
treee3b21282c641d50ea62e227c6ce3e7e740fec860 /client/app/videos
parentccf6ed16f1eeb05b77103bd44bc06ccbbbba9bdd (diff)
downloadPeerTube-4fd8aa327004b27530fd96bdde5df60e6745a1f6.tar.gz
PeerTube-4fd8aa327004b27530fd96bdde5df60e6745a1f6.tar.zst
PeerTube-4fd8aa327004b27530fd96bdde5df60e6745a1f6.zip
Alphabetical
Diffstat (limited to 'client/app/videos')
-rw-r--r--client/app/videos/shared/video.model.ts59
-rw-r--r--client/app/videos/shared/video.service.ts39
-rw-r--r--client/app/videos/video-add/video-add.component.ts21
-rw-r--r--client/app/videos/video-list/video-list.component.ts13
-rw-r--r--client/app/videos/video-list/video-miniature.component.ts10
-rw-r--r--client/app/videos/video-watch/video-watch.component.ts30
6 files changed, 89 insertions, 83 deletions
diff --git a/client/app/videos/shared/video.model.ts b/client/app/videos/shared/video.model.ts
index 2b018ad86..614403d79 100644
--- a/client/app/videos/shared/video.model.ts
+++ b/client/app/videos/shared/video.model.ts
@@ -1,24 +1,15 @@
1export class Video { 1export class Video {
2 id: string; 2 author: string;
3 name: string; 3 by: string;
4 createdDate: Date;
4 description: string; 5 description: string;
6 duration: string;
7 id: string;
8 isLocal: boolean;
5 magnetUri: string; 9 magnetUri: string;
10 name: string;
6 podUrl: string; 11 podUrl: string;
7 isLocal: boolean;
8 thumbnailPath: string; 12 thumbnailPath: string;
9 author: string;
10 createdDate: Date;
11 by: string;
12 duration: string;
13
14 private static createDurationString(duration: number) {
15 const minutes = Math.floor(duration / 60);
16 const seconds = duration % 60;
17 const minutes_padding = minutes >= 10 ? '' : '0';
18 const seconds_padding = seconds >= 10 ? '' : '0';
19
20 return minutes_padding + minutes.toString() + ':' + seconds_padding + seconds.toString();
21 }
22 13
23 private static createByString(author: string, podUrl: string) { 14 private static createByString(author: string, podUrl: string) {
24 let [ host, port ] = podUrl.replace(/^https?:\/\//, '').split(':'); 15 let [ host, port ] = podUrl.replace(/^https?:\/\//, '').split(':');
@@ -32,28 +23,38 @@ export class Video {
32 return author + '@' + host + port; 23 return author + '@' + host + port;
33 } 24 }
34 25
26 private static createDurationString(duration: number) {
27 const minutes = Math.floor(duration / 60);
28 const seconds = duration % 60;
29 const minutes_padding = minutes >= 10 ? '' : '0';
30 const seconds_padding = seconds >= 10 ? '' : '0';
31
32 return minutes_padding + minutes.toString() + ':' + seconds_padding + seconds.toString();
33 }
34
35 constructor(hash: { 35 constructor(hash: {
36 id: string,
37 name: string,
38 description: string,
39 magnetUri: string,
40 podUrl: string,
41 isLocal: boolean,
42 thumbnailPath: string,
43 author: string, 36 author: string,
44 createdDate: string, 37 createdDate: string,
38 description: string,
45 duration: number; 39 duration: number;
40 id: string,
41 isLocal: boolean,
42 magnetUri: string,
43 name: string,
44 podUrl: string,
45 thumbnailPath: string
46 }) { 46 }) {
47 this.id = hash.id; 47 this.author = hash.author;
48 this.name = hash.name; 48 this.createdDate = new Date(hash.createdDate);
49 this.description = hash.description; 49 this.description = hash.description;
50 this.duration = Video.createDurationString(hash.duration);
51 this.id = hash.id;
52 this.isLocal = hash.isLocal;
50 this.magnetUri = hash.magnetUri; 53 this.magnetUri = hash.magnetUri;
54 this.name = hash.name;
51 this.podUrl = hash.podUrl; 55 this.podUrl = hash.podUrl;
52 this.isLocal = hash.isLocal;
53 this.thumbnailPath = hash.thumbnailPath; 56 this.thumbnailPath = hash.thumbnailPath;
54 this.author = hash.author; 57
55 this.createdDate = new Date(hash.createdDate);
56 this.duration = Video.createDurationString(hash.duration);
57 this.by = Video.createByString(hash.author, hash.podUrl); 58 this.by = Video.createByString(hash.author, hash.podUrl);
58 } 59 }
59 60
diff --git a/client/app/videos/shared/video.service.ts b/client/app/videos/shared/video.service.ts
index b6e0800a0..7b6519f00 100644
--- a/client/app/videos/shared/video.service.ts
+++ b/client/app/videos/shared/video.service.ts
@@ -12,7 +12,16 @@ import { Video } from './video.model';
12export class VideoService { 12export class VideoService {
13 private static BASE_VIDEO_URL = '/api/v1/videos/'; 13 private static BASE_VIDEO_URL = '/api/v1/videos/';
14 14
15 constructor(private http: Http, private authService: AuthService) {} 15 constructor(
16 private authService: AuthService,
17 private http: Http
18 ) {}
19
20 getVideo(id: string) {
21 return this.http.get(VideoService.BASE_VIDEO_URL + id)
22 .map(res => <Video> res.json())
23 .catch(this.handleError);
24 }
16 25
17 getVideos(pagination: Pagination, sort: SortField) { 26 getVideos(pagination: Pagination, sort: SortField) {
18 const params = this.createPaginationParams(pagination); 27 const params = this.createPaginationParams(pagination);
@@ -25,12 +34,6 @@ export class VideoService {
25 .catch(this.handleError); 34 .catch(this.handleError);
26 } 35 }
27 36
28 getVideo(id: string) {
29 return this.http.get(VideoService.BASE_VIDEO_URL + id)
30 .map(res => <Video> res.json())
31 .catch(this.handleError);
32 }
33
34 removeVideo(id: string) { 37 removeVideo(id: string) {
35 const options = this.authService.getAuthRequestOptions(); 38 const options = this.authService.getAuthRequestOptions();
36 return this.http.delete(VideoService.BASE_VIDEO_URL + id, options) 39 return this.http.delete(VideoService.BASE_VIDEO_URL + id, options)
@@ -50,6 +53,17 @@ export class VideoService {
50 .catch(this.handleError); 53 .catch(this.handleError);
51 } 54 }
52 55
56 private createPaginationParams(pagination: Pagination) {
57 const params = new URLSearchParams();
58 const start: number = (pagination.currentPage - 1) * pagination.itemsPerPage;
59 const count: number = pagination.itemsPerPage;
60
61 params.set('start', start.toString());
62 params.set('count', count.toString());
63
64 return params;
65 }
66
53 private extractVideos(body: any) { 67 private extractVideos(body: any) {
54 const videos_json = body.data; 68 const videos_json = body.data;
55 const totalVideos = body.total; 69 const totalVideos = body.total;
@@ -65,15 +79,4 @@ export class VideoService {
65 console.error(error); 79 console.error(error);
66 return Observable.throw(error.json().error || 'Server error'); 80 return Observable.throw(error.json().error || 'Server error');
67 } 81 }
68
69 private createPaginationParams(pagination: Pagination) {
70 const params = new URLSearchParams();
71 const start: number = (pagination.currentPage - 1) * pagination.itemsPerPage;
72 const count: number = pagination.itemsPerPage;
73
74 params.set('start', start.toString());
75 params.set('count', count.toString());
76
77 return params;
78 }
79} 82}
diff --git a/client/app/videos/video-add/video-add.component.ts b/client/app/videos/video-add/video-add.component.ts
index 67a04a2b4..b11475ae9 100644
--- a/client/app/videos/video-add/video-add.component.ts
+++ b/client/app/videos/video-add/video-add.component.ts
@@ -18,20 +18,21 @@ declare var jQuery: any;
18}) 18})
19 19
20export class VideoAddComponent implements OnInit { 20export class VideoAddComponent implements OnInit {
21 user: User;
22 fileToUpload: any; 21 fileToUpload: any;
23 progressBar: { value: number; max: number; } = { value: 0, max: 0 }; 22 progressBar: { value: number; max: number; } = { value: 0, max: 0 };
23 user: User;
24 24
25 private _form: any; 25 private form: any;
26 26
27 constructor( 27 constructor(
28 private _router: Router, private _elementRef: ElementRef, 28 private router: Router,
29 private _authService: AuthService 29 private elementRef: ElementRef,
30 private authService: AuthService
30 ) {} 31 ) {}
31 32
32 ngOnInit() { 33 ngOnInit() {
33 this.user = User.load(); 34 this.user = User.load();
34 jQuery(this._elementRef.nativeElement).find('#videofile').fileupload({ 35 jQuery(this.elementRef.nativeElement).find('#videofile').fileupload({
35 url: '/api/v1/videos', 36 url: '/api/v1/videos',
36 dataType: 'json', 37 dataType: 'json',
37 singleFileUploads: true, 38 singleFileUploads: true,
@@ -39,7 +40,7 @@ export class VideoAddComponent implements OnInit {
39 autoupload: false, 40 autoupload: false,
40 41
41 add: (e, data) => { 42 add: (e, data) => {
42 this._form = data; 43 this.form = data;
43 this.fileToUpload = data['files'][0]; 44 this.fileToUpload = data['files'][0];
44 }, 45 },
45 46
@@ -55,14 +56,14 @@ export class VideoAddComponent implements OnInit {
55 console.log('Video uploaded.'); 56 console.log('Video uploaded.');
56 57
57 // Print all the videos once it's finished 58 // Print all the videos once it's finished
58 this._router.navigate(['VideosList']); 59 this.router.navigate(['VideosList']);
59 } 60 }
60 }); 61 });
61 } 62 }
62 63
63 uploadFile() { 64 uploadFile() {
64 this._form.headers = this._authService.getRequestHeader().toJSON(); 65 this.form.headers = this.authService.getRequestHeader().toJSON();
65 this._form.formData = jQuery(this._elementRef.nativeElement).find('form').serializeArray(); 66 this.form.formData = jQuery(this.elementRef.nativeElement).find('form').serializeArray();
66 this._form.submit(); 67 this.form.submit();
67 } 68 }
68} 69}
diff --git a/client/app/videos/video-list/video-list.component.ts b/client/app/videos/video-list/video-list.component.ts
index 3f54c98ce..23b97df32 100644
--- a/client/app/videos/video-list/video-list.component.ts
+++ b/client/app/videos/video-list/video-list.component.ts
@@ -23,23 +23,23 @@ import { VideoSortComponent } from './video-sort.component';
23}) 23})
24 24
25export class VideoListComponent implements OnInit { 25export class VideoListComponent implements OnInit {
26 user: User = null; 26 loading = false;
27 videos: Video[] = [];
28 pagination: Pagination = { 27 pagination: Pagination = {
29 currentPage: 1, 28 currentPage: 1,
30 itemsPerPage: 9, 29 itemsPerPage: 9,
31 total: 0 30 total: 0
32 }; 31 };
33 sort: SortField; 32 sort: SortField;
34 loading = false; 33 user: User = null;
34 videos: Video[] = [];
35 35
36 private search: Search; 36 private search: Search;
37 37
38 constructor( 38 constructor(
39 private authService: AuthService, 39 private authService: AuthService,
40 private videoService: VideoService, 40 private router: Router,
41 private routeParams: RouteParams, 41 private routeParams: RouteParams,
42 private router: Router 42 private videoService: VideoService
43 ) { 43 ) {
44 this.search = { 44 this.search = {
45 value: this.routeParams.get('search'), 45 value: this.routeParams.get('search'),
@@ -73,6 +73,7 @@ export class VideoListComponent implements OnInit {
73 ({ videos, totalVideos }) => { 73 ({ videos, totalVideos }) => {
74 this.videos = videos; 74 this.videos = videos;
75 this.pagination.total = totalVideos; 75 this.pagination.total = totalVideos;
76
76 this.loading = false; 77 this.loading = false;
77 }, 78 },
78 error => alert(error) 79 error => alert(error)
@@ -91,8 +92,8 @@ export class VideoListComponent implements OnInit {
91 }; 92 };
92 93
93 if (this.search.value) { 94 if (this.search.value) {
94 params.search = this.search.value;
95 params.field = this.search.field; 95 params.field = this.search.field;
96 params.search = this.search.value;
96 } 97 }
97 98
98 this.router.navigate(['VideosList', params]); 99 this.router.navigate(['VideosList', params]);
diff --git a/client/app/videos/video-list/video-miniature.component.ts b/client/app/videos/video-list/video-miniature.component.ts
index 73416607a..3baa1ddd6 100644
--- a/client/app/videos/video-list/video-miniature.component.ts
+++ b/client/app/videos/video-list/video-miniature.component.ts
@@ -16,23 +16,23 @@ import { User } from '../../users/index';
16export class VideoMiniatureComponent { 16export class VideoMiniatureComponent {
17 @Output() removed = new EventEmitter<any>(); 17 @Output() removed = new EventEmitter<any>();
18 18
19 @Input() video: Video;
20 @Input() user: User; 19 @Input() user: User;
20 @Input() video: Video;
21 21
22 hovering = false; 22 hovering = false;
23 23
24 constructor(private videoService: VideoService) {} 24 constructor(private videoService: VideoService) {}
25 25
26 onHover() { 26 displayRemoveIcon() {
27 this.hovering = true; 27 return this.hovering && this.video.isRemovableBy(this.user);
28 } 28 }
29 29
30 onBlur() { 30 onBlur() {
31 this.hovering = false; 31 this.hovering = false;
32 } 32 }
33 33
34 displayRemoveIcon() { 34 onHover() {
35 return this.hovering && this.video.isRemovableBy(this.user); 35 this.hovering = true;
36 } 36 }
37 37
38 removeVideo(id: string) { 38 removeVideo(id: string) {
diff --git a/client/app/videos/video-watch/video-watch.component.ts b/client/app/videos/video-watch/video-watch.component.ts
index c159b4004..137db8f0b 100644
--- a/client/app/videos/video-watch/video-watch.component.ts
+++ b/client/app/videos/video-watch/video-watch.component.ts
@@ -17,32 +17,24 @@ declare var WebTorrent: any;
17}) 17})
18 18
19export class VideoWatchComponent implements OnInit, CanDeactivate { 19export class VideoWatchComponent implements OnInit, CanDeactivate {
20 video: Video;
21 downloadSpeed: number; 20 downloadSpeed: number;
22 uploadSpeed: number;
23 numPeers: number;
24 loading: boolean = false; 21 loading: boolean = false;
22 numPeers: number;
23 uploadSpeed: number;
24 video: Video;
25 25
26 private interval: NodeJS.Timer;
27 private client: any; 26 private client: any;
27 private interval: NodeJS.Timer;
28 28
29 constructor( 29 constructor(
30 private videoService: VideoService, 30 private elementRef: ElementRef,
31 private routeParams: RouteParams, 31 private routeParams: RouteParams,
32 private elementRef: ElementRef 32 private videoService: VideoService
33 ) { 33 ) {
34 // TODO: use a service 34 // TODO: use a service
35 this.client = new WebTorrent({ dht: false }); 35 this.client = new WebTorrent({ dht: false });
36 } 36 }
37 37
38 ngOnInit() {
39 let id = this.routeParams.get('id');
40 this.videoService.getVideo(id).subscribe(
41 video => this.loadVideo(video),
42 error => alert(error)
43 );
44 }
45
46 loadVideo(video: Video) { 38 loadVideo(video: Video) {
47 this.loading = true; 39 this.loading = true;
48 this.video = video; 40 this.video = video;
@@ -60,12 +52,20 @@ export class VideoWatchComponent implements OnInit, CanDeactivate {
60 // Refresh each second 52 // Refresh each second
61 this.interval = setInterval(() => { 53 this.interval = setInterval(() => {
62 this.downloadSpeed = torrent.downloadSpeed; 54 this.downloadSpeed = torrent.downloadSpeed;
63 this.uploadSpeed = torrent.uploadSpeed;
64 this.numPeers = torrent.numPeers; 55 this.numPeers = torrent.numPeers;
56 this.uploadSpeed = torrent.uploadSpeed;
65 }, 1000); 57 }, 1000);
66 }); 58 });
67 } 59 }
68 60
61 ngOnInit() {
62 let id = this.routeParams.get('id');
63 this.videoService.getVideo(id).subscribe(
64 video => this.loadVideo(video),
65 error => alert(error)
66 );
67 }
68
69 routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) { 69 routerCanDeactivate(next: ComponentInstruction, prev: ComponentInstruction) {
70 console.log('Removing video from webtorrent.'); 70 console.log('Removing video from webtorrent.');
71 clearInterval(this.interval); 71 clearInterval(this.interval);