From 706c5a4743e1ec29da1a21173da70d39b711fadc Mon Sep 17 00:00:00 2001 From: Rigel Kent Date: Thu, 12 Dec 2019 18:11:55 +0100 Subject: [PATCH] change repeat icon and factorize functions --- .../video-watch-playlist.component.ts | 38 ++++++++++------ .../+video-watch/video-watch.component.ts | 43 +++++++++++++------ client/src/assets/images/global/repeat.svg | 13 +++++- 3 files changed, 66 insertions(+), 28 deletions(-) diff --git a/client/src/app/videos/+video-watch/video-watch-playlist.component.ts b/client/src/app/videos/+video-watch/video-watch-playlist.component.ts index c6b04fd4b..c5ed36000 100644 --- a/client/src/app/videos/+video-watch/video-watch-playlist.component.ts +++ b/client/src/app/videos/+video-watch/video-watch-playlist.component.ts @@ -44,11 +44,13 @@ export class VideoWatchPlaylistComponent { private videoPlaylist: VideoPlaylistService, private router: Router ) { + // defaults to true this.autoPlayNextVideoPlaylist = this.auth.isLoggedIn() ? this.auth.getUser().autoPlayNextVideoPlaylist : peertubeLocalStorage.getItem(VideoWatchPlaylistComponent.LOCAL_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) !== 'false' this.setAutoPlayNextVideoPlaylistSwitchText() + // defaults to false this.loopPlaylist = peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' this.setLoopPlaylistSwitchText() } @@ -127,23 +129,31 @@ export class VideoWatchPlaylistComponent { this.onPlaylistVideosNearOfBottom() } - navigateToNextPlaylistVideo (_next: VideoPlaylistElement = null) { - if (this.currentPlaylistPosition < this.playlistPagination.totalItems) { - const next = _next || this.playlistElements.find(e => e.position === this.currentPlaylistPosition + 1) - - if (!next || !next.video) { - this.currentPlaylistPosition++ - this.navigateToNextPlaylistVideo() + findNextPlaylistVideo (position = this.currentPlaylistPosition): VideoPlaylistElement { + if (this.currentPlaylistPosition >= this.playlistPagination.totalItems) { + // we have reached the end of the playlist: either loop or stop + if (this.loopPlaylist) { + this.currentPlaylistPosition = position = 0 + } else { return } - - const start = next.startTimestamp - const stop = next.stopTimestamp - this.router.navigate([],{ queryParams: { videoId: next.video.uuid, start, stop } }) - } else if (this.loopPlaylist) { - this.currentPlaylistPosition = 0 - this.navigateToNextPlaylistVideo(this.playlistElements.find(e => e.position === this.currentPlaylistPosition)) } + + const next = this.playlistElements.find(e => e.position === position) + + if (!next || !next.video) { + return this.findNextPlaylistVideo(position + 1) + } + + return next + } + + navigateToNextPlaylistVideo () { + const next = this.findNextPlaylistVideo(this.currentPlaylistPosition + 1) + if (!next) return + const start = next.startTimestamp + const stop = next.stopTimestamp + this.router.navigate([],{ queryParams: { videoId: next.video.uuid, start, stop } }) } switchAutoPlayNextVideoPlaylist () { 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 aaaa63d4d..890b7996f 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.ts +++ b/client/src/app/videos/+video-watch/video-watch.component.ts @@ -267,6 +267,20 @@ export class VideoWatchComponent implements OnInit, OnDestroy { return video.isVideoNSFWForUser(this.user, this.serverService.getConfig()) } + isAutoPlayEnabled () { + return ( + this.user && this.user.autoPlayNextVideo || + peertubeSessionStorage.getItem(RecommendedVideosComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true' + ) + } + + isPlaylistAutoPlayEnabled () { + return ( + this.user && this.user.autoPlayNextVideoPlaylist || + peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' + ) + } + private loadVideo (videoId: string) { // Video did not change if (this.video && this.video.uuid === videoId) return @@ -436,24 +450,15 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.player.one('ended', () => { if (this.playlist) { - if ( - this.user && this.user.autoPlayNextVideoPlaylist || - peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' - ) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) - } else if ( - this.user && this.user.autoPlayNextVideo || - peertubeSessionStorage.getItem(RecommendedVideosComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true' - ) { + if (this.isPlaylistAutoPlayEnabled()) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) + } else if (this.isAutoPlayEnabled()) { this.zone.run(() => this.autoplayNext()) } }) this.player.one('stopped', () => { if (this.playlist) { - if ( - this.user && this.user.autoPlayNextVideoPlaylist || - peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' - ) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) + if (this.isPlaylistAutoPlayEnabled()) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) } }) @@ -568,8 +573,20 @@ export class VideoWatchComponent implements OnInit, OnDestroy { user?: AuthUser }) { const { video, videoCaptions, urlOptions, user } = params + const getStartTime = () => { + const byUrl = urlOptions.startTime !== undefined + const byHistory = video.userHistory && !this.playlist - let startTime = timeToInt(urlOptions.startTime) || (video.userHistory && !this.playlist ? video.userHistory.currentTime : 0) + if (byUrl) { + return timeToInt(urlOptions.startTime) + } else if (byHistory) { + return video.userHistory.currentTime + } else { + return 0 + } + } + + let startTime = getStartTime() // If we are at the end of the video, reset the timer if (video.duration - startTime <= 1) startTime = 0 diff --git a/client/src/assets/images/global/repeat.svg b/client/src/assets/images/global/repeat.svg index c7657b08e..6e6b22bda 100644 --- a/client/src/assets/images/global/repeat.svg +++ b/client/src/assets/images/global/repeat.svg @@ -1 +1,12 @@ - \ No newline at end of file + + + + + + + + + + + + \ No newline at end of file