Fix comment highlight

This commit is contained in:
Chocobozzz 2018-02-21 17:46:04 +01:00
parent b10ba55aca
commit 5b8072ee0b
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
3 changed files with 16 additions and 16 deletions

View File

@ -6,7 +6,7 @@
<div class="comment-account-date">
<a target="_blank" [href]="comment.account.url" class="comment-account">{{ comment.by }}</a>
<a [routerLink]="['/videos/watch', video.uuid, { 'commentId': comment.id }]" class="comment-date">{{ comment.createdAt | myFromNow }}</a>
<a [routerLink]="['/videos/watch', video.uuid, { 'threadId': comment.threadId }]" class="comment-date">{{ comment.createdAt | myFromNow }}</a>
</div>
<div class="comment-html" [innerHTML]="sanitizedCommentHTML"></div>

View File

@ -19,12 +19,12 @@
[autoLoading]="true"
(nearOfBottom)="onNearOfBottom()"
>
<div *ngIf="highlightedComment" id="highlighted-comment">
<div *ngIf="highlightedThread" id="highlighted-comment">
<my-video-comment
[comment]="highlightedComment"
[comment]="highlightedThread"
[video]="video"
[inReplyToCommentId]="inReplyToCommentId"
[commentTree]="threadComments[highlightedComment.id]"
[commentTree]="threadComments[highlightedThread.id]"
[highlightedComment]="true"
(wantedToReply)="onWantedToReply($event)"
(wantedToDelete)="onWantedToDelete($event)"
@ -35,7 +35,7 @@
<div *ngFor="let comment of comments">
<my-video-comment
*ngIf="!highlightedComment || comment.id !== highlightedComment.id"
*ngIf="!highlightedThread || comment.id !== highlightedThread.id"
[comment]="comment"
[video]="video"
[inReplyToCommentId]="inReplyToCommentId"

View File

@ -22,7 +22,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
@Input() user: User
comments: VideoComment[] = []
highlightedComment: VideoComment
highlightedThread: VideoComment
sort: SortField = '-createdAt'
componentPagination: ComponentPagination = {
currentPage: 1,
@ -47,9 +47,9 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
// Find highlighted comment in params
this.sub = this.activatedRoute.params.subscribe(
params => {
if (params['commentId']) {
const highlightedCommentId = +params['commentId']
this.processHighlightedComment(highlightedCommentId)
if (params['threadId']) {
const highlightedThreadId = +params['threadId']
this.processHighlightedThread(highlightedThreadId)
}
}
)
@ -65,7 +65,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
if (this.sub) this.sub.unsubscribe()
}
viewReplies (commentId: number, highlightComment = false) {
viewReplies (commentId: number, highlightThread = false) {
this.threadLoading[commentId] = true
this.videoCommentService.getVideoThreadComments(this.video.id, commentId)
@ -74,7 +74,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
this.threadComments[commentId] = res
this.threadLoading[commentId] = false
if (highlightComment) this.highlightedComment = new VideoComment(res.comment)
if (highlightThread) this.highlightedThread = new VideoComment(res.comment)
},
err => this.notificationsService.error('Error', err.message)
@ -180,7 +180,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
private resetVideo () {
if (this.video.commentsEnabled === true) {
// Reset all our fields
this.highlightedComment = null
this.highlightedThread = null
this.comments = []
this.threadComments = {}
this.threadLoading = {}
@ -192,10 +192,10 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
}
}
private processHighlightedComment (highlightedCommentId: number) {
this.highlightedComment = this.comments.find(c => c.id === highlightedCommentId)
private processHighlightedThread (highlightedThreadId: number) {
this.highlightedThread = this.comments.find(c => c.id === highlightedThreadId)
const highlightComment = true
this.viewReplies(highlightedCommentId, highlightComment)
const highlightThread = true
this.viewReplies(highlightedThreadId, highlightThread)
}
}