aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
Diffstat (limited to 'client')
-rw-r--r--client/src/app/shared/forms/form-validators/video.ts4
-rw-r--r--client/src/app/videos/video-add/video-add.component.ts46
-rw-r--r--client/src/app/videos/video-list/video-miniature.component.scss1
3 files changed, 28 insertions, 23 deletions
diff --git a/client/src/app/shared/forms/form-validators/video.ts b/client/src/app/shared/forms/form-validators/video.ts
index d972ee44b..de5112238 100644
--- a/client/src/app/shared/forms/form-validators/video.ts
+++ b/client/src/app/shared/forms/form-validators/video.ts
@@ -24,8 +24,8 @@ export const VIDEO_DESCRIPTION = {
24}; 24};
25 25
26export const VIDEO_TAGS = { 26export const VIDEO_TAGS = {
27 VALIDATORS: [ Validators.pattern('^[a-zA-Z0-9]{0,10}$') ], 27 VALIDATORS: [ Validators.maxLength(10) ],
28 MESSAGES: { 28 MESSAGES: {
29 'pattern': 'A tag should be between 2 and 10 alphanumeric characters long.' 29 'maxlength': 'A tag should be less than 10 characters long.'
30 } 30 }
31}; 31};
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 2ef666e17..5ed1d8841 100644
--- a/client/src/app/videos/video-add/video-add.component.ts
+++ b/client/src/app/videos/video-add/video-add.component.ts
@@ -105,10 +105,6 @@ export class VideoAddComponent extends FormReactive implements OnInit {
105 checkForm() { 105 checkForm() {
106 this.forceCheck(); 106 this.forceCheck();
107 107
108 if (this.tags.length === 0) {
109 this.tagsError = 'You have 0 tags';
110 }
111
112 if (this.filename === null) { 108 if (this.filename === null) {
113 this.fileError = 'You did not add a file.'; 109 this.fileError = 'You did not add a file.';
114 } 110 }
@@ -121,25 +117,9 @@ export class VideoAddComponent extends FormReactive implements OnInit {
121 } 117 }
122 118
123 onTagKeyPress(event: KeyboardEvent) { 119 onTagKeyPress(event: KeyboardEvent) {
124 const currentTag = this.form.value['currentTag'];
125
126 // Enter press 120 // Enter press
127 if (event.keyCode === 13) { 121 if (event.keyCode === 13) {
128 // Check if the tag is valid and does not already exist 122 this.addTagIfPossible();
129 if (
130 currentTag.length >= 2 &&
131 this.form.controls['currentTag'].valid &&
132 this.tags.indexOf(currentTag) === -1
133 ) {
134 this.tags.push(currentTag);
135 this.form.patchValue({ currentTag: '' });
136
137 if (this.tags.length >= 3) {
138 this.form.get('currentTag').disable();
139 }
140
141 this.tagsError = '';
142 }
143 } 123 }
144 } 124 }
145 125
@@ -153,6 +133,9 @@ export class VideoAddComponent extends FormReactive implements OnInit {
153 } 133 }
154 134
155 upload() { 135 upload() {
136 // Maybe the user forgot to press "enter" when he filled the field
137 this.addTagIfPossible();
138
156 if (this.checkForm() === false) { 139 if (this.checkForm() === false) {
157 return; 140 return;
158 } 141 }
@@ -199,4 +182,25 @@ export class VideoAddComponent extends FormReactive implements OnInit {
199 182
200 this.uploader.uploadAll(); 183 this.uploader.uploadAll();
201 } 184 }
185
186 private addTagIfPossible() {
187 const currentTag = this.form.value['currentTag'];
188 if (currentTag === undefined) return;
189
190 // Check if the tag is valid and does not already exist
191 if (
192 currentTag.length >= 2 &&
193 this.form.controls['currentTag'].valid &&
194 this.tags.indexOf(currentTag) === -1
195 ) {
196 this.tags.push(currentTag);
197 this.form.patchValue({ currentTag: '' });
198
199 if (this.tags.length >= 3) {
200 this.form.get('currentTag').disable();
201 }
202
203 this.tagsError = '';
204 }
205 }
202} 206}
diff --git a/client/src/app/videos/video-list/video-miniature.component.scss b/client/src/app/videos/video-list/video-miniature.component.scss
index 0d309062a..b5d24271a 100644
--- a/client/src/app/videos/video-list/video-miniature.component.scss
+++ b/client/src/app/videos/video-list/video-miniature.component.scss
@@ -9,6 +9,7 @@
9 display: inline-block; 9 display: inline-block;
10 position: relative; 10 position: relative;
11 min-width: 220px; 11 min-width: 220px;
12 height: 190px;
12 13
13 .video-miniature-thumbnail { 14 .video-miniature-thumbnail {
14 display: inline-block; 15 display: inline-block;