diff options
Diffstat (limited to 'client/src')
3 files changed, 65 insertions, 27 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 { | |||
44 | private videoPlaylist: VideoPlaylistService, | 44 | private videoPlaylist: VideoPlaylistService, |
45 | private router: Router | 45 | private router: Router |
46 | ) { | 46 | ) { |
47 | // defaults to true | ||
47 | this.autoPlayNextVideoPlaylist = this.auth.isLoggedIn() | 48 | this.autoPlayNextVideoPlaylist = this.auth.isLoggedIn() |
48 | ? this.auth.getUser().autoPlayNextVideoPlaylist | 49 | ? this.auth.getUser().autoPlayNextVideoPlaylist |
49 | : peertubeLocalStorage.getItem(VideoWatchPlaylistComponent.LOCAL_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) !== 'false' | 50 | : peertubeLocalStorage.getItem(VideoWatchPlaylistComponent.LOCAL_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) !== 'false' |
50 | this.setAutoPlayNextVideoPlaylistSwitchText() | 51 | this.setAutoPlayNextVideoPlaylistSwitchText() |
51 | 52 | ||
53 | // defaults to false | ||
52 | this.loopPlaylist = peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' | 54 | this.loopPlaylist = peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' |
53 | this.setLoopPlaylistSwitchText() | 55 | this.setLoopPlaylistSwitchText() |
54 | } | 56 | } |
@@ -127,23 +129,31 @@ export class VideoWatchPlaylistComponent { | |||
127 | this.onPlaylistVideosNearOfBottom() | 129 | this.onPlaylistVideosNearOfBottom() |
128 | } | 130 | } |
129 | 131 | ||
130 | navigateToNextPlaylistVideo (_next: VideoPlaylistElement = null) { | 132 | findNextPlaylistVideo (position = this.currentPlaylistPosition): VideoPlaylistElement { |
131 | if (this.currentPlaylistPosition < this.playlistPagination.totalItems) { | 133 | if (this.currentPlaylistPosition >= this.playlistPagination.totalItems) { |
132 | const next = _next || this.playlistElements.find(e => e.position === this.currentPlaylistPosition + 1) | 134 | // we have reached the end of the playlist: either loop or stop |
133 | 135 | if (this.loopPlaylist) { | |
134 | if (!next || !next.video) { | 136 | this.currentPlaylistPosition = position = 0 |
135 | this.currentPlaylistPosition++ | 137 | } else { |
136 | this.navigateToNextPlaylistVideo() | ||
137 | return | 138 | return |
138 | } | 139 | } |
140 | } | ||
141 | |||
142 | const next = this.playlistElements.find(e => e.position === position) | ||
139 | 143 | ||
140 | const start = next.startTimestamp | 144 | if (!next || !next.video) { |
141 | const stop = next.stopTimestamp | 145 | return this.findNextPlaylistVideo(position + 1) |
142 | this.router.navigate([],{ queryParams: { videoId: next.video.uuid, start, stop } }) | ||
143 | } else if (this.loopPlaylist) { | ||
144 | this.currentPlaylistPosition = 0 | ||
145 | this.navigateToNextPlaylistVideo(this.playlistElements.find(e => e.position === this.currentPlaylistPosition)) | ||
146 | } | 146 | } |
147 | |||
148 | return next | ||
149 | } | ||
150 | |||
151 | navigateToNextPlaylistVideo () { | ||
152 | const next = this.findNextPlaylistVideo(this.currentPlaylistPosition + 1) | ||
153 | if (!next) return | ||
154 | const start = next.startTimestamp | ||
155 | const stop = next.stopTimestamp | ||
156 | this.router.navigate([],{ queryParams: { videoId: next.video.uuid, start, stop } }) | ||
147 | } | 157 | } |
148 | 158 | ||
149 | switchAutoPlayNextVideoPlaylist () { | 159 | 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 { | |||
267 | return video.isVideoNSFWForUser(this.user, this.serverService.getConfig()) | 267 | return video.isVideoNSFWForUser(this.user, this.serverService.getConfig()) |
268 | } | 268 | } |
269 | 269 | ||
270 | isAutoPlayEnabled () { | ||
271 | return ( | ||
272 | this.user && this.user.autoPlayNextVideo || | ||
273 | peertubeSessionStorage.getItem(RecommendedVideosComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true' | ||
274 | ) | ||
275 | } | ||
276 | |||
277 | isPlaylistAutoPlayEnabled () { | ||
278 | return ( | ||
279 | this.user && this.user.autoPlayNextVideoPlaylist || | ||
280 | peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' | ||
281 | ) | ||
282 | } | ||
283 | |||
270 | private loadVideo (videoId: string) { | 284 | private loadVideo (videoId: string) { |
271 | // Video did not change | 285 | // Video did not change |
272 | if (this.video && this.video.uuid === videoId) return | 286 | if (this.video && this.video.uuid === videoId) return |
@@ -436,24 +450,15 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
436 | 450 | ||
437 | this.player.one('ended', () => { | 451 | this.player.one('ended', () => { |
438 | if (this.playlist) { | 452 | if (this.playlist) { |
439 | if ( | 453 | if (this.isPlaylistAutoPlayEnabled()) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) |
440 | this.user && this.user.autoPlayNextVideoPlaylist || | 454 | } else if (this.isAutoPlayEnabled()) { |
441 | peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' | ||
442 | ) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) | ||
443 | } else if ( | ||
444 | this.user && this.user.autoPlayNextVideo || | ||
445 | peertubeSessionStorage.getItem(RecommendedVideosComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true' | ||
446 | ) { | ||
447 | this.zone.run(() => this.autoplayNext()) | 455 | this.zone.run(() => this.autoplayNext()) |
448 | } | 456 | } |
449 | }) | 457 | }) |
450 | 458 | ||
451 | this.player.one('stopped', () => { | 459 | this.player.one('stopped', () => { |
452 | if (this.playlist) { | 460 | if (this.playlist) { |
453 | if ( | 461 | if (this.isPlaylistAutoPlayEnabled()) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) |
454 | this.user && this.user.autoPlayNextVideoPlaylist || | ||
455 | peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' | ||
456 | ) this.zone.run(() => this.videoWatchPlaylist.navigateToNextPlaylistVideo()) | ||
457 | } | 462 | } |
458 | }) | 463 | }) |
459 | 464 | ||
@@ -568,8 +573,20 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
568 | user?: AuthUser | 573 | user?: AuthUser |
569 | }) { | 574 | }) { |
570 | const { video, videoCaptions, urlOptions, user } = params | 575 | const { video, videoCaptions, urlOptions, user } = params |
576 | const getStartTime = () => { | ||
577 | const byUrl = urlOptions.startTime !== undefined | ||
578 | const byHistory = video.userHistory && !this.playlist | ||
579 | |||
580 | if (byUrl) { | ||
581 | return timeToInt(urlOptions.startTime) | ||
582 | } else if (byHistory) { | ||
583 | return video.userHistory.currentTime | ||
584 | } else { | ||
585 | return 0 | ||
586 | } | ||
587 | } | ||
571 | 588 | ||
572 | let startTime = timeToInt(urlOptions.startTime) || (video.userHistory && !this.playlist ? video.userHistory.currentTime : 0) | 589 | let startTime = getStartTime() |
573 | // If we are at the end of the video, reset the timer | 590 | // If we are at the end of the video, reset the timer |
574 | if (video.duration - startTime <= 1) startTime = 0 | 591 | if (video.duration - startTime <= 1) startTime = 0 |
575 | 592 | ||
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 @@ | |||
1 | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-repeat"><polyline points="17 1 21 5 17 9"></polyline><path d="M3 11V9a4 4 0 0 1 4-4h14"></path><polyline points="7 23 3 19 7 15"></polyline><path d="M21 13v2a4 4 0 0 1-4 4H3"></path></svg> \ No newline at end of file | 1 | <svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> |
2 | <defs/> | ||
3 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||
4 | <g id="Artboard-4" transform="translate(-620.000000, -467.000000)"> | ||
5 | <g id="174" transform="translate(620.000000, 467.000000)"> | ||
6 | <path d="M16.5547002,9.83205029 C15.8901455,10.2750868 15,9.79869538 15,9 L15,5 C15,4.20130462 15.8901455,3.72491322 16.5547002,4.16794971 L19.5547002,6.16794971 C20.1484333,6.56377175 20.1484333,7.43622825 19.5547002,7.83205029 L16.5547002,9.83205029 Z" id="Path-115" fill="#333333" fill-rule="nonzero"/> | ||
7 | <path d="M7.4452998,19.8320503 L4.4452998,17.8320503 C3.85156673,17.4362282 3.85156673,16.5637718 4.4452998,16.1679497 L7.4452998,14.1679497 C8.10985453,13.7249132 9,14.2013046 9,15 L9,19 C9,19.7986954 8.10985453,20.2750868 7.4452998,19.8320503 Z" id="Path-115" fill="#333333" fill-rule="nonzero"/> | ||
8 | <path d="M3,12 C3,9.23857625 5.23533061,7 7.99367318,7 L18,7 M21,12 C21,14.7614237 18.7661779,17 16.0049709,17 L7,17" id="Rectangle-118" stroke="#333333" stroke-width="2" stroke-linecap="round"/> | ||
9 | </g> | ||
10 | </g> | ||
11 | </g> | ||
12 | </svg> \ No newline at end of file | ||