Relax on tags (accept any characters and not required anymore)

7 files changed, 31 insertions, 40 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 = {
 };
 
 export const VIDEO_TAGS = {
-  VALIDATORS: [ Validators.pattern('^[a-zA-Z0-9]{0,10}$') ],
+  VALIDATORS: [ Validators.maxLength(10) ],
   MESSAGES: {
-    'pattern': 'A tag should be between 2 and 10 alphanumeric characters long.'
+    'maxlength': 'A tag should be less than 10 characters long.'
   }
 };
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 {
   checkForm() {
     this.forceCheck();
 
-    if (this.tags.length === 0) {
-      this.tagsError = 'You have 0 tags';
-    }
-
     if (this.filename === null) {
       this.fileError = 'You did not add a file.';
     }
@@ -121,25 +117,9 @@ export class VideoAddComponent extends FormReactive implements OnInit {
   }
 
   onTagKeyPress(event: KeyboardEvent) {
-    const currentTag = this.form.value['currentTag'];
-
     // Enter press
     if (event.keyCode === 13) {
-      // Check if the tag is valid and does not already exist
-      if (
-        currentTag.length >= 2 &&
-        this.form.controls['currentTag'].valid &&
-        this.tags.indexOf(currentTag) === -1
-      ) {
-        this.tags.push(currentTag);
-        this.form.patchValue({ currentTag: '' });
-
-        if (this.tags.length >= 3) {
-          this.form.get('currentTag').disable();
-        }
-
-        this.tagsError = '';
-      }
+      this.addTagIfPossible();
     }
   }
 
@@ -153,6 +133,9 @@ export class VideoAddComponent extends FormReactive implements OnInit {
   }
 
   upload() {
+    // Maybe the user forgot to press "enter" when he filled the field
+    this.addTagIfPossible();
+
     if (this.checkForm() === false) {
       return;
     }
@@ -199,4 +182,25 @@ export class VideoAddComponent extends FormReactive implements OnInit {
 
     this.uploader.uploadAll();
   }
+
+  private addTagIfPossible() {
+    const currentTag = this.form.value['currentTag'];
+    if (currentTag === undefined) return;
+
+    // Check if the tag is valid and does not already exist
+    if (
+      currentTag.length >= 2 &&
+      this.form.controls['currentTag'].valid &&
+      this.tags.indexOf(currentTag) === -1
+    ) {
+      this.tags.push(currentTag);
+      this.form.patchValue({ currentTag: '' });
+
+      if (this.tags.length >= 3) {
+        this.form.get('currentTag').disable();
+      }
+
+      this.tagsError = '';
+    }
+  }
 }
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 @@
   display: inline-block;
   position: relative;
   min-width: 220px;
+  height: 190px;
 
   .video-miniature-thumbnail {
     display: inline-block;
diff --git a/server/helpers/custom-validators/videos.js b/server/helpers/custom-validators/videos.js
index 92b366717..efa89c427 100644
--- a/server/helpers/custom-validators/videos.js
+++ b/server/helpers/custom-validators/videos.js
@@ -69,8 +69,7 @@ function isVideoTagsValid (tags) {
   return miscValidators.isArray(tags) &&
          validator.isInt(tags.length, VIDEOS_CONSTRAINTS_FIELDS.TAGS) &&
          tags.every(function (tag) {
-           return validator.isAlphanumeric(tag) &&
-                  validator.isLength(tag, VIDEOS_CONSTRAINTS_FIELDS.TAG)
+           return validator.isLength(tag, VIDEOS_CONSTRAINTS_FIELDS.TAG)
          })
 }
 
diff --git a/server/initializers/constants.js b/server/initializers/constants.js
index 6c5287b19..40f01e389 100644
--- a/server/initializers/constants.js
+++ b/server/initializers/constants.js
@@ -85,7 +85,7 @@ const CONSTRAINTS_FIELDS = {
     EXTNAME: [ '.mp4', '.ogv', '.webm' ],
     INFO_HASH: { min: 40, max: 40 }, // Length, infohash is 20 bytes length but we represent it in hexa so 20 * 2
     DURATION: { min: 1, max: 7200 }, // Number
-    TAGS: { min: 1, max: 3 }, // Number of total tags
+    TAGS: { min: 0, max: 3 }, // Number of total tags
     TAG: { min: 2, max: 10 }, // Length
     THUMBNAIL: { min: 2, max: 30 },
     THUMBNAIL_DATA: { min: 0, max: 20000 }, // Bytes
diff --git a/server/middlewares/validators/videos.js b/server/middlewares/validators/videos.js
index 37cc13372..cf3874a97 100644
--- a/server/middlewares/validators/videos.js
+++ b/server/middlewares/validators/videos.js
@@ -23,7 +23,7 @@ function videosAdd (req, res, next) {
   req.checkBody('name', 'Should have a valid name').isVideoNameValid()
   req.checkBody('category', 'Should have a valid category').isVideoCategoryValid()
   req.checkBody('description', 'Should have a valid description').isVideoDescriptionValid()
-  req.checkBody('tags', 'Should have correct tags').isVideoTagsValid()
+  req.checkBody('tags', 'Should have correct tags').optional().isVideoTagsValid()
 
   logger.debug('Checking videosAdd parameters', { parameters: req.body, files: req.files })
 
diff --git a/server/tests/api/check-params/videos.js b/server/tests/api/check-params/videos.js
index fbfe6f137..25b4eae31 100644
--- a/server/tests/api/check-params/videos.js
+++ b/server/tests/api/check-params/videos.js
@@ -251,19 +251,6 @@ describe('Test videos API validator', function () {
       requestsUtils.makePostUploadRequest(server.url, path, server.accessToken, data, attach, done)
     })
 
-    it('Should fail with malformed tags', function (done) {
-      const data = {
-        name: 'my super name',
-        category: 5,
-        description: 'my super description',
-        tags: [ 'my tag' ]
-      }
-      const attach = {
-        'videofile': pathUtils.join(__dirname, '..', 'fixtures', 'video_short.webm')
-      }
-      requestsUtils.makePostUploadRequest(server.url, path, server.accessToken, data, attach, done)
-    })
-
     it('Should fail without an input file', function (done) {
       const data = {
         name: 'my super name',