aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/assets
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/assets')
-rw-r--r--client/src/assets/player/images/next.svg4
-rw-r--r--client/src/assets/player/peertube-player-manager.ts23
-rw-r--r--client/src/assets/player/videojs-components/next-video-button.ts36
3 files changed, 59 insertions, 4 deletions
diff --git a/client/src/assets/player/images/next.svg b/client/src/assets/player/images/next.svg
new file mode 100644
index 000000000..af42dd270
--- /dev/null
+++ b/client/src/assets/player/images/next.svg
@@ -0,0 +1,4 @@
1<?xml version="1.0" encoding="UTF-8"?>
2<svg width="24px" height="24px" viewBox="0 0 36 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
3 <path fill="white" d="M 12,24 20.5,18 12,12 V 24 z M 22,12 v 12 h 2 V 12 h -2 z"></path>
4</svg> \ No newline at end of file
diff --git a/client/src/assets/player/peertube-player-manager.ts b/client/src/assets/player/peertube-player-manager.ts
index 276f9ec59..d9e02cd7d 100644
--- a/client/src/assets/player/peertube-player-manager.ts
+++ b/client/src/assets/player/peertube-player-manager.ts
@@ -8,6 +8,7 @@ import 'videojs-contrib-quality-levels'
8import './upnext/upnext-plugin' 8import './upnext/upnext-plugin'
9import './bezels/bezels-plugin' 9import './bezels/bezels-plugin'
10import './peertube-plugin' 10import './peertube-plugin'
11import './videojs-components/next-video-button'
11import './videojs-components/peertube-link-button' 12import './videojs-components/peertube-link-button'
12import './videojs-components/resolution-menu-button' 13import './videojs-components/resolution-menu-button'
13import './videojs-components/settings-menu-button' 14import './videojs-components/settings-menu-button'
@@ -62,6 +63,7 @@ export interface CommonOptions extends CustomizationOptions {
62 onPlayerElementChange: (element: HTMLVideoElement) => void 63 onPlayerElementChange: (element: HTMLVideoElement) => void
63 64
64 autoplay: boolean 65 autoplay: boolean
66 nextVideo?: Function
65 videoDuration: number 67 videoDuration: number
66 enableHotkeys: boolean 68 enableHotkeys: boolean
67 inactivityTimeout: number 69 inactivityTimeout: number
@@ -233,7 +235,8 @@ export class PeertubePlayerManager {
233 children: this.getControlBarChildren(mode, { 235 children: this.getControlBarChildren(mode, {
234 captions: commonOptions.captions, 236 captions: commonOptions.captions,
235 peertubeLink: commonOptions.peertubeLink, 237 peertubeLink: commonOptions.peertubeLink,
236 theaterButton: commonOptions.theaterButton 238 theaterButton: commonOptions.theaterButton,
239 nextVideo: commonOptions.nextVideo
237 }) 240 })
238 } 241 }
239 } 242 }
@@ -329,7 +332,8 @@ export class PeertubePlayerManager {
329 private static getControlBarChildren (mode: PlayerMode, options: { 332 private static getControlBarChildren (mode: PlayerMode, options: {
330 peertubeLink: boolean 333 peertubeLink: boolean
331 theaterButton: boolean, 334 theaterButton: boolean,
332 captions: boolean 335 captions: boolean,
336 nextVideo?: Function
333 }) { 337 }) {
334 const settingEntries = [] 338 const settingEntries = []
335 const loadProgressBar = mode === 'webtorrent' ? 'peerTubeLoadProgressBar' : 'loadProgressBar' 339 const loadProgressBar = mode === 'webtorrent' ? 'peerTubeLoadProgressBar' : 'loadProgressBar'
@@ -340,7 +344,18 @@ export class PeertubePlayerManager {
340 settingEntries.push('resolutionMenuButton') 344 settingEntries.push('resolutionMenuButton')
341 345
342 const children = { 346 const children = {
343 'playToggle': {}, 347 'playToggle': {}
348 }
349
350 if (options.nextVideo) {
351 Object.assign(children, {
352 'nextVideoButton': {
353 handler: options.nextVideo
354 }
355 })
356 }
357
358 Object.assign(children, {
344 'currentTimeDisplay': {}, 359 'currentTimeDisplay': {},
345 'timeDivider': {}, 360 'timeDivider': {},
346 'durationDisplay': {}, 361 'durationDisplay': {},
@@ -370,7 +385,7 @@ export class PeertubePlayerManager {
370 }, 385 },
371 entries: settingEntries 386 entries: settingEntries
372 } 387 }
373 } 388 })
374 389
375 if (options.peertubeLink === true) { 390 if (options.peertubeLink === true) {
376 Object.assign(children, { 391 Object.assign(children, {
diff --git a/client/src/assets/player/videojs-components/next-video-button.ts b/client/src/assets/player/videojs-components/next-video-button.ts
new file mode 100644
index 000000000..bf5c1aba4
--- /dev/null
+++ b/client/src/assets/player/videojs-components/next-video-button.ts
@@ -0,0 +1,36 @@
1import { VideoJSComponentInterface, videojsUntyped } from '../peertube-videojs-typings'
2// FIXME: something weird with our path definition in tsconfig and typings
3// @ts-ignore
4import { Player } from 'video.js'
5
6const Button: VideoJSComponentInterface = videojsUntyped.getComponent('Button')
7
8class NextVideoButton extends Button {
9
10 constructor (player: Player, options: any) {
11 super(player, options)
12 }
13
14 createEl () {
15 const button = videojsUntyped.dom.createEl('button', {
16 className: 'vjs-next-video'
17 })
18 const nextIcon = videojsUntyped.dom.createEl('span', {
19 className: 'icon icon-next'
20 })
21 button.appendChild(nextIcon)
22
23 button.title = this.player_.localize('Next video')
24
25 return button
26 }
27
28 handleClick () {
29 this.options_.handler()
30 }
31
32}
33
34NextVideoButton.prototype.controlText_ = 'Next video'
35
36NextVideoButton.registerComponent('NextVideoButton', NextVideoButton)