X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;ds=sidebyside;f=client%2Fsrc%2Fapp%2F%2Bvideos%2F%2Bvideo-watch%2Fvideo-watch.component.ts;h=48623cae0d376573b0d5872264dac80a0281cfdc;hb=f8c00564e7e66c7c9d65ea044a4c1485df0e4c7c;hp=0a61227a8928724e6457cd757a43361322ccca53;hpb=0cd6ffc09cd76951fea3d861a6bda7f5984cb9d2;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 0a61227a8..48623cae0 100644 --- a/client/src/app/+videos/+video-watch/video-watch.component.ts +++ b/client/src/app/+videos/+video-watch/video-watch.component.ts @@ -4,18 +4,28 @@ import { catchError } from 'rxjs/operators' import { PlatformLocation } from '@angular/common' import { ChangeDetectorRef, Component, ElementRef, Inject, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core' import { ActivatedRoute, Router } from '@angular/router' -import { AuthService, AuthUser, ConfirmService, MarkdownService, Notifier, RestExtractor, ServerService, UserService } from '@app/core' +import { + AuthService, + AuthUser, + ConfirmService, + MarkdownService, + Notifier, + PeerTubeSocket, + RestExtractor, + ServerService, + UserService +} from '@app/core' import { HooksService } from '@app/core/plugins/hooks.service' import { RedirectService } from '@app/core/routing/redirect.service' import { isXPercentInViewport, scrollToTop } from '@app/helpers' import { Video, VideoCaptionService, VideoDetails, VideoService } from '@app/shared/shared-main' import { VideoShareComponent } from '@app/shared/shared-share-modal' import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription' -import { VideoDownloadComponent } from '@app/shared/shared-video-miniature' +import { VideoActionsDisplayType, VideoDownloadComponent } from '@app/shared/shared-video-miniature' import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist' import { MetaService } from '@ngx-meta/core' import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' -import { ServerConfig, UserVideoRateType, VideoCaption, VideoPrivacy, VideoState } from '@shared/models' +import { ServerConfig, ServerErrorCode, UserVideoRateType, VideoCaption, VideoPrivacy, VideoState } from '@shared/models' import { getStoredP2PEnabled, getStoredTheater } from '../../../assets/player/peertube-player-local-storage' import { CustomizationOptions, @@ -30,6 +40,8 @@ import { environment } from '../../../environments/environment' import { VideoSupportComponent } from './modal/video-support.component' import { VideoWatchPlaylistComponent } from './video-watch-playlist.component' +type URLOptions = CustomizationOptions & { playerMode: PlayerMode } + @Component({ selector: 'my-video-watch', templateUrl: './video-watch.component.html', @@ -70,12 +82,25 @@ export class VideoWatchComponent implements OnInit, OnDestroy { tooltipSupport = '' tooltipSaveToPlaylist = '' + videoActionsOptions: VideoActionsDisplayType = { + playlist: false, + download: true, + update: true, + blacklist: true, + delete: true, + report: true, + duplicate: true, + mute: true, + liveInfo: true + } + private nextVideoUuid = '' private nextVideoTitle = '' private currentTime: number private paramsSub: Subscription private queryParamsSub: Subscription private configSub: Subscription + private liveVideosSub: Subscription private serverConfig: ServerConfig @@ -99,6 +124,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { private videoCaptionService: VideoCaptionService, private hotkeysService: HotkeysService, private hooks: HooksService, + private peertubeSocket: PeerTubeSocket, private location: PlatformLocation, @Inject(LOCALE_ID) private localeId: string ) { @@ -117,6 +143,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy { } async ngOnInit () { + PeertubePlayerManager.initState() + this.serverConfig = this.serverService.getTmpConfig() this.configSub = this.serverService.getConfig() @@ -163,6 +191,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { if (this.paramsSub) this.paramsSub.unsubscribe() if (this.queryParamsSub) this.queryParamsSub.unsubscribe() if (this.configSub) this.configSub.unsubscribe() + if (this.liveVideosSub) this.liveVideosSub.unsubscribe() // Unbind hotkeys this.hotkeysService.remove(this.hotkeys) @@ -187,7 +216,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { getRatePopoverText () { if (this.isUserLoggedIn()) return undefined - return $localize`You need to be connected to rate this content.` + return $localize`You need to be logged in to rate this video.` } showMoreDescription () { @@ -209,7 +238,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { } isVideoDownloadable () { - return this.video && this.video instanceof VideoDetails && this.video.downloadEnabled + return this.video && this.video instanceof VideoDetails && this.video.downloadEnabled && !this.video.isLive } loadCompleteDescription () { @@ -304,6 +333,18 @@ export class VideoWatchComponent implements OnInit, OnDestroy { return this.video && this.video.scheduledUpdate !== undefined } + isLive () { + return !!(this.video?.isLive) + } + + isWaitingForLive () { + return this.video?.state.id === VideoState.WAITING_FOR_LIVE + } + + isLiveEnded () { + return this.video?.state.id === VideoState.LIVE_ENDED + } + isVideoBlur (video: Video) { return video.isVideoNSFWForUser(this.user, this.serverConfig) } @@ -361,7 +402,24 @@ export class VideoWatchComponent implements OnInit, OnDestroy { ]) .pipe( // If 401, the video is private or blocked so redirect to 404 - catchError(err => this.restExtractor.redirectTo404IfNotFound(err, [ 400, 401, 403, 404 ])) + catchError(err => { + if (err.body.errorCode === ServerErrorCode.DOES_NOT_RESPECT_FOLLOW_CONSTRAINTS && err.body.originUrl) { + const search = window.location.search + let originUrl = err.body.originUrl + if (search) originUrl += search + + this.confirmService.confirm( + $localize`This video is not available on this instance. Do you want to be redirected on the origin instance: ${originUrl}?`, + $localize`Redirection` + ).then(res => { + if (res === false) return this.restExtractor.redirectTo404IfNotFound(err, [ 400, 401, 403, 404 ]) + + return window.location.href = originUrl + }) + } + + return this.restExtractor.redirectTo404IfNotFound(err, [ 400, 401, 403, 404 ]) + }) ) .subscribe(([ video, captionsResult ]) => { const queryParams = this.route.snapshot.queryParams @@ -451,8 +509,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy { private async onVideoFetched ( video: VideoDetails, videoCaptions: VideoCaption[], - urlOptions: CustomizationOptions & { playerMode: PlayerMode } + urlOptions: URLOptions ) { + this.subscribeToLiveEventsIfNeeded(this.video, video) + this.video = video this.videoCaptions = videoCaptions @@ -470,6 +530,9 @@ export class VideoWatchComponent implements OnInit, OnDestroy { if (res === false) return this.location.back() } + const videoState = this.video.state.id + if (videoState === VideoState.LIVE_ENDED || videoState === VideoState.WAITING_FOR_LIVE) return + // Flush old player if needed this.flushPlayer() @@ -548,7 +611,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.zone.run(() => this.theaterEnabled = enabled) }) - this.hooks.runAction('action:video-watch.player.loaded', 'video-watch', { player: this.player, videojs }) + this.hooks.runAction('action:video-watch.player.loaded', 'video-watch', { player: this.player, videojs, video: this.video }) }) this.setVideoDescriptionHTML() @@ -775,6 +838,29 @@ export class VideoWatchComponent implements OnInit, OnDestroy { return !this.player.paused() } + private async subscribeToLiveEventsIfNeeded (oldVideo: VideoDetails, newVideo: VideoDetails) { + if (!this.liveVideosSub) { + this.liveVideosSub = this.peertubeSocket.getLiveVideosObservable() + .subscribe(({ payload }) => { + if (payload.state !== VideoState.PUBLISHED || this.video.state.id !== VideoState.WAITING_FOR_LIVE) return + + const videoUUID = this.video.uuid + + // Reset to refetch the video + this.video = undefined + this.loadVideo(videoUUID) + }) + } + + if (oldVideo && oldVideo.id !== newVideo.id) { + await this.peertubeSocket.unsubscribeLiveVideos(oldVideo.id) + } + + if (!newVideo.isLive) return + + await this.peertubeSocket.subscribeToLiveVideosSocket(newVideo.id) + } + private initHotkeys () { this.hotkeys = [ // These hotkeys are managed by the player