X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-watch%2Fvideo-watch.component.ts;h=9ba14316caa5388b06e31b061a874225187ed170;hb=54e7884775197877dd941b44bef03b3c6387b22a;hp=626d0ca07e115b3ac8bcdefb70cd633fc07d038a;hpb=ba430d7516bc5b1324b60571ba7594460969b7fb;p=github%2FChocobozzz%2FPeerTube.git 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 626d0ca07..9ba14316c 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.ts +++ b/client/src/app/videos/+video-watch/video-watch.component.ts @@ -2,7 +2,7 @@ import { catchError } from 'rxjs/operators' import { ChangeDetectorRef, Component, ElementRef, Inject, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core' import { ActivatedRoute, Router } from '@angular/router' import { RedirectService } from '@app/core/routing/redirect.service' -import { peertubeLocalStorage, peertubeSessionStorage } from '@app/shared/misc/peertube-web-storage' +import { peertubeLocalStorage } from '@app/shared/misc/peertube-web-storage' import { VideoSupportComponent } from '@app/videos/+video-watch/modal/video-support.component' import { MetaService } from '@ngx-meta/core' import { AuthUser, Notifier, ServerService } from '@app/core' @@ -10,7 +10,7 @@ import { forkJoin, Observable, Subscription } from 'rxjs' import { Hotkey, HotkeysService } from 'angular2-hotkeys' import { ServerConfig, UserVideoRateType, VideoCaption, VideoPrivacy, VideoState } from '../../../../../shared' import { AuthService, ConfirmService } from '../../core' -import { RestExtractor, VideoBlacklistService } from '../../shared' +import { RestExtractor, UserService } from '../../shared' import { VideoDetails } from '../../shared/video/video-details.model' import { VideoService } from '../../shared/video/video.service' import { VideoShareComponent } from './modal/video-share.component' @@ -32,12 +32,10 @@ import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist. import { Video } from '@app/shared/video/video.model' import { isWebRTCDisabled, timeToInt } from '../../../assets/player/utils' import { VideoWatchPlaylistComponent } from '@app/videos/+video-watch/video-watch-playlist.component' -import { getStoredTheater } from '../../../assets/player/peertube-player-local-storage' -import { PluginService } from '@app/core/plugins/plugin.service' +import { getStoredP2PEnabled, getStoredTheater } from '../../../assets/player/peertube-player-local-storage' import { HooksService } from '@app/core/plugins/hooks.service' import { PlatformLocation } from '@angular/common' -import { RecommendedVideosComponent } from '../recommendations/recommended-videos.component' -import { scrollToTop } from '@app/shared/misc/utils' +import { scrollToTop, isXPercentInViewport } from '@app/shared/misc/utils' @Component({ selector: 'my-video-watch', @@ -48,9 +46,9 @@ export class VideoWatchComponent implements OnInit, OnDestroy { private static LOCAL_STORAGE_PRIVACY_CONCERN_KEY = 'video-watch-privacy-concern' @ViewChild('videoWatchPlaylist', { static: true }) videoWatchPlaylist: VideoWatchPlaylistComponent - @ViewChild('videoShareModal', { static: false }) videoShareModal: VideoShareComponent - @ViewChild('videoSupportModal', { static: false }) videoSupportModal: VideoSupportComponent - @ViewChild('subscribeButton', { static: false }) subscribeButton: SubscribeButtonComponent + @ViewChild('videoShareModal') videoShareModal: VideoShareComponent + @ViewChild('videoSupportModal') videoSupportModal: VideoSupportComponent + @ViewChild('subscribeButton') subscribeButton: SubscribeButtonComponent player: any playerElement: HTMLVideoElement @@ -93,14 +91,13 @@ export class VideoWatchComponent implements OnInit, OnDestroy { private router: Router, private videoService: VideoService, private playlistService: VideoPlaylistService, - private videoBlacklistService: VideoBlacklistService, private confirmService: ConfirmService, private metaService: MetaService, private authService: AuthService, + private userService: UserService, private serverService: ServerService, private restExtractor: RestExtractor, private notifier: Notifier, - private pluginService: PluginService, private markdownService: MarkdownService, private zone: NgZone, private redirectService: RedirectService, @@ -121,6 +118,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy { return this.authService.getUser() } + get anonymousUser () { + return this.userService.getAnonymousUser() + } + async ngOnInit () { this.serverConfig = this.serverService.getTmpConfig() @@ -131,6 +132,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { if ( isWebRTCDisabled() || this.serverConfig.tracker.enabled === false || + getStoredP2PEnabled() === false || peertubeLocalStorage.getItem(VideoWatchComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY) === 'true' ) { this.hasAlreadyAcceptedPrivacyConcern = true @@ -147,7 +149,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.queryParamsSub = this.route.queryParams.subscribe(async queryParams => { const videoId = queryParams[ 'videoId' ] - if (videoId) await this.loadVideo(videoId) + if (videoId) this.loadVideo(videoId) const start = queryParams[ 'start' ] if (this.player && start) this.player.currentTime(parseInt(start, 10)) @@ -268,6 +270,11 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.redirectService.redirectToHomepage() } + declinedPrivacyConcern () { + peertubeLocalStorage.setItem(VideoWatchComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY, 'false') + this.hasAlreadyAcceptedPrivacyConcern = false + } + acceptedPrivacyConcern () { peertubeLocalStorage.setItem(VideoWatchComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY, 'true') this.hasAlreadyAcceptedPrivacyConcern = true @@ -292,7 +299,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { isAutoPlayEnabled () { return ( (this.user && this.user.autoPlayNextVideo) || - peertubeSessionStorage.getItem(RecommendedVideosComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true' + this.anonymousUser.autoPlayNextVideo ) } @@ -304,7 +311,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { isPlaylistAutoPlayEnabled () { return ( (this.user && this.user.autoPlayNextVideoPlaylist) || - peertubeSessionStorage.getItem(VideoWatchPlaylistComponent.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO_PLAYLIST) === 'true' + this.anonymousUser.autoPlayNextVideoPlaylist ) } @@ -478,12 +485,18 @@ export class VideoWatchComponent implements OnInit, OnDestroy { /** * replaces this.player.one('ended') - * define 'condition(next)' to return true to wait, false to stop + * 'condition()': true to make the upnext functionality trigger, + * false to disable the upnext functionality + * go to the next video in 'condition()' if you don't want of the timer. + * 'next': function triggered at the end of the timer. + * 'suspended': function used at each clic of the timer checking if we need + * to reset progress and wait until 'suspended' becomes truthy again. */ this.player.upnext({ timeout: 10000, // 10s headText: this.i18n('Up Next'), cancelText: this.i18n('Cancel'), + suspendedText: this.i18n('Autoplay is suspended'), getTitle: () => this.nextVideoTitle, next: () => this.zone.run(() => this.autoplayNext()), condition: () => { @@ -496,6 +509,12 @@ export class VideoWatchComponent implements OnInit, OnDestroy { return true // upnext will trigger } return false // upnext will not trigger, and instead leave the video stopping + }, + suspended: () => { + return ( + !isXPercentInViewport(this.player.el(), 80) || + !document.getElementById('content').contains(document.activeElement) + ) } }) @@ -618,7 +637,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { const { video, videoCaptions, urlOptions, user } = params const getStartTime = () => { const byUrl = urlOptions.startTime !== undefined - const byHistory = video.userHistory && !this.playlist + const byHistory = video.userHistory && (!this.playlist || urlOptions.resume !== undefined) if (byUrl) { return timeToInt(urlOptions.startTime) @@ -642,6 +661,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { const options: PeertubePlayerManagerOptions = { common: { autoplay: this.isAutoplay(), + nextVideo: () => this.zone.run(() => this.autoplayNext()), playerElement: this.playerElement, onPlayerElementChange: (element: HTMLVideoElement) => this.playerElement = element,