Add video comment components

7 files changed, 32 insertions, 19 deletions

diff --git a/client/src/app/shared/forms/form-validators/video-comment.ts b/client/src/app/shared/forms/form-validators/video-comment.ts
new file mode 100644
index 000000000..42a97e300
--- /dev/null
+++ b/client/src/app/shared/forms/form-validators/video-comment.ts
@@ -0,0 +1,10 @@
+import { Validators } from '@angular/forms'
+
+export const VIDEO_COMMENT_TEXT = {
+  VALIDATORS: [ Validators.required, Validators.minLength(2), Validators.maxLength(3000) ],
+  MESSAGES: {
+    'required': 'Comment is required.',
+    'minlength': 'Comment must be at least 2 characters long.',
+    'maxlength': 'Comment cannot be more than 3000 characters long.'
+  }
+}
diff --git a/client/src/app/shared/misc/button.component.scss b/client/src/app/shared/misc/button.component.scss
index c380c7ae1..145a3474a 100644
--- a/client/src/app/shared/misc/button.component.scss
+++ b/client/src/app/shared/misc/button.component.scss
@@ -20,7 +20,7 @@
     top: -2px;
 
     &.icon-edit {
-      background-image: url('../../../assets/images/global/edit.svg');
+      background-image: url('../../../assets/images/global/edit-grey.svg');
     }
 
     &.icon-delete-grey {
diff --git a/client/src/app/shared/video/video-pagination.model.ts b/client/src/app/shared/rest/component-pagination.model.ts
index e9db61596..0b8ecc318 100644
--- a/client/src/app/shared/video/video-pagination.model.ts
+++ b/client/src/app/shared/rest/component-pagination.model.ts
@@ -1,4 +1,4 @@
-export interface VideoPagination {
+export interface ComponentPagination {
   currentPage: number
   itemsPerPage: number
   totalItems?: number
diff --git a/client/src/app/shared/rest/rest.service.ts b/client/src/app/shared/rest/rest.service.ts
index a1c301050..5d5410de9 100644
--- a/client/src/app/shared/rest/rest.service.ts
+++ b/client/src/app/shared/rest/rest.service.ts
@@ -1,6 +1,7 @@
 import { Injectable } from '@angular/core'
 import { HttpParams } from '@angular/common/http'
 import { SortMeta } from 'primeng/components/common/sortmeta'
+import { ComponentPagination } from './component-pagination.model'
 
 import { RestPagination } from './rest-pagination'
 
@@ -31,4 +32,10 @@ export class RestService {
     return newParams
   }
 
+  componentPaginationToRestPagination (componentPagination: ComponentPagination): RestPagination {
+    const start: number = (componentPagination.currentPage - 1) * componentPagination.itemsPerPage
+    const count: number = componentPagination.itemsPerPage
+
+    return { start, count }
+  }
 }
diff --git a/client/src/app/shared/video/abstract-video-list.ts b/client/src/app/shared/video/abstract-video-list.ts
index 2b6870a78..bfe46bcdd 100644
--- a/client/src/app/shared/video/abstract-video-list.ts
+++ b/client/src/app/shared/video/abstract-video-list.ts
@@ -3,12 +3,12 @@ import { ActivatedRoute, Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
 import { Observable } from 'rxjs/Observable'
 import { AuthService } from '../../core/auth'
+import { ComponentPagination } from '../rest/component-pagination.model'
 import { SortField } from './sort-field.type'
-import { VideoPagination } from './video-pagination.model'
 import { Video } from './video.model'
 
 export abstract class AbstractVideoList implements OnInit {
-  pagination: VideoPagination = {
+  pagination: ComponentPagination = {
     currentPage: 1,
     itemsPerPage: 25,
     totalItems: null
diff --git a/client/src/app/shared/video/video-miniature.component.scss b/client/src/app/shared/video/video-miniature.component.scss
index 49ba1e51c..f0888ad9f 100644
--- a/client/src/app/shared/video/video-miniature.component.scss
+++ b/client/src/app/shared/video/video-miniature.component.scss
@@ -18,7 +18,6 @@
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
-      font-weight: bold;
       transition: color 0.2s;
       font-size: 16px;
       font-weight: $font-semibold;
diff --git a/client/src/app/shared/video/video.service.ts b/client/src/app/shared/video/video.service.ts
index 91dd3977a..fc7505a51 100644
--- a/client/src/app/shared/video/video.service.ts
+++ b/client/src/app/shared/video/video.service.ts
@@ -10,13 +10,13 @@ import { UserVideoRate } from '../../../../../shared/models/videos/user-video-ra
 import { VideoRateType } from '../../../../../shared/models/videos/video-rate.type'
 import { VideoUpdate } from '../../../../../shared/models/videos/video-update.model'
 import { environment } from '../../../environments/environment'
+import { ComponentPagination } from '../rest/component-pagination.model'
 import { RestExtractor } from '../rest/rest-extractor.service'
 import { RestService } from '../rest/rest.service'
 import { UserService } from '../users/user.service'
 import { SortField } from './sort-field.type'
 import { VideoDetails } from './video-details.model'
 import { VideoEdit } from './video-edit.model'
-import { VideoPagination } from './video-pagination.model'
 import { Video } from './video.model'
 
 @Injectable()
@@ -71,8 +71,8 @@ export class VideoService {
       .catch(this.restExtractor.handleError)
   }
 
-  getMyVideos (videoPagination: VideoPagination, sort: SortField): Observable<{ videos: Video[], totalVideos: number}> {
-    const pagination = this.videoPaginationToRestPagination(videoPagination)
+  getMyVideos (videoPagination: ComponentPagination, sort: SortField): Observable<{ videos: Video[], totalVideos: number}> {
+    const pagination = this.restService.componentPaginationToRestPagination(videoPagination)
 
     let params = new HttpParams()
     params = this.restService.addRestGetParams(params, pagination, sort)
@@ -82,8 +82,8 @@ export class VideoService {
       .catch((res) => this.restExtractor.handleError(res))
   }
 
-  getVideos (videoPagination: VideoPagination, sort: SortField): Observable<{ videos: Video[], totalVideos: number}> {
-    const pagination = this.videoPaginationToRestPagination(videoPagination)
+  getVideos (videoPagination: ComponentPagination, sort: SortField): Observable<{ videos: Video[], totalVideos: number}> {
+    const pagination = this.restService.componentPaginationToRestPagination(videoPagination)
 
     let params = new HttpParams()
     params = this.restService.addRestGetParams(params, pagination, sort)
@@ -94,10 +94,14 @@ export class VideoService {
       .catch((res) => this.restExtractor.handleError(res))
   }
 
-  searchVideos (search: string, videoPagination: VideoPagination, sort: SortField): Observable<{ videos: Video[], totalVideos: number}> {
+  searchVideos (
+    search: string,
+    videoPagination: ComponentPagination,
+    sort: SortField
+  ): Observable<{ videos: Video[], totalVideos: number}> {
     const url = VideoService.BASE_VIDEO_URL + 'search'
 
-    const pagination = this.videoPaginationToRestPagination(videoPagination)
+    const pagination = this.restService.componentPaginationToRestPagination(videoPagination)
 
     let params = new HttpParams()
     params = this.restService.addRestGetParams(params, pagination, sort)
@@ -139,13 +143,6 @@ export class VideoService {
       .catch(res => this.restExtractor.handleError(res))
   }
 
-  private videoPaginationToRestPagination (videoPagination: VideoPagination) {
-    const start: number = (videoPagination.currentPage - 1) * videoPagination.itemsPerPage
-    const count: number = videoPagination.itemsPerPage
-
-    return { start, count }
-  }
-
   private setVideoRate (id: number, rateType: VideoRateType) {
     const url = VideoService.BASE_VIDEO_URL + id + '/rate'
     const body: UserVideoRateUpdate = {