diff options
Diffstat (limited to 'client/src/standalone/videos/embed.ts')
-rw-r--r-- | client/src/standalone/videos/embed.ts | 60 |
1 files changed, 16 insertions, 44 deletions
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts index 08f2955cf..f2ac5dca6 100644 --- a/client/src/standalone/videos/embed.ts +++ b/client/src/standalone/videos/embed.ts | |||
@@ -1,10 +1,9 @@ | |||
1 | import './embed.scss' | 1 | import './embed.scss' |
2 | 2 | ||
3 | import * as videojs from 'video.js' | 3 | import * as videojs from 'video.js' |
4 | import 'videojs-hotkeys' | 4 | |
5 | import '../../assets/player/peertube-videojs-plugin' | ||
6 | import 'videojs-dock/dist/videojs-dock.es.js' | ||
7 | import { VideoDetails } from '../../../../shared' | 5 | import { VideoDetails } from '../../../../shared' |
6 | import { getVideojsOptions } from '../../assets/player/peertube-player' | ||
8 | 7 | ||
9 | function getVideoUrl (id: string) { | 8 | function getVideoUrl (id: string) { |
10 | return window.location.origin + '/api/v1/videos/' + id | 9 | return window.location.origin + '/api/v1/videos/' + id |
@@ -20,9 +19,10 @@ const videoId = urlParts[urlParts.length - 1] | |||
20 | 19 | ||
21 | loadVideoInfo(videoId) | 20 | loadVideoInfo(videoId) |
22 | .then(videoInfo => { | 21 | .then(videoInfo => { |
23 | const videoElement = document.getElementById('video-container') as HTMLVideoElement | 22 | const videoContainerId = 'video-container' |
24 | const previewUrl = window.location.origin + videoInfo.previewPath | 23 | |
25 | videoElement.poster = previewUrl | 24 | const videoElement = document.getElementById(videoContainerId) as HTMLVideoElement |
25 | videoElement.poster = window.location.origin + videoInfo.previewPath | ||
26 | 26 | ||
27 | let autoplay = false | 27 | let autoplay = false |
28 | 28 | ||
@@ -33,45 +33,17 @@ loadVideoInfo(videoId) | |||
33 | console.error('Cannot get params from URL.', err) | 33 | console.error('Cannot get params from URL.', err) |
34 | } | 34 | } |
35 | 35 | ||
36 | const videojsOptions = { | 36 | const videojsOptions = getVideojsOptions({ |
37 | controls: true, | ||
38 | autoplay, | 37 | autoplay, |
39 | inactivityTimeout: 500, | 38 | inactivityTimeout: 1500, |
40 | plugins: { | 39 | videoViewUrl: getVideoUrl(videoId) + '/views', |
41 | peertube: { | 40 | playerElement: videoElement, |
42 | videoFiles: videoInfo.files, | 41 | videoFiles: videoInfo.files, |
43 | playerElement: videoElement, | 42 | videoDuration: videoInfo.duration, |
44 | videoViewUrl: getVideoUrl(videoId) + '/views', | 43 | enableHotkeys: true, |
45 | videoDuration: videoInfo.duration | 44 | peertubeLink: true |
46 | }, | 45 | }) |
47 | hotkeys: { | 46 | videojs(videoContainerId, videojsOptions, function () { |
48 | enableVolumeScroll: false | ||
49 | } | ||
50 | }, | ||
51 | controlBar: { | ||
52 | children: [ | ||
53 | 'playToggle', | ||
54 | 'currentTimeDisplay', | ||
55 | 'timeDivider', | ||
56 | 'durationDisplay', | ||
57 | 'liveDisplay', | ||
58 | |||
59 | 'flexibleWidthSpacer', | ||
60 | 'progressControl', | ||
61 | |||
62 | 'webTorrentButton', | ||
63 | |||
64 | 'muteToggle', | ||
65 | 'volumeControl', | ||
66 | |||
67 | 'resolutionMenuButton', | ||
68 | 'peerTubeLinkButton', | ||
69 | |||
70 | 'fullscreenToggle' | ||
71 | ] | ||
72 | } | ||
73 | } | ||
74 | videojs('video-container', videojsOptions, function () { | ||
75 | const player = this | 47 | const player = this |
76 | 48 | ||
77 | player.dock({ | 49 | player.dock({ |