diff options
author | Chocobozzz <me@florianbigard.com> | 2022-03-04 13:40:02 +0100 |
---|---|---|
committer | Chocobozzz <chocobozzz@cpy.re> | 2022-03-09 09:23:10 +0100 |
commit | f443a74649174b2f9347c158e30f8ac7aa3e958a (patch) | |
tree | e423bc4e2307477bda4341037b7fa04ad10adae6 /client/src/app/+videos/+video-watch | |
parent | 01dd04cd5ab7b55d2a9af7d0ebf405bee9579b09 (diff) | |
download | PeerTube-f443a74649174b2f9347c158e30f8ac7aa3e958a.tar.gz PeerTube-f443a74649174b2f9347c158e30f8ac7aa3e958a.tar.zst PeerTube-f443a74649174b2f9347c158e30f8ac7aa3e958a.zip |
Add latency setting support
Diffstat (limited to 'client/src/app/+videos/+video-watch')
-rw-r--r-- | client/src/app/+videos/+video-watch/video-watch.component.ts | 34 |
1 files changed, 28 insertions, 6 deletions
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 1f45c4d26..067d3bc84 100644 --- a/client/src/app/+videos/+video-watch/video-watch.component.ts +++ b/client/src/app/+videos/+video-watch/video-watch.component.ts | |||
@@ -1,5 +1,5 @@ | |||
1 | import { Hotkey, HotkeysService } from 'angular2-hotkeys' | 1 | import { Hotkey, HotkeysService } from 'angular2-hotkeys' |
2 | import { forkJoin, Subscription } from 'rxjs' | 2 | import { forkJoin, map, Observable, of, Subscription, switchMap } from 'rxjs' |
3 | import { isP2PEnabled } from 'src/assets/player/utils' | 3 | import { isP2PEnabled } from 'src/assets/player/utils' |
4 | import { PlatformLocation } from '@angular/common' | 4 | import { PlatformLocation } from '@angular/common' |
5 | import { Component, ElementRef, Inject, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core' | 5 | import { Component, ElementRef, Inject, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core' |
@@ -22,11 +22,13 @@ import { HooksService } from '@app/core/plugins/hooks.service' | |||
22 | import { isXPercentInViewport, scrollToTop } from '@app/helpers' | 22 | import { isXPercentInViewport, scrollToTop } from '@app/helpers' |
23 | import { Video, VideoCaptionService, VideoDetails, VideoService } from '@app/shared/shared-main' | 23 | import { Video, VideoCaptionService, VideoDetails, VideoService } from '@app/shared/shared-main' |
24 | import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription' | 24 | import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription' |
25 | import { LiveVideoService } from '@app/shared/shared-video-live' | ||
25 | import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist' | 26 | import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist' |
26 | import { timeToInt } from '@shared/core-utils' | 27 | import { timeToInt } from '@shared/core-utils' |
27 | import { | 28 | import { |
28 | HTMLServerConfig, | 29 | HTMLServerConfig, |
29 | HttpStatusCode, | 30 | HttpStatusCode, |
31 | LiveVideo, | ||
30 | PeerTubeProblemDocument, | 32 | PeerTubeProblemDocument, |
31 | ServerErrorCode, | 33 | ServerErrorCode, |
32 | VideoCaption, | 34 | VideoCaption, |
@@ -63,6 +65,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
63 | 65 | ||
64 | video: VideoDetails = null | 66 | video: VideoDetails = null |
65 | videoCaptions: VideoCaption[] = [] | 67 | videoCaptions: VideoCaption[] = [] |
68 | liveVideo: LiveVideo | ||
66 | 69 | ||
67 | playlistPosition: number | 70 | playlistPosition: number |
68 | playlist: VideoPlaylist = null | 71 | playlist: VideoPlaylist = null |
@@ -89,6 +92,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
89 | private router: Router, | 92 | private router: Router, |
90 | private videoService: VideoService, | 93 | private videoService: VideoService, |
91 | private playlistService: VideoPlaylistService, | 94 | private playlistService: VideoPlaylistService, |
95 | private liveVideoService: LiveVideoService, | ||
92 | private confirmService: ConfirmService, | 96 | private confirmService: ConfirmService, |
93 | private metaService: MetaService, | 97 | private metaService: MetaService, |
94 | private authService: AuthService, | 98 | private authService: AuthService, |
@@ -239,12 +243,21 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
239 | 'filter:api.video-watch.video.get.result' | 243 | 'filter:api.video-watch.video.get.result' |
240 | ) | 244 | ) |
241 | 245 | ||
246 | const videoAndLiveObs: Observable<{ video: VideoDetails, live?: LiveVideo }> = videoObs.pipe( | ||
247 | switchMap(video => { | ||
248 | if (!video.isLive) return of({ video }) | ||
249 | |||
250 | return this.liveVideoService.getVideoLive(video.uuid) | ||
251 | .pipe(map(live => ({ live, video }))) | ||
252 | }) | ||
253 | ) | ||
254 | |||
242 | forkJoin([ | 255 | forkJoin([ |
243 | videoObs, | 256 | videoAndLiveObs, |
244 | this.videoCaptionService.listCaptions(videoId), | 257 | this.videoCaptionService.listCaptions(videoId), |
245 | this.userService.getAnonymousOrLoggedUser() | 258 | this.userService.getAnonymousOrLoggedUser() |
246 | ]).subscribe({ | 259 | ]).subscribe({ |
247 | next: ([ video, captionsResult, loggedInOrAnonymousUser ]) => { | 260 | next: ([ { video, live }, captionsResult, loggedInOrAnonymousUser ]) => { |
248 | const queryParams = this.route.snapshot.queryParams | 261 | const queryParams = this.route.snapshot.queryParams |
249 | 262 | ||
250 | const urlOptions = { | 263 | const urlOptions = { |
@@ -261,7 +274,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
261 | peertubeLink: false | 274 | peertubeLink: false |
262 | } | 275 | } |
263 | 276 | ||
264 | this.onVideoFetched({ video, videoCaptions: captionsResult.data, loggedInOrAnonymousUser, urlOptions }) | 277 | this.onVideoFetched({ video, live, videoCaptions: captionsResult.data, loggedInOrAnonymousUser, urlOptions }) |
265 | .catch(err => this.handleGlobalError(err)) | 278 | .catch(err => this.handleGlobalError(err)) |
266 | }, | 279 | }, |
267 | 280 | ||
@@ -330,16 +343,18 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
330 | 343 | ||
331 | private async onVideoFetched (options: { | 344 | private async onVideoFetched (options: { |
332 | video: VideoDetails | 345 | video: VideoDetails |
346 | live: LiveVideo | ||
333 | videoCaptions: VideoCaption[] | 347 | videoCaptions: VideoCaption[] |
334 | urlOptions: URLOptions | 348 | urlOptions: URLOptions |
335 | loggedInOrAnonymousUser: User | 349 | loggedInOrAnonymousUser: User |
336 | }) { | 350 | }) { |
337 | const { video, videoCaptions, urlOptions, loggedInOrAnonymousUser } = options | 351 | const { video, live, videoCaptions, urlOptions, loggedInOrAnonymousUser } = options |
338 | 352 | ||
339 | this.subscribeToLiveEventsIfNeeded(this.video, video) | 353 | this.subscribeToLiveEventsIfNeeded(this.video, video) |
340 | 354 | ||
341 | this.video = video | 355 | this.video = video |
342 | this.videoCaptions = videoCaptions | 356 | this.videoCaptions = videoCaptions |
357 | this.liveVideo = live | ||
343 | 358 | ||
344 | // Re init attributes | 359 | // Re init attributes |
345 | this.playerPlaceholderImgSrc = undefined | 360 | this.playerPlaceholderImgSrc = undefined |
@@ -387,6 +402,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
387 | const params = { | 402 | const params = { |
388 | video: this.video, | 403 | video: this.video, |
389 | videoCaptions: this.videoCaptions, | 404 | videoCaptions: this.videoCaptions, |
405 | liveVideo: this.liveVideo, | ||
390 | urlOptions, | 406 | urlOptions, |
391 | loggedInOrAnonymousUser, | 407 | loggedInOrAnonymousUser, |
392 | user: this.user | 408 | user: this.user |
@@ -532,12 +548,13 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
532 | 548 | ||
533 | private buildPlayerManagerOptions (params: { | 549 | private buildPlayerManagerOptions (params: { |
534 | video: VideoDetails | 550 | video: VideoDetails |
551 | liveVideo: LiveVideo | ||
535 | videoCaptions: VideoCaption[] | 552 | videoCaptions: VideoCaption[] |
536 | urlOptions: CustomizationOptions & { playerMode: PlayerMode } | 553 | urlOptions: CustomizationOptions & { playerMode: PlayerMode } |
537 | loggedInOrAnonymousUser: User | 554 | loggedInOrAnonymousUser: User |
538 | user?: AuthUser | 555 | user?: AuthUser |
539 | }) { | 556 | }) { |
540 | const { video, videoCaptions, urlOptions, loggedInOrAnonymousUser, user } = params | 557 | const { video, liveVideo, videoCaptions, urlOptions, loggedInOrAnonymousUser, user } = params |
541 | 558 | ||
542 | const getStartTime = () => { | 559 | const getStartTime = () => { |
543 | const byUrl = urlOptions.startTime !== undefined | 560 | const byUrl = urlOptions.startTime !== undefined |
@@ -562,6 +579,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
562 | src: environment.apiUrl + c.captionPath | 579 | src: environment.apiUrl + c.captionPath |
563 | })) | 580 | })) |
564 | 581 | ||
582 | const liveOptions = video.isLive | ||
583 | ? { latencyMode: liveVideo.latencyMode } | ||
584 | : undefined | ||
585 | |||
565 | const options: PeertubePlayerManagerOptions = { | 586 | const options: PeertubePlayerManagerOptions = { |
566 | common: { | 587 | common: { |
567 | autoplay: this.isAutoplay(), | 588 | autoplay: this.isAutoplay(), |
@@ -597,6 +618,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
597 | embedTitle: video.name, | 618 | embedTitle: video.name, |
598 | 619 | ||
599 | isLive: video.isLive, | 620 | isLive: video.isLive, |
621 | liveOptions, | ||
600 | 622 | ||
601 | language: this.localeId, | 623 | language: this.localeId, |
602 | 624 | ||