Add to playlist dropdown

[github/Chocobozzz/PeerTube.git] / client / src / standalone / videos / embed.ts

diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index 6dd9a3d765ffda850c926e7f9fff31f7e4d6711c..28c10c75cd7b3bbb3c3c8bc9d699e26a8ed6d3d9 100644 (file)
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -23,7 +23,13 @@ import { peertubeTranslate, ResultList, VideoDetails } from '../../../../shared'
 import { PeerTubeResolution } from '../player/definitions'
 import { VideoJSCaption } from '../../assets/player/peertube-videojs-typings'
 import { VideoCaption } from '../../../../shared/models/videos/caption/video-caption.model'
-import { PeertubePlayerManager, PeertubePlayerManagerOptions, PlayerMode } from '../../assets/player/peertube-player-manager'
+import {
+  P2PMediaLoaderOptions,
+  PeertubePlayerManager,
+  PeertubePlayerManagerOptions,
+  PlayerMode
+} from '../../assets/player/peertube-player-manager'
+import { VideoStreamingPlaylistType } from '../../../../shared/models/videos/video-streaming-playlist.type'
 
 /**
  * Embed API exposes control of the embed player to the outside world via
@@ -162,6 +168,7 @@ class PeerTubeEmbed {
   subtitle: string
   enableApi = false
   startTime: number | string = 0
+  stopTime: number | string
   mode: PlayerMode
   scope = 'peertube'
 
@@ -256,8 +263,9 @@ class PeerTubeEmbed {
       this.scope = this.getParamString(params, 'scope', this.scope)
       this.subtitle = this.getParamString(params, 'subtitle')
       this.startTime = this.getParamString(params, 'start')
+      this.stopTime = this.getParamString(params, 'stop')
 
-      this.mode = this.getParamToggle(params, 'p2p-media-loader') ? 'p2p-media-loader' : 'webtorrent'
+      this.mode = this.getParamString(params, 'mode') === 'p2p-media-loader' ? 'p2p-media-loader' : 'webtorrent'
     } catch (err) {
       console.error('Cannot get params from URL.', err)
     }
@@ -300,12 +308,16 @@ class PeerTubeEmbed {
         loop: this.loop,
         captions: videoCaptions.length !== 0,
         startTime: this.startTime,
+        stopTime: this.stopTime,
         subtitle: this.subtitle,
 
         videoCaptions,
         inactivityTimeout: 1500,
         videoViewUrl: this.getVideoUrl(videoId) + '/views',
+
         playerElement: this.videoElement,
+        onPlayerElementChange: (element: HTMLVideoElement) => this.videoElement = element,
+
         videoDuration: videoInfo.duration,
         enableHotkeys: true,
         peertubeLink: true,
@@ -315,23 +327,24 @@ class PeerTubeEmbed {
         serverUrl: window.location.origin,
         language: navigator.language,
         embedUrl: window.location.origin + videoInfo.embedPath
+      },
+
+      webtorrent: {
+        videoFiles: videoInfo.files
       }
     }
 
     if (this.mode === 'p2p-media-loader') {
+      const hlsPlaylist = videoInfo.streamingPlaylists.find(p => p.type === VideoStreamingPlaylistType.HLS)
+
       Object.assign(options, {
         p2pMediaLoader: {
-          // playlistUrl: 'https://akamai-axtest.akamaized.net/routes/lapd-v1-acceptance/www_c4/Manifest.m3u8'
-          // playlistUrl: 'https://d2zihajmogu5jn.cloudfront.net/bipbop-advanced/bipbop_16x9_variant.m3u8'
-          // trackerAnnounce: [ window.location.origin.replace(/^http/, 'ws') + '/tracker/socket' ],
-          playlistUrl: 'https://cdn.theoplayer.com/video/elephants-dream/playlist.m3u8'
-        }
-      })
-    } else {
-      Object.assign(options, {
-        webtorrent: {
+          playlistUrl: hlsPlaylist.playlistUrl,
+          segmentsSha256Url: hlsPlaylist.segmentsSha256Url,
+          redundancyBaseUrls: hlsPlaylist.redundancies.map(r => r.baseUrl),
+          trackerAnnounce: videoInfo.trackerUrls,
           videoFiles: videoInfo.files
-        }
+        } as P2PMediaLoaderOptions
       })
     }