From 57a49263e48739c31cd339730ac4cb24e3d5d723 Mon Sep 17 00:00:00 2001 From: Benjamin Bouvier Date: Sun, 7 Jan 2018 14:48:10 +0100 Subject: A few updates for the watch video view (#181) * Fixes #156: Filter out the video being watched from the list of other videos of the same author; * Fixes #167: in the video view, hide the author's domain when it's from the current host; * Fixes #171: Allow undoing a like/dislike; --- client/src/app/shared/video/video.model.ts | 7 ++- client/src/app/shared/video/video.service.ts | 4 ++ .../videos/+video-watch/video-watch.component.html | 2 +- .../videos/+video-watch/video-watch.component.ts | 71 +++++++++++++--------- 4 files changed, 53 insertions(+), 31 deletions(-) (limited to 'client') diff --git a/client/src/app/shared/video/video.model.ts b/client/src/app/shared/video/video.model.ts index 060bf933f..a4b90ad94 100644 --- a/client/src/app/shared/video/video.model.ts +++ b/client/src/app/shared/video/video.model.ts @@ -35,7 +35,10 @@ export class Video implements VideoServerModel { nsfw: boolean account: Account - private static createByString (account: string, serverHost: string) { + private static createByString (account: string, serverHost: string, apiURL: string) { + const thisHost = new URL(apiURL).host + if (serverHost.trim() === thisHost) + return account return account + '@' + serverHost } @@ -78,7 +81,7 @@ export class Video implements VideoServerModel { this.dislikes = hash.dislikes this.nsfw = hash.nsfw - this.by = Video.createByString(hash.accountName, hash.serverHost) + this.by = Video.createByString(hash.accountName, hash.serverHost, absoluteAPIUrl) } isVideoNSFWForUser (user: User) { diff --git a/client/src/app/shared/video/video.service.ts b/client/src/app/shared/video/video.service.ts index 073acb2b6..50761ca0c 100644 --- a/client/src/app/shared/video/video.service.ts +++ b/client/src/app/shared/video/video.service.ts @@ -136,6 +136,10 @@ export class VideoService { return this.setVideoRate(id, 'dislike') } + unsetVideoLike (id: number) { + return this.setVideoRate(id, 'none') + } + getUserVideoRating (id: number): Observable { const url = UserService.BASE_USERS_URL + 'me/videos/' + id + '/rating' diff --git a/client/src/app/videos/+video-watch/video-watch.component.html b/client/src/app/videos/+video-watch/video-watch.component.html index 514a86e28..a5c387638 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.html +++ b/client/src/app/videos/+video-watch/video-watch.component.html @@ -165,7 +165,7 @@ Other videos -
+
diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts index f1f194764..01e4bbf4a 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.ts +++ b/client/src/app/videos/+video-watch/video-watch.component.ts @@ -29,6 +29,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { @ViewChild('videoReportModal') videoReportModal: VideoReportComponent otherVideos: Video[] = [] + otherVideosDisplayed: Video[] = [] error = false loading = false @@ -69,8 +70,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.videoService.getVideos({ currentPage: 1, itemsPerPage: 5 }, '-createdAt') .subscribe( data => this.otherVideos = data.videos, - - err => console.error(err) + err => console.error(err) ) this.paramsSub = this.route.params.subscribe(routeParams => { @@ -102,36 +102,22 @@ export class VideoWatchComponent implements OnInit, OnDestroy { setLike () { if (this.isUserLoggedIn() === false) return - // Already liked this video - if (this.userRating === 'like') return - - this.videoService.setVideoLike(this.video.id) - .subscribe( - () => { - // Update the video like attribute - this.updateVideoRating(this.userRating, 'like') - this.userRating = 'like' - }, - - err => this.notificationsService.error('Error', err.message) - ) + if (this.userRating === 'like') { + // Already liked this video + this.setRating('none') + } else { + this.setRating('like') + } } setDislike () { if (this.isUserLoggedIn() === false) return - // Already disliked this video - if (this.userRating === 'dislike') return - - this.videoService.setVideoDislike(this.video.id) - .subscribe( - () => { - // Update the video dislike attribute - this.updateVideoRating(this.userRating, 'dislike') - this.userRating = 'dislike' - }, - - err => this.notificationsService.error('Error', err.message) - ) + if (this.userRating === 'dislike') { + // Already disliked this video + this.setRating('none') + } else { + this.setRating('dislike') + } } blacklistVideo (event: Event) { @@ -303,6 +289,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy { private onVideoFetched (video: VideoDetails) { this.video = video + if (this.otherVideos.length > 0) { + this.otherVideosDisplayed = this.otherVideos.filter(v => v.uuid !== this.video.uuid) + } + let observable if (this.video.isVideoNSFWForUser(this.user)) { observable = this.confirmService.confirm( @@ -366,6 +356,31 @@ export class VideoWatchComponent implements OnInit, OnDestroy { ) } + private setRating (nextRating) { + let method + switch (nextRating) { + case 'like': + method = this.videoService.setVideoLike + break + case 'dislike': + method = this.videoService.setVideoDislike + break + case 'none': + method = this.videoService.unsetVideoLike + break + } + + method.call(this.videoService, this.video.id) + .subscribe( + () => { + // Update the video like attribute + this.updateVideoRating(this.userRating, nextRating) + this.userRating = nextRating + }, + err => this.notificationsService.error('Error', err.message) + ) + } + private updateVideoRating (oldRating: UserVideoRateType, newRating: VideoRateType) { let likesToIncrement = 0 let dislikesToIncrement = 0 -- cgit v1.2.3