aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-03-27 21:11:37 +0200
committerChocobozzz <florian.bigard@gmail.com>2017-03-27 21:11:37 +0200
commitd07137b90b2b2b0c1e93a6f0e7bf8719b133027c (patch)
tree0bb642609819bc1c8ff2761c848f8db3a9934d88 /client/src/app
parent6f0c39e2de400685b7baf8340b9e132f2659365a (diff)
downloadPeerTube-d07137b90b2b2b0c1e93a6f0e7bf8719b133027c.tar.gz
PeerTube-d07137b90b2b2b0c1e93a6f0e7bf8719b133027c.tar.zst
PeerTube-d07137b90b2b2b0c1e93a6f0e7bf8719b133027c.zip
Client: add support for video licences
Diffstat (limited to 'client/src/app')
-rw-r--r--client/src/app/app.component.ts1
-rw-r--r--client/src/app/shared/forms/form-validators/video.ts9
-rw-r--r--client/src/app/videos/shared/video.model.ts3
-rw-r--r--client/src/app/videos/shared/video.service.ts14
-rw-r--r--client/src/app/videos/video-add/video-add.component.html12
-rw-r--r--client/src/app/videos/video-add/video-add.component.ts8
-rw-r--r--client/src/app/videos/video-watch/video-watch.component.html7
-rw-r--r--client/src/app/videos/video-watch/video-watch.component.scss4
8 files changed, 58 insertions, 0 deletions
diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts
index c7310690f..4e33fae52 100644
--- a/client/src/app/app.component.ts
+++ b/client/src/app/app.component.ts
@@ -39,6 +39,7 @@ export class AppComponent implements OnInit {
39 } 39 }
40 40
41 this.videoService.loadVideoCategories(); 41 this.videoService.loadVideoCategories();
42 this.videoService.loadVideoLicences();
42 } 43 }
43 44
44 isInAdmin() { 45 isInAdmin() {
diff --git a/client/src/app/shared/forms/form-validators/video.ts b/client/src/app/shared/forms/form-validators/video.ts
index de5112238..50d7304b5 100644
--- a/client/src/app/shared/forms/form-validators/video.ts
+++ b/client/src/app/shared/forms/form-validators/video.ts
@@ -8,12 +8,21 @@ export const VIDEO_NAME = {
8 'maxlength': 'Video name cannot be more than 50 characters long.' 8 'maxlength': 'Video name cannot be more than 50 characters long.'
9 } 9 }
10}; 10};
11
11export const VIDEO_CATEGORY = { 12export const VIDEO_CATEGORY = {
12 VALIDATORS: [ Validators.required ], 13 VALIDATORS: [ Validators.required ],
13 MESSAGES: { 14 MESSAGES: {
14 'required': 'Video category is required.' 15 'required': 'Video category is required.'
15 } 16 }
16}; 17};
18
19export const VIDEO_LICENCE = {
20 VALIDATORS: [ Validators.required ],
21 MESSAGES: {
22 'required': 'Video licence is required.'
23 }
24};
25
17export const VIDEO_DESCRIPTION = { 26export const VIDEO_DESCRIPTION = {
18 VALIDATORS: [ Validators.required, Validators.minLength(3), Validators.maxLength(250) ], 27 VALIDATORS: [ Validators.required, Validators.minLength(3), Validators.maxLength(250) ],
19 MESSAGES: { 28 MESSAGES: {
diff --git a/client/src/app/videos/shared/video.model.ts b/client/src/app/videos/shared/video.model.ts
index b5d96f63a..5ed622dce 100644
--- a/client/src/app/videos/shared/video.model.ts
+++ b/client/src/app/videos/shared/video.model.ts
@@ -3,6 +3,7 @@ export class Video {
3 by: string; 3 by: string;
4 createdAt: Date; 4 createdAt: Date;
5 categoryLabel: string; 5 categoryLabel: string;
6 licenceLabel: string;
6 description: string; 7 description: string;
7 duration: string; 8 duration: string;
8 id: string; 9 id: string;
@@ -33,6 +34,7 @@ export class Video {
33 author: string, 34 author: string,
34 createdAt: string, 35 createdAt: string,
35 categoryLabel: string, 36 categoryLabel: string,
37 licenceLabel: string,
36 description: string, 38 description: string,
37 duration: number; 39 duration: number;
38 id: string, 40 id: string,
@@ -49,6 +51,7 @@ export class Video {
49 this.author = hash.author; 51 this.author = hash.author;
50 this.createdAt = new Date(hash.createdAt); 52 this.createdAt = new Date(hash.createdAt);
51 this.categoryLabel = hash.categoryLabel; 53 this.categoryLabel = hash.categoryLabel;
54 this.licenceLabel = hash.licenceLabel;
52 this.description = hash.description; 55 this.description = hash.description;
53 this.duration = Video.createDurationString(hash.duration); 56 this.duration = Video.createDurationString(hash.duration);
54 this.id = hash.id; 57 this.id = hash.id;
diff --git a/client/src/app/videos/shared/video.service.ts b/client/src/app/videos/shared/video.service.ts
index debc114aa..15f017e33 100644
--- a/client/src/app/videos/shared/video.service.ts
+++ b/client/src/app/videos/shared/video.service.ts
@@ -23,6 +23,7 @@ export class VideoService {
23 private static BASE_VIDEO_URL = '/api/v1/videos/'; 23 private static BASE_VIDEO_URL = '/api/v1/videos/';
24 24
25 videoCategories: Array<{ id: number, label: string }> = []; 25 videoCategories: Array<{ id: number, label: string }> = [];
26 videoLicences: Array<{ id: number, label: string }> = [];
26 27
27 constructor( 28 constructor(
28 private authService: AuthService, 29 private authService: AuthService,
@@ -45,6 +46,19 @@ export class VideoService {
45 }); 46 });
46 } 47 }
47 48
49 loadVideoLicences() {
50 return this.http.get(VideoService.BASE_VIDEO_URL + 'licences')
51 .map(this.restExtractor.extractDataGet)
52 .subscribe(data => {
53 Object.keys(data).forEach(licenceKey => {
54 this.videoLicences.push({
55 id: parseInt(licenceKey),
56 label: data[licenceKey]
57 });
58 });
59 });
60 }
61
48 getVideo(id: string): Observable<Video> { 62 getVideo(id: string): Observable<Video> {
49 return this.http.get(VideoService.BASE_VIDEO_URL + id) 63 return this.http.get(VideoService.BASE_VIDEO_URL + id)
50 .map(this.restExtractor.extractDataGet) 64 .map(this.restExtractor.extractDataGet)
diff --git a/client/src/app/videos/video-add/video-add.component.html b/client/src/app/videos/video-add/video-add.component.html
index c6692b21d..97a3c846a 100644
--- a/client/src/app/videos/video-add/video-add.component.html
+++ b/client/src/app/videos/video-add/video-add.component.html
@@ -27,6 +27,18 @@
27 </div> 27 </div>
28 28
29 <div class="form-group"> 29 <div class="form-group">
30 <label for="licence">Licence</label>
31 <select class="form-control" id="licence" formControlName="licence">
32 <option></option>
33 <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
34 </select>
35
36 <div *ngIf="formErrors.licence" class="alert alert-danger">
37 {{ formErrors.licence }}
38 </div>
39 </div>
40
41 <div class="form-group">
30 <label for="tags">Tags</label> <span class="little-information">(press enter to add the tag)</span> 42 <label for="tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
31 <input 43 <input
32 type="text" class="form-control" id="currentTag" 44 type="text" class="form-control" id="currentTag"
diff --git a/client/src/app/videos/video-add/video-add.component.ts b/client/src/app/videos/video-add/video-add.component.ts
index 5ed1d8841..8fae233d3 100644
--- a/client/src/app/videos/video-add/video-add.component.ts
+++ b/client/src/app/videos/video-add/video-add.component.ts
@@ -10,6 +10,7 @@ import {
10 FormReactive, 10 FormReactive,
11 VIDEO_NAME, 11 VIDEO_NAME,
12 VIDEO_CATEGORY, 12 VIDEO_CATEGORY,
13 VIDEO_LICENCE,
13 VIDEO_DESCRIPTION, 14 VIDEO_DESCRIPTION,
14 VIDEO_TAGS 15 VIDEO_TAGS
15} from '../../shared'; 16} from '../../shared';
@@ -25,18 +26,21 @@ export class VideoAddComponent extends FormReactive implements OnInit {
25 tags: string[] = []; 26 tags: string[] = [];
26 uploader: FileUploader; 27 uploader: FileUploader;
27 videoCategories = []; 28 videoCategories = [];
29 videoLicences = [];
28 30
29 error: string = null; 31 error: string = null;
30 form: FormGroup; 32 form: FormGroup;
31 formErrors = { 33 formErrors = {
32 name: '', 34 name: '',
33 category: '', 35 category: '',
36 licence: '',
34 description: '', 37 description: '',
35 currentTag: '' 38 currentTag: ''
36 }; 39 };
37 validationMessages = { 40 validationMessages = {
38 name: VIDEO_NAME.MESSAGES, 41 name: VIDEO_NAME.MESSAGES,
39 category: VIDEO_CATEGORY.MESSAGES, 42 category: VIDEO_CATEGORY.MESSAGES,
43 licence: VIDEO_LICENCE.MESSAGES,
40 description: VIDEO_DESCRIPTION.MESSAGES, 44 description: VIDEO_DESCRIPTION.MESSAGES,
41 currentTag: VIDEO_TAGS.MESSAGES 45 currentTag: VIDEO_TAGS.MESSAGES
42 }; 46 };
@@ -68,6 +72,7 @@ export class VideoAddComponent extends FormReactive implements OnInit {
68 this.form = this.formBuilder.group({ 72 this.form = this.formBuilder.group({
69 name: [ '', VIDEO_NAME.VALIDATORS ], 73 name: [ '', VIDEO_NAME.VALIDATORS ],
70 category: [ '', VIDEO_CATEGORY.VALIDATORS ], 74 category: [ '', VIDEO_CATEGORY.VALIDATORS ],
75 licence: [ '', VIDEO_LICENCE.VALIDATORS ],
71 description: [ '', VIDEO_DESCRIPTION.VALIDATORS ], 76 description: [ '', VIDEO_DESCRIPTION.VALIDATORS ],
72 currentTag: [ '', VIDEO_TAGS.VALIDATORS ] 77 currentTag: [ '', VIDEO_TAGS.VALIDATORS ]
73 }); 78 });
@@ -77,6 +82,7 @@ export class VideoAddComponent extends FormReactive implements OnInit {
77 82
78 ngOnInit() { 83 ngOnInit() {
79 this.videoCategories = this.videoService.videoCategories; 84 this.videoCategories = this.videoService.videoCategories;
85 this.videoLicences = this.videoService.videoLicences;
80 86
81 this.uploader = new FileUploader({ 87 this.uploader = new FileUploader({
82 authToken: this.authService.getRequestHeaderValue(), 88 authToken: this.authService.getRequestHeaderValue(),
@@ -88,10 +94,12 @@ export class VideoAddComponent extends FormReactive implements OnInit {
88 this.uploader.onBuildItemForm = (item, form) => { 94 this.uploader.onBuildItemForm = (item, form) => {
89 const name = this.form.value['name']; 95 const name = this.form.value['name'];
90 const category = this.form.value['category']; 96 const category = this.form.value['category'];
97 const licence = this.form.value['licence'];
91 const description = this.form.value['description']; 98 const description = this.form.value['description'];
92 99
93 form.append('name', name); 100 form.append('name', name);
94 form.append('category', category); 101 form.append('category', category);
102 form.append('licence', licence);
95 form.append('description', description); 103 form.append('description', description);
96 104
97 for (let i = 0; i < this.tags.length; i++) { 105 for (let i = 0; i < this.tags.length; i++) {
diff --git a/client/src/app/videos/video-watch/video-watch.component.html b/client/src/app/videos/video-watch/video-watch.component.html
index e754d69e5..897561c14 100644
--- a/client/src/app/videos/video-watch/video-watch.component.html
+++ b/client/src/app/videos/video-watch/video-watch.component.html
@@ -114,6 +114,13 @@
114 </div> 114 </div>
115 </div> 115 </div>
116 116
117 <div id="video-licence" class="row">
118 <div class="col-md-12">
119 <span id="licence-label">Licence:</span>
120 {{ video.licenceLabel }}
121 </div>
122 </div>
123
117 <div id="video-description" class="row"> 124 <div id="video-description" class="row">
118 <div class="col-md-12"> 125 <div class="col-md-12">
119 <div id="description-label">Description</div> 126 <div id="description-label">Description</div>
diff --git a/client/src/app/videos/video-watch/video-watch.component.scss b/client/src/app/videos/video-watch/video-watch.component.scss
index 799e37b5d..bf989e78b 100644
--- a/client/src/app/videos/video-watch/video-watch.component.scss
+++ b/client/src/app/videos/video-watch/video-watch.component.scss
@@ -119,6 +119,10 @@
119 } 119 }
120 } 120 }
121 121
122 #video-licence #licence-label {
123 font-weight: bold;
124 }
125
122 #video-description { 126 #video-description {
123 margin-top: 10px; 127 margin-top: 10px;
124 128