X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fvideo-playlist%2Fvideo-playlist.service.ts;h=38d915c6b626e23a34ce635d74e9e25c72a44966;hb=45c14ae1b2884e75c6341117489ea39ae0e1a3bc;hp=5f74dcd4c97d9a023fb65f22473907e9a6fc2405;hpb=c06af5012ecc925ca924e6e20db3a1d909b1148e;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/shared/video-playlist/video-playlist.service.ts b/client/src/app/shared/video-playlist/video-playlist.service.ts index 5f74dcd4c..38d915c6b 100644 --- a/client/src/app/shared/video-playlist/video-playlist.service.ts +++ b/client/src/app/shared/video-playlist/video-playlist.service.ts @@ -1,6 +1,6 @@ -import { bufferTime, catchError, filter, first, map, share, switchMap } from 'rxjs/operators' -import { Injectable } from '@angular/core' -import { Observable, ReplaySubject, Subject } from 'rxjs' +import { bufferTime, catchError, filter, map, observeOn, share, switchMap, tap } from 'rxjs/operators' +import { Injectable, NgZone } from '@angular/core' +import { asyncScheduler, merge, Observable, of, ReplaySubject, Subject } from 'rxjs' import { RestExtractor } from '../rest/rest-extractor.service' import { HttpClient, HttpParams } from '@angular/common/http' import { ResultList, VideoPlaylistElementCreate, VideoPlaylistElementUpdate } from '../../../../../shared' @@ -11,16 +11,23 @@ import { VideoChannel } from '@app/shared/video-channel/video-channel.model' import { VideoPlaylistCreate } from '@shared/models/videos/playlist/video-playlist-create.model' import { VideoPlaylistUpdate } from '@shared/models/videos/playlist/video-playlist-update.model' import { objectToFormData } from '@app/shared/misc/utils' -import { ServerService } from '@app/core' +import { AuthUser, ServerService } from '@app/core' import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model' import { AccountService } from '@app/shared/account/account.service' import { Account } from '@app/shared/account/account.model' import { RestService } from '@app/shared/rest' -import { VideoExistInPlaylist } from '@shared/models/videos/playlist/video-exist-in-playlist.model' +import { VideoExistInPlaylist, VideosExistInPlaylists } from '@shared/models/videos/playlist/video-exist-in-playlist.model' import { VideoPlaylistReorder } from '@shared/models/videos/playlist/video-playlist-reorder.model' -import { ComponentPagination } from '@app/shared/rest/component-pagination.model' +import { ComponentPaginationLight } from '@app/shared/rest/component-pagination.model' import { VideoPlaylistElement as ServerVideoPlaylistElement } from '@shared/models/videos/playlist/video-playlist-element.model' import { VideoPlaylistElement } from '@app/shared/video-playlist/video-playlist-element.model' +import { uniq } from 'lodash-es' +import * as debug from 'debug' +import { enterZone, leaveZone } from '@app/shared/rxjs/zone' + +const logger = debug('peertube:playlists:VideoPlaylistService') + +export type CachedPlaylist = VideoPlaylist | { id: number, displayName: string } @Injectable() export class VideoPlaylistService { @@ -28,24 +35,40 @@ export class VideoPlaylistService { static MY_VIDEO_PLAYLIST_URL = environment.apiUrl + '/api/v1/users/me/video-playlists/' // Use a replay subject because we "next" a value before subscribing - private videoExistsInPlaylistSubject: Subject = new ReplaySubject(1) - private readonly videoExistsInPlaylistObservable: Observable + private videoExistsInPlaylistNotifier = new ReplaySubject(1) + private videoExistsInPlaylistCacheSubject = new Subject() + private readonly videoExistsInPlaylistObservable: Observable + + private videoExistsObservableCache: { [ id: number ]: Observable } = {} + private videoExistsCache: { [ id: number ]: VideoExistInPlaylist[] } = {} + + private myAccountPlaylistCache: ResultList = undefined + private myAccountPlaylistCacheRunning: Observable> + private myAccountPlaylistCacheSubject = new Subject>() constructor ( private authHttp: HttpClient, private serverService: ServerService, private restExtractor: RestExtractor, - private restService: RestService + private restService: RestService, + private ngZone: NgZone ) { - this.videoExistsInPlaylistObservable = this.videoExistsInPlaylistSubject.pipe( - bufferTime(500), - filter(videoIds => videoIds.length !== 0), - switchMap(videoIds => this.doVideosExistInPlaylist(videoIds)), - share() + this.videoExistsInPlaylistObservable = merge( + this.videoExistsInPlaylistNotifier.pipe( + // We leave Angular zone so Protractor does not get stuck + bufferTime(500, leaveZone(this.ngZone, asyncScheduler)), + filter(videoIds => videoIds.length !== 0), + map(videoIds => uniq(videoIds)), + observeOn(enterZone(this.ngZone, asyncScheduler)), + switchMap(videoIds => this.doVideosExistInPlaylist(videoIds)), + share() + ), + + this.videoExistsInPlaylistCacheSubject ) } - listChannelPlaylists (videoChannel: VideoChannel, componentPagination: ComponentPagination): Observable> { + listChannelPlaylists (videoChannel: VideoChannel, componentPagination: ComponentPaginationLight): Observable> { const url = VideoChannelService.BASE_VIDEO_CHANNEL_URL + videoChannel.nameWithHost + '/video-playlists' const pagination = this.restService.componentPaginationToRestPagination(componentPagination) @@ -59,9 +82,30 @@ export class VideoPlaylistService { ) } + listMyPlaylistWithCache (user: AuthUser, search?: string) { + if (!search) { + if (this.myAccountPlaylistCacheRunning) return this.myAccountPlaylistCacheRunning + if (this.myAccountPlaylistCache) return of(this.myAccountPlaylistCache) + } + + const obs = this.listAccountPlaylists(user.account, undefined, '-updatedAt', search) + .pipe( + tap(result => { + if (!search) { + this.myAccountPlaylistCacheRunning = undefined + this.myAccountPlaylistCache = result + } + }), + share() + ) + + if (!search) this.myAccountPlaylistCacheRunning = obs + return obs + } + listAccountPlaylists ( account: Account, - componentPagination: ComponentPagination, + componentPagination: ComponentPaginationLight, sort: string, search?: string ): Observable> { @@ -96,6 +140,18 @@ export class VideoPlaylistService { return this.authHttp.post<{ videoPlaylist: { id: number } }>(VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL, data) .pipe( + tap(res => { + if (!this.myAccountPlaylistCache) return + + this.myAccountPlaylistCache.total++ + + this.myAccountPlaylistCache.data.push({ + id: res.videoPlaylist.id, + displayName: body.displayName + }) + + this.myAccountPlaylistCacheSubject.next(this.myAccountPlaylistCache) + }), catchError(err => this.restExtractor.handleError(err)) ) } @@ -106,6 +162,14 @@ export class VideoPlaylistService { return this.authHttp.put(VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL + videoPlaylist.id, data) .pipe( map(this.restExtractor.extractDataBool), + tap(() => { + if (!this.myAccountPlaylistCache) return + + const playlist = this.myAccountPlaylistCache.data.find(p => p.id === videoPlaylist.id) + playlist.displayName = body.displayName + + this.myAccountPlaylistCacheSubject.next(this.myAccountPlaylistCache) + }), catchError(err => this.restExtractor.handleError(err)) ) } @@ -114,6 +178,15 @@ export class VideoPlaylistService { return this.authHttp.delete(VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL + videoPlaylist.id) .pipe( map(this.restExtractor.extractDataBool), + tap(() => { + if (!this.myAccountPlaylistCache) return + + this.myAccountPlaylistCache.total-- + this.myAccountPlaylistCache.data = this.myAccountPlaylistCache.data + .filter(p => p.id !== videoPlaylist.id) + + this.myAccountPlaylistCacheSubject.next(this.myAccountPlaylistCache) + }), catchError(err => this.restExtractor.handleError(err)) ) } @@ -122,21 +195,49 @@ export class VideoPlaylistService { const url = VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL + playlistId + '/videos' return this.authHttp.post<{ videoPlaylistElement: { id: number } }>(url, body) - .pipe(catchError(err => this.restExtractor.handleError(err))) + .pipe( + tap(res => { + const existsResult = this.videoExistsCache[body.videoId] + existsResult.push({ + playlistId, + playlistElementId: res.videoPlaylistElement.id, + startTimestamp: body.startTimestamp, + stopTimestamp: body.stopTimestamp + }) + + this.runPlaylistCheck(body.videoId) + }), + catchError(err => this.restExtractor.handleError(err)) + ) } - updateVideoOfPlaylist (playlistId: number, playlistElementId: number, body: VideoPlaylistElementUpdate) { + updateVideoOfPlaylist (playlistId: number, playlistElementId: number, body: VideoPlaylistElementUpdate, videoId: number) { return this.authHttp.put(VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL + playlistId + '/videos/' + playlistElementId, body) .pipe( map(this.restExtractor.extractDataBool), + tap(() => { + const existsResult = this.videoExistsCache[videoId] + const elem = existsResult.find(e => e.playlistElementId === playlistElementId) + + elem.startTimestamp = body.startTimestamp + elem.stopTimestamp = body.stopTimestamp + + this.runPlaylistCheck(videoId) + }), catchError(err => this.restExtractor.handleError(err)) ) } - removeVideoFromPlaylist (playlistId: number, playlistElementId: number) { + removeVideoFromPlaylist (playlistId: number, playlistElementId: number, videoId?: number) { return this.authHttp.delete(VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL + playlistId + '/videos/' + playlistElementId) .pipe( map(this.restExtractor.extractDataBool), + tap(() => { + if (!videoId) return + + this.videoExistsCache[videoId] = this.videoExistsCache[videoId].filter(e => e.playlistElementId !== playlistElementId) + this.runPlaylistCheck(videoId) + }), catchError(err => this.restExtractor.handleError(err)) ) } @@ -156,7 +257,7 @@ export class VideoPlaylistService { getPlaylistVideos ( videoPlaylistId: number | string, - componentPagination: ComponentPagination + componentPagination: ComponentPaginationLight ): Observable> { const path = VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL + videoPlaylistId + '/videos' const pagination = this.restService.componentPaginationToRestPagination(componentPagination) @@ -172,10 +273,37 @@ export class VideoPlaylistService { ) } - doesVideoExistInPlaylist (videoId: number) { - this.videoExistsInPlaylistSubject.next(videoId) + listenToMyAccountPlaylistsChange () { + return this.myAccountPlaylistCacheSubject.asObservable() + } + + listenToVideoPlaylistChange (videoId: number) { + if (this.videoExistsObservableCache[ videoId ]) { + return this.videoExistsObservableCache[ videoId ] + } + + const obs = this.videoExistsInPlaylistObservable + .pipe( + map(existsResult => existsResult[ videoId ]), + filter(r => !!r), + tap(result => this.videoExistsCache[ videoId ] = result) + ) + + this.videoExistsObservableCache[ videoId ] = obs + return obs + } + + runPlaylistCheck (videoId: number) { + logger('Running playlist check.') + + if (this.videoExistsCache[videoId]) { + logger('Found cache for %d.', videoId) + + return this.videoExistsInPlaylistCacheSubject.next({ [videoId]: this.videoExistsCache[videoId] }) + } - return this.videoExistsInPlaylistObservable.pipe(first()) + logger('Fetching from network for %d.', videoId) + return this.videoExistsInPlaylistNotifier.next(videoId) } extractPlaylists (result: ResultList) { @@ -217,13 +345,13 @@ export class VideoPlaylistService { ) } - private doVideosExistInPlaylist (videoIds: number[]): Observable { + private doVideosExistInPlaylist (videoIds: number[]): Observable { const url = VideoPlaylistService.MY_VIDEO_PLAYLIST_URL + 'videos-exist' let params = new HttpParams() params = this.restService.addObjectParams(params, { videoIds }) - return this.authHttp.get(url, { params }) + return this.authHttp.get(url, { params, headers: { ignoreLoadingBar: '' } }) .pipe(catchError(err => this.restExtractor.handleError(err))) } }