aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos/shared
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2016-06-03 22:08:03 +0200
committerChocobozzz <florian.bigard@gmail.com>2016-06-03 22:08:03 +0200
commit4a6995be18b15de1834a39c8921a0e4109671bb6 (patch)
treeb659661cea33687fcc6bd8fc2251cb7a15ab9f9d /client/src/app/videos/shared
parent468892541175f9662f8b1b977e819dc1a496f282 (diff)
downloadPeerTube-4a6995be18b15de1834a39c8921a0e4109671bb6.tar.gz
PeerTube-4a6995be18b15de1834a39c8921a0e4109671bb6.tar.zst
PeerTube-4a6995be18b15de1834a39c8921a0e4109671bb6.zip
First draft to use webpack instead of systemjs
Diffstat (limited to 'client/src/app/videos/shared')
-rw-r--r--client/src/app/videos/shared/index.ts5
-rw-r--r--client/src/app/videos/shared/loader/index.ts1
-rw-r--r--client/src/app/videos/shared/loader/loader.component.html3
-rw-r--r--client/src/app/videos/shared/loader/loader.component.scss26
-rw-r--r--client/src/app/videos/shared/loader/loader.component.ts11
-rw-r--r--client/src/app/videos/shared/pagination.model.ts5
-rw-r--r--client/src/app/videos/shared/sort-field.type.ts3
-rw-r--r--client/src/app/videos/shared/video.model.ts64
-rw-r--r--client/src/app/videos/shared/video.service.ts82
9 files changed, 200 insertions, 0 deletions
diff --git a/client/src/app/videos/shared/index.ts b/client/src/app/videos/shared/index.ts
new file mode 100644
index 000000000..a54120f5d
--- /dev/null
+++ b/client/src/app/videos/shared/index.ts
@@ -0,0 +1,5 @@
1export * from './loader';
2export * from './pagination.model';
3export * from './sort-field.type';
4export * from './video.model';
5export * from './video.service';
diff --git a/client/src/app/videos/shared/loader/index.ts b/client/src/app/videos/shared/loader/index.ts
new file mode 100644
index 000000000..ab22584e4
--- /dev/null
+++ b/client/src/app/videos/shared/loader/index.ts
@@ -0,0 +1 @@
export * from './loader.component';
diff --git a/client/src/app/videos/shared/loader/loader.component.html b/client/src/app/videos/shared/loader/loader.component.html
new file mode 100644
index 000000000..d02296a2d
--- /dev/null
+++ b/client/src/app/videos/shared/loader/loader.component.html
@@ -0,0 +1,3 @@
1<div id="video-loading" class="col-md-12 text-center" *ngIf="loading">
2 <div class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></div>
3</div>
diff --git a/client/src/app/videos/shared/loader/loader.component.scss b/client/src/app/videos/shared/loader/loader.component.scss
new file mode 100644
index 000000000..454195811
--- /dev/null
+++ b/client/src/app/videos/shared/loader/loader.component.scss
@@ -0,0 +1,26 @@
1div {
2 margin-top: 150px;
3}
4
5// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
6.glyphicon-refresh-animate {
7 -animation: spin .7s infinite linear;
8 -ms-animation: spin .7s infinite linear;
9 -webkit-animation: spinw .7s infinite linear;
10 -moz-animation: spinm .7s infinite linear;
11}
12
13@keyframes spin {
14 from { transform: scale(1) rotate(0deg);}
15 to { transform: scale(1) rotate(360deg);}
16}
17
18@-webkit-keyframes spinw {
19 from { -webkit-transform: rotate(0deg);}
20 to { -webkit-transform: rotate(360deg);}
21}
22
23@-moz-keyframes spinm {
24 from { -moz-transform: rotate(0deg);}
25 to { -moz-transform: rotate(360deg);}
26}
diff --git a/client/src/app/videos/shared/loader/loader.component.ts b/client/src/app/videos/shared/loader/loader.component.ts
new file mode 100644
index 000000000..cdd07d1b4
--- /dev/null
+++ b/client/src/app/videos/shared/loader/loader.component.ts
@@ -0,0 +1,11 @@
1import { Component, Input } from '@angular/core';
2
3@Component({
4 selector: 'my-loader',
5 styles: [ require('./loader.component.scss') ],
6 template: require('./loader.component.html')
7})
8
9export class LoaderComponent {
10 @Input() loading: boolean;
11}
diff --git a/client/src/app/videos/shared/pagination.model.ts b/client/src/app/videos/shared/pagination.model.ts
new file mode 100644
index 000000000..06f7a7875
--- /dev/null
+++ b/client/src/app/videos/shared/pagination.model.ts
@@ -0,0 +1,5 @@
1export interface Pagination {
2 currentPage: number;
3 itemsPerPage: number;
4 total: number;
5}
diff --git a/client/src/app/videos/shared/sort-field.type.ts b/client/src/app/videos/shared/sort-field.type.ts
new file mode 100644
index 000000000..6e8cc7936
--- /dev/null
+++ b/client/src/app/videos/shared/sort-field.type.ts
@@ -0,0 +1,3 @@
1export type SortField = "name" | "-name"
2 | "duration" | "-duration"
3 | "createdDate" | "-createdDate";
diff --git a/client/src/app/videos/shared/video.model.ts b/client/src/app/videos/shared/video.model.ts
new file mode 100644
index 000000000..614403d79
--- /dev/null
+++ b/client/src/app/videos/shared/video.model.ts
@@ -0,0 +1,64 @@
1export class Video {
2 author: string;
3 by: string;
4 createdDate: Date;
5 description: string;
6 duration: string;
7 id: string;
8 isLocal: boolean;
9 magnetUri: string;
10 name: string;
11 podUrl: string;
12 thumbnailPath: string;
13
14 private static createByString(author: string, podUrl: string) {
15 let [ host, port ] = podUrl.replace(/^https?:\/\//, '').split(':');
16
17 if (port === '80' || port === '443') {
18 port = '';
19 } else {
20 port = ':' + port;
21 }
22
23 return author + '@' + host + port;
24 }
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: {
36 author: string,
37 createdDate: string,
38 description: string,
39 duration: number;
40 id: string,
41 isLocal: boolean,
42 magnetUri: string,
43 name: string,
44 podUrl: string,
45 thumbnailPath: string
46 }) {
47 this.author = hash.author;
48 this.createdDate = new Date(hash.createdDate);
49 this.description = hash.description;
50 this.duration = Video.createDurationString(hash.duration);
51 this.id = hash.id;
52 this.isLocal = hash.isLocal;
53 this.magnetUri = hash.magnetUri;
54 this.name = hash.name;
55 this.podUrl = hash.podUrl;
56 this.thumbnailPath = hash.thumbnailPath;
57
58 this.by = Video.createByString(hash.author, hash.podUrl);
59 }
60
61 isRemovableBy(user) {
62 return this.isLocal === true && user && this.author === user.username;
63 }
64}
diff --git a/client/src/app/videos/shared/video.service.ts b/client/src/app/videos/shared/video.service.ts
new file mode 100644
index 000000000..76d46cbb4
--- /dev/null
+++ b/client/src/app/videos/shared/video.service.ts
@@ -0,0 +1,82 @@
1import { Injectable } from '@angular/core';
2import { Http, Response, URLSearchParams } from '@angular/http';
3import { Observable } from 'rxjs/Rx';
4
5import { Pagination } from './pagination.model';
6import { Search } from '../../shared';
7import { SortField } from './sort-field.type';
8import { AuthService } from '../../shared';
9import { Video } from './video.model';
10
11@Injectable()
12export class VideoService {
13 private static BASE_VIDEO_URL = '/api/v1/videos/';
14
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 }
25
26 getVideos(pagination: Pagination, sort: SortField) {
27 const params = this.createPaginationParams(pagination);
28
29 if (sort) params.set('sort', sort);
30
31 return this.http.get(VideoService.BASE_VIDEO_URL, { search: params })
32 .map(res => res.json())
33 .map(this.extractVideos)
34 .catch(this.handleError);
35 }
36
37 removeVideo(id: string) {
38 const options = this.authService.getAuthRequestOptions();
39 return this.http.delete(VideoService.BASE_VIDEO_URL + id, options)
40 .map(res => <number> res.status)
41 .catch(this.handleError);
42 }
43
44 searchVideos(search: Search, pagination: Pagination, sort: SortField) {
45 const params = this.createPaginationParams(pagination);
46
47 if (search.field) params.set('field', search.field);
48 if (sort) params.set('sort', sort);
49
50 return this.http.get(VideoService.BASE_VIDEO_URL + 'search/' + encodeURIComponent(search.value), { search: params })
51 .map(res => res.json())
52 .map(this.extractVideos)
53 .catch(this.handleError);
54 }
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
67 private extractVideos(body: any) {
68 const videos_json = body.data;
69 const totalVideos = body.total;
70 const videos = [];
71 for (const video_json of videos_json) {
72 videos.push(new Video(video_json));
73 }
74
75 return { videos, totalVideos };
76 }
77
78 private handleError(error: Response) {
79 console.error(error);
80 return Observable.throw(error.json().error || 'Server error');
81 }
82}