2 files changed, 21 insertions, 4 deletions

diff --git a/client/src/standalone/videos/shared/player-options-builder.ts b/client/src/standalone/videos/shared/player-options-builder.ts
index 3437ef421..dec859409 100644
--- a/client/src/standalone/videos/shared/player-options-builder.ts
+++ b/client/src/standalone/videos/shared/player-options-builder.ts
@@ -5,6 +5,7 @@ import {
   Storyboard,
   Video,
   VideoCaption,
+  VideoChapter,
   VideoDetails,
   VideoPlaylistElement,
   VideoState,
@@ -199,6 +200,8 @@ export class PlayerOptionsBuilder {
 
     storyboardsResponse: Response
 
+    chaptersResponse: Response
+
     live?: LiveVideo
 
     alreadyPlayed: boolean
@@ -229,12 +232,14 @@ export class PlayerOptionsBuilder {
       forceAutoplay,
       playlist,
       live,
-      storyboardsResponse
+      storyboardsResponse,
+      chaptersResponse
     } = options
 
-    const [ videoCaptions, storyboard ] = await Promise.all([
+    const [ videoCaptions, storyboard, chapters ] = await Promise.all([
       this.buildCaptions(captionsResponse, translations),
-      this.buildStoryboard(storyboardsResponse)
+      this.buildStoryboard(storyboardsResponse),
+      this.buildChapters(chaptersResponse)
     ])
 
     return {
@@ -248,6 +253,7 @@ export class PlayerOptionsBuilder {
       subtitle: this.subtitle,
 
       storyboard,
+      videoChapters: chapters,
 
       startTime: playlist
         ? playlist.playlistTracker.getCurrentElement().startTimestamp
@@ -312,6 +318,12 @@ export class PlayerOptionsBuilder {
     }
   }
 
+  private async buildChapters (chaptersResponse: Response) {
+    const { chapters } = await chaptersResponse.json() as { chapters: VideoChapter[] }
+
+    return chapters
+  }
+
   private buildPlaylistOptions (options?: {
     playlistTracker: PlaylistTracker
     playNext: () => any
diff --git a/client/src/standalone/videos/shared/video-fetcher.ts b/client/src/standalone/videos/shared/video-fetcher.ts
index 9149d946e..c52861189 100644
--- a/client/src/standalone/videos/shared/video-fetcher.ts
+++ b/client/src/standalone/videos/shared/video-fetcher.ts
@@ -36,9 +36,10 @@ export class VideoFetcher {
     }
 
     const captionsPromise = this.loadVideoCaptions({ videoId, videoPassword })
+    const chaptersPromise = this.loadVideoChapters({ videoId, videoPassword })
     const storyboardsPromise = this.loadStoryboards(videoId)
 
-    return { captionsPromise, storyboardsPromise, videoResponse }
+    return { captionsPromise, chaptersPromise, storyboardsPromise, videoResponse }
   }
 
   loadLive (video: VideoDetails) {
@@ -64,6 +65,10 @@ export class VideoFetcher {
     return this.http.fetch(this.getVideoUrl(videoId) + '/captions', { optionalAuth: true }, videoPassword)
   }
 
+  private loadVideoChapters ({ videoId, videoPassword }: { videoId: string, videoPassword?: string }): Promise<Response> {
+    return this.http.fetch(this.getVideoUrl(videoId) + '/chapters', { optionalAuth: true }, videoPassword)
+  }
+
   private getVideoUrl (id: string) {
     return window.location.origin + '/api/v1/videos/' + id
   }