Lazy load all routes
[oweals/peertube.git] / client / src / app / +videos / +video-watch / comment / video-comment.component.ts
1 import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core'
2 import { MarkdownService, Notifier, UserService } from '@app/core'
3 import { AuthService } from '@app/core/auth'
4 import { Account, Actor, Video } from '@app/shared/shared-main'
5 import { User, UserRight } from '@shared/models'
6 import { VideoCommentThreadTree } from './video-comment-thread-tree.model'
7 import { VideoComment } from './video-comment.model'
8
9 @Component({
10   selector: 'my-video-comment',
11   templateUrl: './video-comment.component.html',
12   styleUrls: ['./video-comment.component.scss']
13 })
14 export class VideoCommentComponent implements OnInit, OnChanges {
15   @Input() video: Video
16   @Input() comment: VideoComment
17   @Input() parentComments: VideoComment[] = []
18   @Input() commentTree: VideoCommentThreadTree
19   @Input() inReplyToCommentId: number
20   @Input() highlightedComment = false
21   @Input() firstInThread = false
22
23   @Output() wantedToDelete = new EventEmitter<VideoComment>()
24   @Output() wantedToReply = new EventEmitter<VideoComment>()
25   @Output() threadCreated = new EventEmitter<VideoCommentThreadTree>()
26   @Output() resetReply = new EventEmitter()
27   @Output() timestampClicked = new EventEmitter<number>()
28
29   sanitizedCommentHTML = ''
30   newParentComments: VideoComment[] = []
31
32   commentAccount: Account
33   commentUser: User
34
35   constructor (
36     private markdownService: MarkdownService,
37     private authService: AuthService,
38     private userService: UserService,
39     private notifier: Notifier
40   ) {}
41
42   get user () {
43     return this.authService.getUser()
44   }
45
46   ngOnInit () {
47     this.init()
48   }
49
50   ngOnChanges () {
51     this.init()
52   }
53
54   onCommentReplyCreated (createdComment: VideoComment) {
55     if (!this.commentTree) {
56       this.commentTree = {
57         comment: this.comment,
58         children: []
59       }
60
61       this.threadCreated.emit(this.commentTree)
62     }
63
64     this.commentTree.children.unshift({
65       comment: createdComment,
66       children: []
67     })
68     this.resetReply.emit()
69   }
70
71   onWantToReply (comment?: VideoComment) {
72     this.wantedToReply.emit(comment || this.comment)
73   }
74
75   onWantToDelete (comment?: VideoComment) {
76     this.wantedToDelete.emit(comment || this.comment)
77   }
78
79   isUserLoggedIn () {
80     return this.authService.isLoggedIn()
81   }
82
83   onResetReply () {
84     this.resetReply.emit()
85   }
86
87   handleTimestampClicked (timestamp: number) {
88     this.timestampClicked.emit(timestamp)
89   }
90
91   isRemovableByUser () {
92     return this.comment.account && this.isUserLoggedIn() &&
93       (
94         this.user.account.id === this.comment.account.id ||
95         this.user.account.id === this.video.account.id ||
96         this.user.hasRight(UserRight.REMOVE_ANY_VIDEO_COMMENT)
97       )
98   }
99
100   switchToDefaultAvatar ($event: Event) {
101     ($event.target as HTMLImageElement).src = Actor.GET_DEFAULT_AVATAR_URL()
102   }
103
104   private getUserIfNeeded (account: Account) {
105     if (!account.userId) return
106     if (!this.authService.isLoggedIn()) return
107
108     const user = this.authService.getUser()
109     if (user.hasRight(UserRight.MANAGE_USERS)) {
110       this.userService.getUserWithCache(account.userId)
111           .subscribe(
112             user => this.commentUser = user,
113
114             err => this.notifier.error(err.message)
115           )
116     }
117   }
118
119   private async init () {
120     const html = await this.markdownService.textMarkdownToHTML(this.comment.text, true)
121     this.sanitizedCommentHTML = await this.markdownService.processVideoTimestamps(html)
122     this.newParentComments = this.parentComments.concat([ this.comment ])
123
124     if (this.comment.account) {
125       this.commentAccount = new Account(this.comment.account)
126       this.getUserIfNeeded(this.commentAccount)
127     } else {
128       this.comment.account = null
129     }
130   }
131 }