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"> <div class="comment-account-date">
<a target="_blank" [href]="comment.account.url" class="comment-account">{{ comment.by }}</a> <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>
<div class="comment-html" [innerHTML]="sanitizedCommentHTML"></div> <div class="comment-html" [innerHTML]="sanitizedCommentHTML"></div>

View File

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

View File

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