Support storyboards in embed

1 files changed, 23 insertions, 1 deletions

diff --git a/client/src/standalone/videos/shared/player-manager-options.ts b/client/src/standalone/videos/shared/player-manager-options.ts
index 587516410..3c7521bc2 100644
--- a/client/src/standalone/videos/shared/player-manager-options.ts
+++ b/client/src/standalone/videos/shared/player-manager-options.ts
@@ -2,6 +2,7 @@ import { peertubeTranslate } from '../../../../../shared/core-utils/i18n'
 import {
   HTMLServerConfig,
   LiveVideo,
+  Storyboard,
   Video,
   VideoCaption,
   VideoDetails,
@@ -155,6 +156,9 @@ export class PlayerManagerOptions {
   async getPlayerOptions (options: {
     video: VideoDetails
     captionsResponse: Response
+
+    storyboardsResponse: Response
+
     live?: LiveVideo
 
     forceAutoplay: boolean
@@ -187,11 +191,15 @@ export class PlayerManagerOptions {
       forceAutoplay,
       playlistTracker,
       live,
+      storyboardsResponse,
       authorizationHeader,
       serverConfig
     } = options
 
-    const videoCaptions = await this.buildCaptions(captionsResponse, translations)
+    const [ videoCaptions, storyboard ] = await Promise.all([
+      this.buildCaptions(captionsResponse, translations),
+      this.buildStoryboard(storyboardsResponse)
+    ])
 
     const playerOptions: PeertubePlayerManagerOptions = {
       common: {
@@ -210,6 +218,8 @@ export class PlayerManagerOptions {
         captions: videoCaptions.length !== 0,
         subtitle: this.subtitle,
 
+        storyboard,
+
         startTime: playlistTracker
           ? playlistTracker.getCurrentElement().startTimestamp
           : this.startTime,
@@ -286,6 +296,18 @@ export class PlayerManagerOptions {
     }
   }
 
+  private async buildStoryboard (storyboardsResponse: Response) {
+    const { storyboards } = await storyboardsResponse.json() as { storyboards: Storyboard[] }
+    if (!storyboards || storyboards.length === 0) return undefined
+
+    return {
+      url: window.location.origin + storyboards[0].storyboardPath,
+      height: storyboards[0].spriteHeight,
+      width: storyboards[0].spriteWidth,
+      interval: storyboards[0].spriteDuration
+    }
+  }
+
   private buildPlaylistOptions (options: {
     playlistTracker?: PlaylistTracker
     playNextPlaylistVideo?: () => any