From 57a49263e48739c31cd339730ac4cb24e3d5d723 Mon Sep 17 00:00:00 2001 From: Benjamin Bouvier Date: Sun, 7 Jan 2018 14:48:10 +0100 Subject: [PATCH] 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 ++ .../+video-watch/video-watch.component.html | 2 +- .../+video-watch/video-watch.component.ts | 71 +++++++++++-------- server/controllers/api/videos/rate.ts | 1 - server/helpers/custom-validators/videos.ts | 2 +- shared/models/videos/video-rate.type.ts | 2 +- 7 files changed, 55 insertions(+), 34 deletions(-) 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 diff --git a/server/controllers/api/videos/rate.ts b/server/controllers/api/videos/rate.ts index b470f27f6..a7bd570eb 100644 --- a/server/controllers/api/videos/rate.ts +++ b/server/controllers/api/videos/rate.ts @@ -62,7 +62,6 @@ async function rateVideo (req: express.Request, res: express.Response) { await previousRate.destroy({ transaction: t }) } else { // Update previous rate previousRate.type = rateType - await previousRate.save({ transaction: t }) } } else if (rateType !== 'none') { // There was not a previous rate, insert a new one if there is a rate diff --git a/server/helpers/custom-validators/videos.ts b/server/helpers/custom-validators/videos.ts index 1a5fdb887..0e8a2aab2 100644 --- a/server/helpers/custom-validators/videos.ts +++ b/server/helpers/custom-validators/videos.ts @@ -65,7 +65,7 @@ function isVideoViewsValid (value: string) { } function isVideoRatingTypeValid (value: string) { - return values(VIDEO_RATE_TYPES).indexOf(value as VideoRateType) !== -1 + return value === 'none' || values(VIDEO_RATE_TYPES).indexOf(value as VideoRateType) !== -1 } function isVideoFile (files: { [ fieldname: string ]: Express.Multer.File[] } | Express.Multer.File[]) { diff --git a/shared/models/videos/video-rate.type.ts b/shared/models/videos/video-rate.type.ts index d48774a4b..17aaba5a5 100644 --- a/shared/models/videos/video-rate.type.ts +++ b/shared/models/videos/video-rate.type.ts @@ -1 +1 @@ -export type VideoRateType = 'like' | 'dislike' +export type VideoRateType = 'like' | 'dislike' | 'none' -- 2.25.1