X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-watch%2Fcomment%2Fvideo-comments.component.ts;h=8850eccd80213a4bb1e98e8324075e1b5be20ec5;hb=e0e665f0efa98f2701dd9f5529e99989680481ae;hp=8c6ddb89e511955146f2f9ffdb3daed32cfb66c6;hpb=b1d40cff89f7cff565a98cdbcea9a624196a169a;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/videos/+video-watch/comment/video-comments.component.ts b/client/src/app/videos/+video-watch/comment/video-comments.component.ts index 8c6ddb89e..8850eccd8 100644 --- a/client/src/app/videos/+video-watch/comment/video-comments.component.ts +++ b/client/src/app/videos/+video-watch/comment/video-comments.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core' +import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild, ElementRef } from '@angular/core' import { ActivatedRoute } from '@angular/router' import { ConfirmService } from '@app/core' import { NotificationsService } from 'angular2-notifications' @@ -12,6 +12,7 @@ import { VideoDetails } from '../../../shared/video/video-details.model' import { VideoComment } from './video-comment.model' import { VideoCommentService } from './video-comment.service' import { I18n } from '@ngx-translate/i18n-polyfill' +import { Syndication } from '@app/shared/video/syndication.model' @Component({ selector: 'my-video-comments', @@ -19,6 +20,7 @@ import { I18n } from '@ngx-translate/i18n-polyfill' styleUrls: ['./video-comments.component.scss'] }) export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { + @ViewChild('commentHighlightBlock') commentHighlightBlock: ElementRef @Input() video: VideoDetails @Input() user: User @@ -34,6 +36,8 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { threadComments: { [ id: number ]: VideoCommentThreadTree } = {} threadLoading: { [ id: number ]: boolean } = {} + syndicationItems: Syndication[] = [] + private sub: Subscription constructor ( @@ -76,7 +80,16 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { this.threadComments[commentId] = res this.threadLoading[commentId] = false - if (highlightThread) this.highlightedThread = new VideoComment(res.comment) + if (highlightThread) { + this.highlightedThread = new VideoComment(res.comment) + + // Scroll to the highlighted thread + setTimeout(() => { + // -60 because of the fixed header + const scrollY = this.commentHighlightBlock.nativeElement.offsetTop - 60 + window.scroll(0, scrollY) + }, 500) + } }, err => this.notificationsService.error(this.i18n('Error'), err.message) @@ -114,7 +127,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { async onWantedToDelete (commentToDelete: VideoComment) { let message = 'Do you really want to delete this comment?' if (commentToDelete.totalReplies !== 0) { - message += this.i18n(' {{ totalReplies }} replies will be deleted too.', { totalReplies: commentToDelete.totalReplies }) + message += this.i18n(' {{totalReplies}} replies will be deleted too.', { totalReplies: commentToDelete.totalReplies }) } const res = await this.confirmService.confirm(message, this.i18n('Delete')) @@ -138,6 +151,8 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { // Delete the thread this.comments = this.comments.filter(c => c.id !== commentToDelete.id) this.componentPagination.totalItems-- + + if (this.highlightedThread.id === commentToDelete.id) this.highlightedThread = undefined }, err => this.notificationsService.error(this.i18n('Error'), err.message) @@ -189,6 +204,8 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { this.componentPagination.currentPage = 1 this.componentPagination.totalItems = null + this.syndicationItems = this.videoCommentService.getVideoCommentsFeeds(this.video.uuid) + this.loadMoreComments() } }