X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-watch%2Fcomment%2Fvideo-comments.component.ts;h=2616820d2462df10f02c5379ae1f6b95e067d619;hb=43483d12963ed7a82adee2e35a7bcb7e55e54b3e;hp=72f66ff09687eac108d04db4efca60cf1685d345;hpb=25acef90a85c1584880dec96aa402f896af8364a;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 72f66ff09..2616820d2 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,17 +1,17 @@ -import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core' +import { Component, ElementRef, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild } from '@angular/core' import { ActivatedRoute } from '@angular/router' -import { ConfirmService } from '@app/core' -import { NotificationsService } from 'angular2-notifications' +import { ConfirmService, Notifier } from '@app/core' import { Subscription } from 'rxjs' import { VideoCommentThreadTree } from '../../../../../../shared/models/videos/video-comment.model' import { AuthService } from '../../../core/auth' -import { ComponentPagination } from '../../../shared/rest/component-pagination.model' +import { ComponentPagination, hasMoreItems } from '../../../shared/rest/component-pagination.model' import { User } from '../../../shared/users' import { VideoSortField } from '../../../shared/video/sort-field.type' 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 +19,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,11 +35,13 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { threadComments: { [ id: number ]: VideoCommentThreadTree } = {} threadLoading: { [ id: number ]: boolean } = {} + syndicationItems: Syndication[] = [] + private sub: Subscription constructor ( private authService: AuthService, - private notificationsService: NotificationsService, + private notifier: Notifier, private confirmService: ConfirmService, private videoCommentService: VideoCommentService, private activatedRoute: ActivatedRoute, @@ -76,10 +79,15 @@ 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(() => this.commentHighlightBlock.nativeElement.scrollIntoView(), 0) + } }, - err => this.notificationsService.error(this.i18n('Error'), err.message) + err => this.notifier.error(err.message) ) } @@ -91,7 +99,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { this.componentPagination.totalItems = res.totalComments }, - err => this.notificationsService.error(this.i18n('Error'), err.message) + err => this.notifier.error(err.message) ) } @@ -138,9 +146,11 @@ 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) + err => this.notifier.error(err.message) ) } @@ -151,22 +161,11 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { onNearOfBottom () { this.componentPagination.currentPage++ - if (this.hasMoreComments()) { + if (hasMoreItems(this.componentPagination)) { this.loadMoreComments() } } - private hasMoreComments () { - // No results - if (this.componentPagination.totalItems === 0) return false - - // Not loaded yet - if (!this.componentPagination.totalItems) return true - - const maxPage = this.componentPagination.totalItems / this.componentPagination.itemsPerPage - return maxPage > this.componentPagination.currentPage - } - private deleteLocalCommentThread (parentComment: VideoCommentThreadTree, commentToDelete: VideoComment) { for (const commentChild of parentComment.children) { if (commentChild.comment.id === commentToDelete.id) { @@ -189,6 +188,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() } }