aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2022-05-20 09:59:53 +0200
committerChocobozzz <me@florianbigard.com>2022-05-20 09:59:53 +0200
commit60f013e1031871b7e0913c724f0bd2e569721c8e (patch)
tree9a138d17223292d02ac25ec36392aef30d203d3c /client
parenta871d2a27324defde9a9ee6a998907886715f18e (diff)
downloadPeerTube-60f013e1031871b7e0913c724f0bd2e569721c8e.tar.gz
PeerTube-60f013e1031871b7e0913c724f0bd2e569721c8e.tar.zst
PeerTube-60f013e1031871b7e0913c724f0bd2e569721c8e.zip
Add control bar option for peertube player
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+videos/+video-watch/video-watch.component.ts1
-rw-r--r--client/src/app/shared/shared-share-modal/video-share.component.html4
-rw-r--r--client/src/app/shared/shared-share-modal/video-share.component.ts6
-rw-r--r--client/src/assets/player/peertube-player-manager.ts1
-rw-r--r--client/src/assets/player/types/manager-options.ts2
-rw-r--r--client/src/sass/player/control-bar.scss4
-rw-r--r--client/src/standalone/videos/embed.ts9
7 files changed, 22 insertions, 5 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 61b440859..5fa31ec63 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/+videos/+video-watch/video-watch.component.ts
@@ -602,6 +602,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
602 602
603 startTime, 603 startTime,
604 stopTime: urlOptions.stopTime, 604 stopTime: urlOptions.stopTime,
605 controlBar: urlOptions.controlBar,
605 controls: urlOptions.controls, 606 controls: urlOptions.controls,
606 muted: urlOptions.muted, 607 muted: urlOptions.muted,
607 loop: urlOptions.loop, 608 loop: urlOptions.loop,
diff --git a/client/src/app/shared/shared-share-modal/video-share.component.html b/client/src/app/shared/shared-share-modal/video-share.component.html
index 7ff62e128..67ca56516 100644
--- a/client/src/app/shared/shared-share-modal/video-share.component.html
+++ b/client/src/app/shared/shared-share-modal/video-share.component.html
@@ -250,8 +250,8 @@
250 250
251 <div class="form-group"> 251 <div class="form-group">
252 <my-peertube-checkbox 252 <my-peertube-checkbox
253 inputName="controls" [(ngModel)]="customizations.controls" 253 inputName="controlBar" [(ngModel)]="customizations.controlBar"
254 i18n-labelText labelText="Display player controls" 254 i18n-labelText labelText="Display player control bar"
255 ></my-peertube-checkbox> 255 ></my-peertube-checkbox>
256 </div> 256 </div>
257 257
diff --git a/client/src/app/shared/shared-share-modal/video-share.component.ts b/client/src/app/shared/shared-share-modal/video-share.component.ts
index 6c0d4a039..e0c98008c 100644
--- a/client/src/app/shared/shared-share-modal/video-share.component.ts
+++ b/client/src/app/shared/shared-share-modal/video-share.component.ts
@@ -27,7 +27,7 @@ type Customizations = {
27 onlyEmbedUrl: boolean 27 onlyEmbedUrl: boolean
28 title: boolean 28 title: boolean
29 warningTitle: boolean 29 warningTitle: boolean
30 controls: boolean 30 controlBar: boolean
31 peertubeLink: boolean 31 peertubeLink: boolean
32} 32}
33 33
@@ -88,7 +88,7 @@ export class VideoShareComponent {
88 onlyEmbedUrl: false, 88 onlyEmbedUrl: false,
89 title: true, 89 title: true,
90 warningTitle: true, 90 warningTitle: true,
91 controls: true, 91 controlBar: true,
92 peertubeLink: true 92 peertubeLink: true
93 }, { 93 }, {
94 set: (target, prop, value) => { 94 set: (target, prop, value) => {
@@ -190,7 +190,7 @@ export class VideoShareComponent {
190 ? { 190 ? {
191 title: this.customizations.title, 191 title: this.customizations.title,
192 warningTitle: this.customizations.warningTitle, 192 warningTitle: this.customizations.warningTitle,
193 controls: this.customizations.controls, 193 controlBar: this.customizations.controlBar,
194 peertubeLink: this.customizations.peertubeLink, 194 peertubeLink: this.customizations.peertubeLink,
195 195
196 // If using default value, we don't need to specify it 196 // If using default value, we don't need to specify it
diff --git a/client/src/assets/player/peertube-player-manager.ts b/client/src/assets/player/peertube-player-manager.ts
index 1b2a67c77..b24b6966e 100644
--- a/client/src/assets/player/peertube-player-manager.ts
+++ b/client/src/assets/player/peertube-player-manager.ts
@@ -110,6 +110,7 @@ export class PeertubePlayerManager {
110 110
111 if (isMobile()) player.peertubeMobile() 111 if (isMobile()) player.peertubeMobile()
112 if (options.common.enableHotkeys === true) player.peerTubeHotkeysPlugin() 112 if (options.common.enableHotkeys === true) player.peerTubeHotkeysPlugin()
113 if (options.common.controlBar === false) player.controlBar.addClass('control-bar-hidden')
113 114
114 player.bezels() 115 player.bezels()
115 116
diff --git a/client/src/assets/player/types/manager-options.ts b/client/src/assets/player/types/manager-options.ts
index 456ef115e..a6f00876f 100644
--- a/client/src/assets/player/types/manager-options.ts
+++ b/client/src/assets/player/types/manager-options.ts
@@ -21,6 +21,8 @@ export interface CustomizationOptions {
21 stopTime: number | string 21 stopTime: number | string
22 22
23 controls?: boolean 23 controls?: boolean
24 controlBar?: boolean
25
24 muted?: boolean 26 muted?: boolean
25 loop?: boolean 27 loop?: boolean
26 subtitle?: string 28 subtitle?: string
diff --git a/client/src/sass/player/control-bar.scss b/client/src/sass/player/control-bar.scss
index 9b35c6cb2..56102d3fb 100644
--- a/client/src/sass/player/control-bar.scss
+++ b/client/src/sass/player/control-bar.scss
@@ -4,6 +4,10 @@
4@use './_player-variables' as *; 4@use './_player-variables' as *;
5 5
6.video-js.vjs-peertube-skin .vjs-control-bar { 6.video-js.vjs-peertube-skin .vjs-control-bar {
7 &.control-bar-hidden {
8 display: none !important;
9 }
10
7 z-index: 100; 11 z-index: 100;
8 12
9 height: $control-bar-height; 13 height: $control-bar-height;
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index c0af1dfb3..1fc8e229b 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -37,7 +37,10 @@ export class PeerTubeEmbed {
37 api: PeerTubeEmbedApi = null 37 api: PeerTubeEmbedApi = null
38 38
39 autoplay: boolean 39 autoplay: boolean
40
40 controls: boolean 41 controls: boolean
42 controlBar: boolean
43
41 muted: boolean 44 muted: boolean
42 loop: boolean 45 loop: boolean
43 subtitle: string 46 subtitle: string
@@ -295,7 +298,10 @@ export class PeerTubeEmbed {
295 const params = new URL(window.location.toString()).searchParams 298 const params = new URL(window.location.toString()).searchParams
296 299
297 this.autoplay = this.getParamToggle(params, 'autoplay', false) 300 this.autoplay = this.getParamToggle(params, 'autoplay', false)
301
298 this.controls = this.getParamToggle(params, 'controls', true) 302 this.controls = this.getParamToggle(params, 'controls', true)
303 this.controlBar = this.getParamToggle(params, 'controlBar', true)
304
299 this.muted = this.getParamToggle(params, 'muted', undefined) 305 this.muted = this.getParamToggle(params, 'muted', undefined)
300 this.loop = this.getParamToggle(params, 'loop', false) 306 this.loop = this.getParamToggle(params, 'loop', false)
301 this.title = this.getParamToggle(params, 'title', true) 307 this.title = this.getParamToggle(params, 'title', true)
@@ -539,7 +545,10 @@ export class PeerTubeEmbed {
539 common: { 545 common: {
540 // Autoplay in playlist mode 546 // Autoplay in playlist mode
541 autoplay: alreadyHadPlayer ? true : this.autoplay, 547 autoplay: alreadyHadPlayer ? true : this.autoplay,
548
542 controls: this.controls, 549 controls: this.controls,
550 controlBar: this.controlBar,
551
543 muted: this.muted, 552 muted: this.muted,
544 loop: this.loop, 553 loop: this.loop,
545 554