aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2022-06-28 14:04:03 +0200
committerChocobozzz <me@florianbigard.com>2022-06-28 14:11:10 +0200
commitbd2b51be4b29e6c3c72d8715164cde672bd41186 (patch)
treef3d54d1a49dffacd073dedc288fa8f7c2e7f7683
parent9f4109e263be961ab0b210fcbc003a8c78f5b9fe (diff)
downloadPeerTube-bd2b51be4b29e6c3c72d8715164cde672bd41186.tar.gz
PeerTube-bd2b51be4b29e6c3c72d8715164cde672bd41186.tar.zst
PeerTube-bd2b51be4b29e6c3c72d8715164cde672bd41186.zip
Put instance name in embed button
-rw-r--r--client/src/app/+videos/+video-watch/video-watch.component.ts1
-rw-r--r--client/src/assets/player/shared/control-bar/peertube-link-button.ts4
-rw-r--r--client/src/assets/player/shared/manager-options/control-bar-options-builder.ts5
-rw-r--r--client/src/assets/player/types/manager-options.ts2
-rw-r--r--client/src/assets/player/types/peertube-videojs-typings.ts1
-rw-r--r--client/src/sass/player/control-bar.scss19
-rw-r--r--client/src/standalone/videos/embed.scss19
-rw-r--r--client/src/standalone/videos/embed.ts2
-rw-r--r--client/src/standalone/videos/shared/player-manager-options.ts8
9 files changed, 37 insertions, 24 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 d05f08a5f..6a3bd1522 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/+videos/+video-watch/video-watch.component.ts
@@ -627,6 +627,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
627 627
628 embedUrl: video.embedUrl, 628 embedUrl: video.embedUrl,
629 embedTitle: video.name, 629 embedTitle: video.name,
630 instanceName: this.serverConfig.instance.name,
630 631
631 isLive: video.isLive, 632 isLive: video.isLive,
632 liveOptions, 633 liveOptions,
diff --git a/client/src/assets/player/shared/control-bar/peertube-link-button.ts b/client/src/assets/player/shared/control-bar/peertube-link-button.ts
index 6d83263cc..4687525a9 100644
--- a/client/src/assets/player/shared/control-bar/peertube-link-button.ts
+++ b/client/src/assets/player/shared/control-bar/peertube-link-button.ts
@@ -5,6 +5,8 @@ import { PeerTubeLinkButtonOptions } from '../../types'
5const Button = videojs.getComponent('Button') 5const Button = videojs.getComponent('Button')
6class PeerTubeLinkButton extends Button { 6class PeerTubeLinkButton extends Button {
7 7
8 private instanceName: string
9
8 constructor (player: videojs.Player, options?: PeerTubeLinkButtonOptions) { 10 constructor (player: videojs.Player, options?: PeerTubeLinkButtonOptions) {
9 super(player, options as any) 11 super(player, options as any)
10 } 12 }
@@ -24,7 +26,7 @@ class PeerTubeLinkButton extends Button {
24 private buildElement () { 26 private buildElement () {
25 const el = videojs.dom.createEl('a', { 27 const el = videojs.dom.createEl('a', {
26 href: this.buildLink(), 28 href: this.buildLink(),
27 innerHTML: 'PeerTube', 29 innerHTML: (this.options_ as PeerTubeLinkButtonOptions).instanceName,
28 title: this.player().localize('Video page (new window)'), 30 title: this.player().localize('Video page (new window)'),
29 className: 'vjs-peertube-link', 31 className: 'vjs-peertube-link',
30 target: '_blank' 32 target: '_blank'
diff --git a/client/src/assets/player/shared/manager-options/control-bar-options-builder.ts b/client/src/assets/player/shared/manager-options/control-bar-options-builder.ts
index 72a10eb26..27f366732 100644
--- a/client/src/assets/player/shared/manager-options/control-bar-options-builder.ts
+++ b/client/src/assets/player/shared/manager-options/control-bar-options-builder.ts
@@ -51,7 +51,10 @@ export class ControlBarOptionsBuilder {
51 51
52 if (this.options.peertubeLink === true) { 52 if (this.options.peertubeLink === true) {
53 Object.assign(children, { 53 Object.assign(children, {
54 peerTubeLinkButton: { shortUUID: this.options.videoShortUUID } as PeerTubeLinkButtonOptions 54 peerTubeLinkButton: {
55 shortUUID: this.options.videoShortUUID,
56 instanceName: this.options.instanceName
57 } as PeerTubeLinkButtonOptions
55 }) 58 })
56 } 59 }
57 60
diff --git a/client/src/assets/player/types/manager-options.ts b/client/src/assets/player/types/manager-options.ts
index a6f00876f..cadce739d 100644
--- a/client/src/assets/player/types/manager-options.ts
+++ b/client/src/assets/player/types/manager-options.ts
@@ -51,6 +51,8 @@ export interface CommonOptions extends CustomizationOptions {
51 inactivityTimeout: number 51 inactivityTimeout: number
52 poster: string 52 poster: string
53 53
54 instanceName: string
55
54 theaterButton: boolean 56 theaterButton: boolean
55 captions: boolean 57 captions: boolean
56 58
diff --git a/client/src/assets/player/types/peertube-videojs-typings.ts b/client/src/assets/player/types/peertube-videojs-typings.ts
index ad284a671..115afb614 100644
--- a/client/src/assets/player/types/peertube-videojs-typings.ts
+++ b/client/src/assets/player/types/peertube-videojs-typings.ts
@@ -127,6 +127,7 @@ type NextPreviousVideoButtonOptions = {
127 127
128type PeerTubeLinkButtonOptions = { 128type PeerTubeLinkButtonOptions = {
129 shortUUID: string 129 shortUUID: string
130 instanceName: string
130} 131}
131 132
132type PeerTubeP2PInfoButtonOptions = { 133type PeerTubeP2PInfoButtonOptions = {
diff --git a/client/src/sass/player/control-bar.scss b/client/src/sass/player/control-bar.scss
index 6271523af..34470f3b1 100644
--- a/client/src/sass/player/control-bar.scss
+++ b/client/src/sass/player/control-bar.scss
@@ -160,8 +160,8 @@
160 160
161 .vjs-peertube { 161 .vjs-peertube {
162 @include margin-right(6px); 162 @include margin-right(6px);
163 @include margin-left(auto);
163 164
164 width: 100%;
165 line-height: $control-bar-height; 165 line-height: $control-bar-height;
166 text-align: end; 166 text-align: end;
167 overflow: hidden; 167 overflow: hidden;
@@ -358,11 +358,13 @@
358 .vjs-peertube-link { 358 .vjs-peertube-link {
359 @include disable-outline; 359 @include disable-outline;
360 @include disable-default-a-behaviour; 360 @include disable-default-a-behaviour;
361 @include ellipsis;
361 362
362 text-decoration: none; 363 text-decoration: none;
363 line-height: $control-bar-height; 364 line-height: $control-bar-height;
364 font-weight: $font-semibold; 365 font-weight: $font-semibold;
365 padding: 0 5px; 366 padding: 0 5px;
367 max-width: 150px;
366 } 368 }
367 369
368 .vjs-theater-control { 370 .vjs-theater-control {
@@ -420,6 +422,10 @@
420 } 422 }
421 423
422 @media screen and (max-width: $screen-width-570) { 424 @media screen and (max-width: $screen-width-570) {
425 .vjs-volume-control {
426 display: none;
427 }
428
423 .vjs-peertube { 429 .vjs-peertube {
424 padding: 0 !important; 430 padding: 0 !important;
425 431
@@ -428,6 +434,10 @@
428 } 434 }
429 } 435 }
430 436
437 .vjs-peertube-link {
438 max-width: 100px;
439 }
440
431 &.vjs-live { 441 &.vjs-live {
432 .vjs-duration { 442 .vjs-duration {
433 display: none !important; 443 display: none !important;
@@ -440,7 +450,6 @@
440 } 450 }
441 451
442 @media screen and (max-width: $screen-width-350) { 452 @media screen and (max-width: $screen-width-350) {
443 .vjs-volume-control,
444 .vjs-next-video, 453 .vjs-next-video,
445 .vjs-previous-video { 454 .vjs-previous-video {
446 display: none !important; 455 display: none !important;
@@ -458,6 +467,12 @@
458 @include margin-right($first-control-bar-element-margin-left-small-width); 467 @include margin-right($first-control-bar-element-margin-left-small-width);
459 } 468 }
460 469
470 .vjs-play-control {
471 @include margin-left(0);
472
473 width: 30px;
474 }
475
461 &.vjs-live { 476 &.vjs-live {
462 .vjs-current-time { 477 .vjs-current-time {
463 display: none !important; 478 display: none !important;
diff --git a/client/src/standalone/videos/embed.scss b/client/src/standalone/videos/embed.scss
index 8c20bae79..3631ea7e6 100644
--- a/client/src/standalone/videos/embed.scss
+++ b/client/src/standalone/videos/embed.scss
@@ -40,25 +40,6 @@ body {
40 .vjs-poster { 40 .vjs-poster {
41 background-size: 100% auto; 41 background-size: 100% auto;
42 } 42 }
43
44 @media screen and (max-width: 350px) {
45 .vjs-play-control {
46 padding: 0 5px !important;
47 width: 25px !important;
48 }
49
50 .vjs-volume-control {
51 display: none !important;
52 }
53
54 .vjs-volume-panel {
55 width: 26px !important;
56 }
57
58 .vjs-peertube-link {
59 padding: 0;
60 }
61 }
62} 43}
63 44
64#error-block { 45#error-block {
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index 0a2b0ccbd..c15d4db17 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -196,6 +196,8 @@ export class PeerTubeEmbed {
196 captionsResponse, 196 captionsResponse,
197 alreadyHadPlayer, 197 alreadyHadPlayer,
198 translations, 198 translations,
199 serverConfig: this.config,
200
199 onVideoUpdate: (uuid: string) => this.loadVideoAndBuildPlayer(uuid), 201 onVideoUpdate: (uuid: string) => this.loadVideoAndBuildPlayer(uuid),
200 202
201 playlistTracker: this.playlistTracker, 203 playlistTracker: this.playlistTracker,
diff --git a/client/src/standalone/videos/shared/player-manager-options.ts b/client/src/standalone/videos/shared/player-manager-options.ts
index 144d74319..f3bd46a69 100644
--- a/client/src/standalone/videos/shared/player-manager-options.ts
+++ b/client/src/standalone/videos/shared/player-manager-options.ts
@@ -148,6 +148,8 @@ export class PlayerManagerOptions {
148 captionsResponse: Response 148 captionsResponse: Response
149 live?: LiveVideo 149 live?: LiveVideo
150 150
151 serverConfig: HTMLServerConfig
152
151 alreadyHadPlayer: boolean 153 alreadyHadPlayer: boolean
152 154
153 translations: Translations 155 translations: Translations
@@ -163,7 +165,8 @@ export class PlayerManagerOptions {
163 alreadyHadPlayer, 165 alreadyHadPlayer,
164 translations, 166 translations,
165 playlistTracker, 167 playlistTracker,
166 live 168 live,
169 serverConfig
167 } = options 170 } = options
168 171
169 const videoCaptions = await this.buildCaptions(captionsResponse, translations) 172 const videoCaptions = await this.buildCaptions(captionsResponse, translations)
@@ -205,7 +208,10 @@ export class PlayerManagerOptions {
205 208
206 videoDuration: video.duration, 209 videoDuration: video.duration,
207 enableHotkeys: true, 210 enableHotkeys: true,
211
208 peertubeLink: this.peertubeLink, 212 peertubeLink: this.peertubeLink,
213 instanceName: serverConfig.instance.name,
214
209 poster: window.location.origin + video.previewPath, 215 poster: window.location.origin + video.previewPath,
210 theaterButton: false, 216 theaterButton: false,
211 217