4a424807302564646db1e7d812cfe013045323a8
[oweals/peertube.git] / client / src / app / videos / +video-watch / comment / video-comments.component.html
1 <div>
2   <div class="title-page title-page-single">
3     Comments
4   </div>
5
6   <ng-template [ngIf]="video.commentsEnabled === true">
7     <my-video-comment-add
8       *ngIf="isUserLoggedIn()"
9       [video]="video"
10       [user]="user"
11       (commentCreated)="onCommentThreadCreated($event)"
12     ></my-video-comment-add>
13
14     <div *ngIf="componentPagination.totalItems === 0 && comments.length === 0">No comments.</div>
15
16     <div
17       class="comment-threads"
18       infiniteScroll
19       [infiniteScrollUpDistance]="1.5"
20       [infiniteScrollDistance]="0.5"
21       (scrolled)="onNearOfBottom()"
22     >
23       <div *ngFor="let comment of comments">
24         <my-video-comment
25           [comment]="comment"
26           [video]="video"
27           [inReplyToCommentId]="inReplyToCommentId"
28           [commentTree]="threadComments[comment.id]"
29           (wantedToReply)="onWantedToReply($event)"
30           (resetReply)="onResetReply()"
31         ></my-video-comment>
32
33         <div *ngIf="comment.totalReplies !== 0 && !threadComments[comment.id]" (click)="viewReplies(comment)" class="view-replies">
34           View all {{ comment.totalReplies }} replies
35
36           <span *ngIf="!threadLoading[comment.id]" class="glyphicon glyphicon-menu-down"></span>
37           <my-loader class="comment-thread-loading" [loading]="threadLoading[comment.id]"></my-loader>
38         </div>
39       </div>
40     </div>
41   </ng-template>
42
43   <div *ngIf="video.commentsEnabled === false">
44     Comments are disabled.
45   </div>
46 </div>