Add ability to disable video comments

8 files changed, 59 insertions, 37 deletions

diff --git a/client/src/app/shared/video/video-details.model.ts b/client/src/app/shared/video/video-details.model.ts
index 8243b9f1c..cf6b71b60 100644
--- a/client/src/app/shared/video/video-details.model.ts
+++ b/client/src/app/shared/video/video-details.model.ts
@@ -1,14 +1,10 @@
-import { Account } from '../../../../../shared/models/actors'
-import { Video } from '../../shared/video/video.model'
-import { AuthUser } from '../../core'
 import {
-  VideoDetails as VideoDetailsServerModel,
-  VideoFile,
-  VideoChannel,
-  VideoResolution,
-  UserRight,
-  VideoPrivacy
+  UserRight, VideoChannel, VideoDetails as VideoDetailsServerModel, VideoFile, VideoPrivacy,
+  VideoResolution
 } from '../../../../../shared'
+import { Account } from '../../../../../shared/models/actors'
+import { AuthUser } from '../../core'
+import { Video } from '../../shared/video/video.model'
 
 export class VideoDetails extends Video implements VideoDetailsServerModel {
   accountName: string
@@ -48,6 +44,7 @@ export class VideoDetails extends Video implements VideoDetailsServerModel {
   account: Account
   likesPercent: number
   dislikesPercent: number
+  commentsEnabled: boolean
 
   constructor (hash: VideoDetailsServerModel) {
     super(hash)
@@ -59,6 +56,7 @@ export class VideoDetails extends Video implements VideoDetailsServerModel {
     this.channel = hash.channel
     this.account = hash.account
     this.tags = hash.tags
+    this.commentsEnabled = hash.commentsEnabled
 
     this.likesPercent = (this.likes / (this.likes + this.dislikes)) * 100
     this.dislikesPercent = (this.dislikes / (this.likes + this.dislikes)) * 100
diff --git a/client/src/app/shared/video/video-edit.model.ts b/client/src/app/shared/video/video-edit.model.ts
index 47c63d976..b1c772217 100644
--- a/client/src/app/shared/video/video-edit.model.ts
+++ b/client/src/app/shared/video/video-edit.model.ts
@@ -9,6 +9,7 @@ export class VideoEdit {
   name: string
   tags: string[]
   nsfw: boolean
+  commentsEnabled: boolean
   channel: number
   privacy: VideoPrivacy
   uuid?: string
@@ -25,6 +26,7 @@ export class VideoEdit {
       this.name = videoDetails.name
       this.tags = videoDetails.tags
       this.nsfw = videoDetails.nsfw
+      this.commentsEnabled = videoDetails.commentsEnabled
       this.channel = videoDetails.channel.id
       this.privacy = videoDetails.privacy
     }
@@ -45,6 +47,7 @@ export class VideoEdit {
       name: this.name,
       tags: this.tags,
       nsfw: this.nsfw,
+      commentsEnabled: this.commentsEnabled,
       channelId: this.channel,
       privacy: this.privacy
     }
diff --git a/client/src/app/shared/video/video.service.ts b/client/src/app/shared/video/video.service.ts
index fc7505a51..073acb2b6 100644
--- a/client/src/app/shared/video/video.service.ts
+++ b/client/src/app/shared/video/video.service.ts
@@ -55,7 +55,8 @@ export class VideoService {
       description,
       privacy: video.privacy,
       tags: video.tags,
-      nsfw: video.nsfw
+      nsfw: video.nsfw,
+      commentsEnabled: video.commentsEnabled
     }
 
     return this.authHttp.put(VideoService.BASE_VIDEO_URL + video.id, body)
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.html b/client/src/app/videos/+video-edit/shared/video-edit.component.html
index 9acbafcb6..80377933e 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.html
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.html
@@ -99,5 +99,11 @@
       <label for="nsfw">This video contains mature or explicit content</label>
     </div>
 
+    <div class="form-group form-group-checkbox">
+      <input type="checkbox" id="commentsEnabled" formControlName="commentsEnabled" />
+      <label for="commentsEnabled"></label>
+      <label for="commentsEnabled">Enable video comments</label>
+    </div>
+
   </div>
 </div>
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.ts b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
index 7fe265284..2b307d5fa 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.ts
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
@@ -70,6 +70,7 @@ export class VideoEditComponent implements OnInit {
     this.form.addControl('privacy', new FormControl('', VIDEO_PRIVACY.VALIDATORS))
     this.form.addControl('channelId', new FormControl({ value: '', disabled: true }))
     this.form.addControl('nsfw', new FormControl(false))
+    this.form.addControl('commentsEnabled', new FormControl(true))
     this.form.addControl('category', new FormControl('', VIDEO_CATEGORY.VALIDATORS))
     this.form.addControl('licence', new FormControl('', VIDEO_LICENCE.VALIDATORS))
     this.form.addControl('language', new FormControl('', VIDEO_LANGUAGE.VALIDATORS))
diff --git a/client/src/app/videos/+video-edit/video-add.component.ts b/client/src/app/videos/+video-edit/video-add.component.ts
index 9bbee58d8..843475647 100644
--- a/client/src/app/videos/+video-edit/video-add.component.ts
+++ b/client/src/app/videos/+video-edit/video-add.component.ts
@@ -88,6 +88,7 @@ export class VideoAddComponent extends FormReactive implements OnInit {
     const name = videofile.name.replace(/\.[^/.]+$/, '')
     const privacy = this.firstStepPrivacyId.toString()
     const nsfw = false
+    const commentsEnabled = true
     const channelId = this.firstStepChannelId.toString()
 
     const formData = new FormData()
@@ -95,6 +96,7 @@ export class VideoAddComponent extends FormReactive implements OnInit {
     // Put the video "private" -> we wait he validates the second step
     formData.append('privacy', VideoPrivacy.PRIVATE.toString())
     formData.append('nsfw', '' + nsfw)
+    formData.append('commentsEnabled', '' + commentsEnabled)
     formData.append('channelId', '' + channelId)
     formData.append('videofile', videofile)
 
diff --git a/client/src/app/videos/+video-watch/comment/video-comments.component.html b/client/src/app/videos/+video-watch/comment/video-comments.component.html
index 5c6908150..078900e06 100644
--- a/client/src/app/videos/+video-watch/comment/video-comments.component.html
+++ b/client/src/app/videos/+video-watch/comment/video-comments.component.html
@@ -3,35 +3,43 @@
     Comments
   </div>
 
-  <my-video-comment-add
-    *ngIf="isUserLoggedIn()"
-    [video]="video"
-    (commentCreated)="onCommentThreadCreated($event)"
-  ></my-video-comment-add>
+  <ng-template [ngIf]="video.commentsEnabled === true">
+    <my-video-comment-add
+      *ngIf="isUserLoggedIn()"
+      [video]="video"
+      (commentCreated)="onCommentThreadCreated($event)"
+    ></my-video-comment-add>
 
-  <div
-    class="comment-threads"
-    infiniteScroll
-    [infiniteScrollUpDistance]="1.5"
-    [infiniteScrollDistance]="0.5"
-    (scrolled)="onNearOfBottom()"
-  >
-    <div *ngFor="let comment of comments">
-      <my-video-comment
-        [comment]="comment"
-        [video]="video"
-        [inReplyToCommentId]="inReplyToCommentId"
-        [commentTree]="threadComments[comment.id]"
-        (wantedToReply)="onWantedToReply($event)"
-        (resetReply)="onResetReply()"
-      ></my-video-comment>
+    <div *ngIf="componentPagination.totalItems === 0 && comments.length === 0">No comments.</div>
 
-      <div *ngIf="comment.totalReplies !== 0 && !threadComments[comment.id]" (click)="viewReplies(comment)" class="view-replies">
-        View all {{ comment.totalReplies }} replies
+    <div
+      class="comment-threads"
+      infiniteScroll
+      [infiniteScrollUpDistance]="1.5"
+      [infiniteScrollDistance]="0.5"
+      (scrolled)="onNearOfBottom()"
+    >
+      <div *ngFor="let comment of comments">
+        <my-video-comment
+          [comment]="comment"
+          [video]="video"
+          [inReplyToCommentId]="inReplyToCommentId"
+          [commentTree]="threadComments[comment.id]"
+          (wantedToReply)="onWantedToReply($event)"
+          (resetReply)="onResetReply()"
+        ></my-video-comment>
 
-        <span *ngIf="!threadLoading[comment.id]" class="glyphicon glyphicon-menu-down"></span>
-        <my-loader class="comment-thread-loading" [loading]="threadLoading[comment.id]"></my-loader>
+        <div *ngIf="comment.totalReplies !== 0 && !threadComments[comment.id]" (click)="viewReplies(comment)" class="view-replies">
+          View all {{ comment.totalReplies }} replies
+
+          <span *ngIf="!threadLoading[comment.id]" class="glyphicon glyphicon-menu-down"></span>
+          <my-loader class="comment-thread-loading" [loading]="threadLoading[comment.id]"></my-loader>
+        </div>
       </div>
     </div>
+  </ng-template>
+
+  <div *ngIf="video.commentsEnabled === false">
+    Comments are disabled.
   </div>
 </div>
diff --git a/client/src/app/videos/+video-watch/comment/video-comments.component.ts b/client/src/app/videos/+video-watch/comment/video-comments.component.ts
index f4dda9089..4d801c970 100644
--- a/client/src/app/videos/+video-watch/comment/video-comments.component.ts
+++ b/client/src/app/videos/+video-watch/comment/video-comments.component.ts
@@ -5,6 +5,7 @@ import { AuthService } from '../../../core/auth'
 import { ComponentPagination } from '../../../shared/rest/component-pagination.model'
 import { User } from '../../../shared/users'
 import { SortField } from '../../../shared/video/sort-field.type'
+import { VideoDetails } from '../../../shared/video/video-details.model'
 import { Video } from '../../../shared/video/video.model'
 import { VideoComment } from './video-comment.model'
 import { VideoCommentService } from './video-comment.service'
@@ -15,7 +16,7 @@ import { VideoCommentService } from './video-comment.service'
   styleUrls: ['./video-comments.component.scss']
 })
 export class VideoCommentsComponent implements OnInit {
-  @Input() video: Video
+  @Input() video: VideoDetails
   @Input() user: User
 
   comments: VideoComment[] = []
@@ -36,7 +37,9 @@ export class VideoCommentsComponent implements OnInit {
   ) {}
 
   ngOnInit () {
-    this.loadMoreComments()
+    if (this.video.commentsEnabled === true) {
+      this.loadMoreComments()
+    }
   }
 
   viewReplies (comment: VideoComment) {