aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-01-04 17:50:30 +0100
committerChocobozzz <me@florianbigard.com>2018-01-04 17:50:30 +0100
commit2890b615f31ab7d519d8be66b49ff8712df90c51 (patch)
tree4ad6bf366416a1cbc4d39bc8b7747f6d985b4d19 /client/src/app
parentc3badc81fe3d78601fb278a7f28eeed63060d300 (diff)
downloadPeerTube-2890b615f31ab7d519d8be66b49ff8712df90c51.tar.gz
PeerTube-2890b615f31ab7d519d8be66b49ff8712df90c51.tar.zst
PeerTube-2890b615f31ab7d519d8be66b49ff8712df90c51.zip
Handle HTML is comments
Diffstat (limited to 'client/src/app')
-rw-r--r--client/src/app/videos/+video-watch/comment/video-comment.component.html2
-rw-r--r--client/src/app/videos/+video-watch/comment/video-comment.component.scss8
-rw-r--r--client/src/app/videos/+video-watch/comment/video-comment.component.ts13
3 files changed, 20 insertions, 3 deletions
diff --git a/client/src/app/videos/+video-watch/comment/video-comment.component.html b/client/src/app/videos/+video-watch/comment/video-comment.component.html
index 4f9597607..8edd12124 100644
--- a/client/src/app/videos/+video-watch/comment/video-comment.component.html
+++ b/client/src/app/videos/+video-watch/comment/video-comment.component.html
@@ -6,7 +6,7 @@
6 <a target="_blank" [href]="comment.account.url" class="comment-account">{{ comment.by }}</a> 6 <a target="_blank" [href]="comment.account.url" class="comment-account">{{ comment.by }}</a>
7 <div class="comment-date">{{ comment.createdAt | myFromNow }}</div> 7 <div class="comment-date">{{ comment.createdAt | myFromNow }}</div>
8 </div> 8 </div>
9 <div>{{ comment.text }}</div> 9 <div class="comment-html" [innerHTML]="sanitizedCommentHTML"></div>
10 10
11 <div class="comment-actions"> 11 <div class="comment-actions">
12 <div *ngIf="isUserLoggedIn()" (click)="onWantToReply()" class="comment-action-reply">Reply</div> 12 <div *ngIf="isUserLoggedIn()" (click)="onWantToReply()" class="comment-action-reply">Reply</div>
diff --git a/client/src/app/videos/+video-watch/comment/video-comment.component.scss b/client/src/app/videos/+video-watch/comment/video-comment.component.scss
index a22c5a9fd..8e53dbca8 100644
--- a/client/src/app/videos/+video-watch/comment/video-comment.component.scss
+++ b/client/src/app/videos/+video-watch/comment/video-comment.component.scss
@@ -32,6 +32,14 @@
32 } 32 }
33 } 33 }
34 34
35 .comment-html {
36 a {
37 @include disable-default-a-behaviour;
38
39 color: #000;
40 }
41 }
42
35 .comment-actions { 43 .comment-actions {
36 margin: 10px 0; 44 margin: 10px 0;
37 display: flex; 45 display: flex;
diff --git a/client/src/app/videos/+video-watch/comment/video-comment.component.ts b/client/src/app/videos/+video-watch/comment/video-comment.component.ts
index 9bc9c8844..2ecc8a143 100644
--- a/client/src/app/videos/+video-watch/comment/video-comment.component.ts
+++ b/client/src/app/videos/+video-watch/comment/video-comment.component.ts
@@ -1,4 +1,5 @@
1import { Component, EventEmitter, Input, Output } from '@angular/core' 1import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
2import * as sanitizeHtml from 'sanitize-html'
2import { Account as AccountInterface } from '../../../../../../shared/models/actors' 3import { Account as AccountInterface } from '../../../../../../shared/models/actors'
3import { UserRight } from '../../../../../../shared/models/users' 4import { UserRight } from '../../../../../../shared/models/users'
4import { VideoCommentThreadTree } from '../../../../../../shared/models/videos/video-comment.model' 5import { VideoCommentThreadTree } from '../../../../../../shared/models/videos/video-comment.model'
@@ -12,7 +13,7 @@ import { VideoComment } from './video-comment.model'
12 templateUrl: './video-comment.component.html', 13 templateUrl: './video-comment.component.html',
13 styleUrls: ['./video-comment.component.scss'] 14 styleUrls: ['./video-comment.component.scss']
14}) 15})
15export class VideoCommentComponent { 16export class VideoCommentComponent implements OnInit {
16 @Input() video: Video 17 @Input() video: Video
17 @Input() comment: VideoComment 18 @Input() comment: VideoComment
18 @Input() commentTree: VideoCommentThreadTree 19 @Input() commentTree: VideoCommentThreadTree
@@ -23,12 +24,20 @@ export class VideoCommentComponent {
23 @Output() threadCreated = new EventEmitter<VideoCommentThreadTree>() 24 @Output() threadCreated = new EventEmitter<VideoCommentThreadTree>()
24 @Output() resetReply = new EventEmitter() 25 @Output() resetReply = new EventEmitter()
25 26
27 sanitizedCommentHTML = ''
28
26 constructor (private authService: AuthService) {} 29 constructor (private authService: AuthService) {}
27 30
28 get user () { 31 get user () {
29 return this.authService.getUser() 32 return this.authService.getUser()
30 } 33 }
31 34
35 ngOnInit () {
36 this.sanitizedCommentHTML = sanitizeHtml(this.comment.text, {
37 allowedTags: [ 'p', 'span' ]
38 })
39 }
40
32 onCommentReplyCreated (createdComment: VideoComment) { 41 onCommentReplyCreated (createdComment: VideoComment) {
33 if (!this.commentTree) { 42 if (!this.commentTree) {
34 this.commentTree = { 43 this.commentTree = {