aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+videos/+video-watch/video-watch.component.ts17
-rw-r--r--client/src/assets/player/peertube-player-manager.ts110
-rw-r--r--client/src/assets/player/peertube-videojs-typings.ts9
-rw-r--r--client/src/assets/player/utils.ts6
-rw-r--r--client/src/standalone/videos/embed.ts7
5 files changed, 38 insertions, 111 deletions
diff --git a/client/src/app/+videos/+video-watch/video-watch.component.ts b/client/src/app/+videos/+video-watch/video-watch.component.ts
index 2216bdd4a..366e9bb57 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/+videos/+video-watch/video-watch.component.ts
@@ -795,19 +795,6 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
795 src: environment.apiUrl + c.captionPath 795 src: environment.apiUrl + c.captionPath
796 })) 796 }))
797 797
798 const playlistOptions = this.playlist
799 ? {
800 createComponent: false,
801
802 playlist: this.playlist,
803
804 getCurrentPosition: () => this.playlistPosition,
805
806 embedUrl: this.playlist.embedUrl,
807 embedTitle: this.playlist.displayName
808 }
809 : undefined
810
811 const options: PeertubePlayerManagerOptions = { 798 const options: PeertubePlayerManagerOptions = {
812 common: { 799 common: {
813 autoplay: this.isAutoplay(), 800 autoplay: this.isAutoplay(),
@@ -852,9 +839,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
852 839
853 videoCaptions: playerCaptions, 840 videoCaptions: playerCaptions,
854 841
855 videoUUID: video.uuid, 842 videoUUID: video.uuid
856
857 playlist: playlistOptions
858 }, 843 },
859 844
860 webtorrent: { 845 webtorrent: {
diff --git a/client/src/assets/player/peertube-player-manager.ts b/client/src/assets/player/peertube-player-manager.ts
index 689e70fb5..ed82e0496 100644
--- a/client/src/assets/player/peertube-player-manager.ts
+++ b/client/src/assets/player/peertube-player-manager.ts
@@ -35,7 +35,7 @@ import {
35 VideoJSPluginOptions 35 VideoJSPluginOptions
36} from './peertube-videojs-typings' 36} from './peertube-videojs-typings'
37import { TranslationsManager } from './translations-manager' 37import { TranslationsManager } from './translations-manager'
38import { buildVideoOrPlaylistEmbed, buildVideoLink, getRtcConfig, isSafari, isIOS, buildPlaylistLink } from './utils' 38import { buildVideoOrPlaylistEmbed, buildVideoLink, getRtcConfig, isSafari, isIOS } from './utils'
39import { copyToClipboard } from '../../root-helpers/utils' 39import { copyToClipboard } from '../../root-helpers/utils'
40 40
41// Change 'Playback Rate' to 'Speed' (smaller for our settings menu) 41// Change 'Playback Rate' to 'Speed' (smaller for our settings menu)
@@ -87,8 +87,6 @@ export interface CommonOptions extends CustomizationOptions {
87 hasPreviousVideo?: () => boolean 87 hasPreviousVideo?: () => boolean
88 88
89 playlist?: PlaylistPluginOptions 89 playlist?: PlaylistPluginOptions
90 playlistEmbedUrl?: string
91 playlistEmbedTitle?: string
92 90
93 videoDuration: number 91 videoDuration: number
94 enableHotkeys: boolean 92 enableHotkeys: boolean
@@ -169,13 +167,7 @@ export class PeertubePlayerManager {
169 PeertubePlayerManager.alreadyPlayed = true 167 PeertubePlayerManager.alreadyPlayed = true
170 }) 168 })
171 169
172 self.addContextMenu({ 170 self.addContextMenu(mode, player, options.common.embedUrl, options.common.embedTitle)
173 mode,
174 player,
175 videoEmbedUrl: options.common.embedUrl,
176 videoEmbedTitle: options.common.embedTitle,
177 playlist: options.common.playlist
178 })
179 171
180 player.bezels() 172 player.bezels()
181 173
@@ -213,13 +205,7 @@ export class PeertubePlayerManager {
213 videojs(newVideoElement, videojsOptions, function (this: videojs.Player) { 205 videojs(newVideoElement, videojsOptions, function (this: videojs.Player) {
214 const player = this 206 const player = this
215 207
216 self.addContextMenu({ 208 self.addContextMenu(mode, player, options.common.embedUrl, options.common.embedTitle)
217 mode,
218 player,
219 videoEmbedUrl: options.common.embedUrl,
220 videoEmbedTitle: options.common.embedTitle,
221 playlist: options.common.playlist
222 })
223 209
224 PeertubePlayerManager.onPlayerChange(player) 210 PeertubePlayerManager.onPlayerChange(player)
225 }) 211 })
@@ -253,7 +239,7 @@ export class PeertubePlayerManager {
253 } 239 }
254 } 240 }
255 241
256 if (commonOptions.playlist?.createComponent === true) { 242 if (commonOptions.playlist) {
257 plugins.playlist = commonOptions.playlist 243 plugins.playlist = commonOptions.playlist
258 } 244 }
259 245
@@ -511,71 +497,37 @@ export class PeertubePlayerManager {
511 return children 497 return children
512 } 498 }
513 499
514 private static addContextMenu (options: { 500 private static addContextMenu (mode: PlayerMode, player: videojs.Player, videoEmbedUrl: string, videoEmbedTitle: string) {
515 mode: PlayerMode
516 player: videojs.Player
517 videoEmbedUrl: string
518 videoEmbedTitle: string
519 playlist?: PlaylistPluginOptions
520 }) {
521 const { mode, player, videoEmbedUrl, videoEmbedTitle, playlist } = options
522
523 const content = () => { 501 const content = () => {
524 let items: { icon?: string, label: string, listener: Function }[] = [] 502 const isLoopEnabled = player.options_['loop']
525 503 const items = [
526 if (!playlist) { 504 {
527 const isLoopEnabled = player.options_['loop'] 505 icon: 'repeat',
528 items = items.concat([ 506 label: player.localize('Play in loop') + (isLoopEnabled ? '<span class="vjs-icon-tick-white"></span>' : ''),
529 { 507 listener: function () {
530 icon: 'repeat', 508 player.options_['loop'] = !isLoopEnabled
531 label: player.localize('Play in loop') + (isLoopEnabled ? '<span class="vjs-icon-tick-white"></span>' : ''),
532 listener: function () {
533 player.options_['loop'] = !isLoopEnabled
534 }
535 },
536 {
537 label: player.localize('Copy the video URL'),
538 listener: function () {
539 copyToClipboard(buildVideoLink())
540 }
541 },
542 {
543 label: player.localize('Copy the video URL at the current time'),
544 listener: function (this: videojs.Player) {
545 copyToClipboard(buildVideoLink({ startTime: this.currentTime() }))
546 }
547 } 509 }
548 ]) 510 },
549 } else { 511 {
550 items = items.concat([ 512 label: player.localize('Copy the video URL'),
551 { 513 listener: function () {
552 label: player.localize('Copy the playlist URL'), 514 copyToClipboard(buildVideoLink())
553 listener: function () { 515 }
554 copyToClipboard(buildPlaylistLink()) 516 },
555 } 517 {
556 }, 518 label: player.localize('Copy the video URL at the current time'),
557 { 519 listener: function (this: videojs.Player) {
558 label: player.localize('Copy the playlist URL at current video position'), 520 copyToClipboard(buildVideoLink({ startTime: this.currentTime() }))
559 listener: function (this: videojs.Player) { 521 }
560 copyToClipboard(buildPlaylistLink({ playlistPosition: playlist.getCurrentPosition() })) 522 },
561 } 523 {
562 }, 524 icon: 'code',
563 { 525 label: player.localize('Copy embed code'),
564 label: player.localize('Copy the playlist embed code'), 526 listener: () => {
565 listener: function (this: videojs.Player) { 527 copyToClipboard(buildVideoOrPlaylistEmbed(videoEmbedUrl, videoEmbedTitle))
566 copyToClipboard(buildVideoOrPlaylistEmbed(playlist.embedUrl, playlist.embedTitle))
567 }
568 } 528 }
569 ])
570 }
571
572 items = items.concat({
573 icon: 'code',
574 label: player.localize('Copy video embed code'),
575 listener: () => {
576 copyToClipboard(buildVideoOrPlaylistEmbed(videoEmbedUrl, videoEmbedTitle))
577 } 529 }
578 }) 530 ]
579 531
580 if (mode === 'webtorrent') { 532 if (mode === 'webtorrent') {
581 items.push({ 533 items.push({
diff --git a/client/src/assets/player/peertube-videojs-typings.ts b/client/src/assets/player/peertube-videojs-typings.ts
index a48ff2cd0..4a6c80247 100644
--- a/client/src/assets/player/peertube-videojs-typings.ts
+++ b/client/src/assets/player/peertube-videojs-typings.ts
@@ -113,18 +113,13 @@ type PeerTubePluginOptions = {
113} 113}
114 114
115type PlaylistPluginOptions = { 115type PlaylistPluginOptions = {
116 createComponent: boolean 116 elements: VideoPlaylistElement[]
117
118 elements?: VideoPlaylistElement[]
119 117
120 playlist: VideoPlaylist 118 playlist: VideoPlaylist
121 119
122 getCurrentPosition: () => number 120 getCurrentPosition: () => number
123 121
124 embedUrl: string 122 onItemClicked: (element: VideoPlaylistElement) => void
125 embedTitle: string
126
127 onItemClicked?: (element: VideoPlaylistElement) => void
128} 123}
129 124
130type NextPreviousVideoButtonOptions = { 125type NextPreviousVideoButtonOptions = {
diff --git a/client/src/assets/player/utils.ts b/client/src/assets/player/utils.ts
index 136b69b4f..d7451fa1d 100644
--- a/client/src/assets/player/utils.ts
+++ b/client/src/assets/player/utils.ts
@@ -94,8 +94,9 @@ function buildVideoLink (options: {
94 94
95function buildPlaylistLink (options: { 95function buildPlaylistLink (options: {
96 baseUrl?: string 96 baseUrl?: string
97 playlistPosition?: number 97
98} = {}) { 98 playlistPosition: number
99}) {
99 const { baseUrl } = options 100 const { baseUrl } = options
100 101
101 const url = baseUrl 102 const url = baseUrl
@@ -105,7 +106,6 @@ function buildPlaylistLink (options: {
105 const params = generateParams(window.location.search) 106 const params = generateParams(window.location.search)
106 107
107 if (options.playlistPosition) params.set('playlistPosition', '' + options.playlistPosition) 108 if (options.playlistPosition) params.set('playlistPosition', '' + options.playlistPosition)
108 else params.delete('playlistPosition')
109 109
110 return buildUrl(url, params) 110 return buildUrl(url, params)
111} 111}
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index 9e5b2a655..103014bb0 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -492,8 +492,6 @@ export class PeerTubeEmbed {
492 492
493 const playlistPlugin = this.currentPlaylistElement 493 const playlistPlugin = this.currentPlaylistElement
494 ? { 494 ? {
495 createComponent: true,
496
497 elements: this.playlistElements, 495 elements: this.playlistElements,
498 playlist: this.playlist, 496 playlist: this.playlist,
499 497
@@ -504,10 +502,7 @@ export class PeerTubeEmbed {
504 502
505 this.loadVideoAndBuildPlayer(this.currentPlaylistElement.video.uuid) 503 this.loadVideoAndBuildPlayer(this.currentPlaylistElement.video.uuid)
506 .catch(err => console.error(err)) 504 .catch(err => console.error(err))
507 }, 505 }
508
509 embedTitle: this.playlist.displayName,
510 embedUrl: window.location.origin + this.playlist.embedPath
511 } 506 }
512 : undefined 507 : undefined
513 508