diff options
author | Chocobozzz <me@florianbigard.com> | 2020-02-03 13:33:42 +0100 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2020-02-03 13:33:42 +0100 |
commit | abb3097e814af0f22477aea68310e85671230942 (patch) | |
tree | b88b2c835f1d437aef0d822d9985961858c15067 /client/src/standalone/videos | |
parent | 598edb8af1cc7e5ea3ead1ec9c96c4853b90be36 (diff) | |
download | PeerTube-abb3097e814af0f22477aea68310e85671230942.tar.gz PeerTube-abb3097e814af0f22477aea68310e85671230942.tar.zst PeerTube-abb3097e814af0f22477aea68310e85671230942.zip |
Improve embed title background opacity
Diffstat (limited to 'client/src/standalone/videos')
-rw-r--r-- | client/src/standalone/videos/embed.ts | 40 |
1 files changed, 20 insertions, 20 deletions
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts index c91ae08b9..d5b42a025 100644 --- a/client/src/standalone/videos/embed.ts +++ b/client/src/standalone/videos/embed.ts | |||
@@ -1,15 +1,11 @@ | |||
1 | import './embed.scss' | 1 | import './embed.scss' |
2 | 2 | ||
3 | import { | 3 | import { |
4 | getCompleteLocale, | ||
5 | is18nLocale, | ||
6 | isDefaultLocale, | ||
7 | peertubeTranslate, | 4 | peertubeTranslate, |
8 | ResultList, | 5 | ResultList, |
9 | ServerConfig, | 6 | ServerConfig, |
10 | VideoDetails | 7 | VideoDetails |
11 | } from '../../../../shared' | 8 | } from '../../../../shared' |
12 | import { VideoJSCaption } from '../../assets/player/peertube-videojs-typings' | ||
13 | import { VideoCaption } from '../../../../shared/models/videos/caption/video-caption.model' | 9 | import { VideoCaption } from '../../../../shared/models/videos/caption/video-caption.model' |
14 | import { | 10 | import { |
15 | P2PMediaLoaderOptions, | 11 | P2PMediaLoaderOptions, |
@@ -19,10 +15,14 @@ import { | |||
19 | import { VideoStreamingPlaylistType } from '../../../../shared/models/videos/video-streaming-playlist.type' | 15 | import { VideoStreamingPlaylistType } from '../../../../shared/models/videos/video-streaming-playlist.type' |
20 | import { PeerTubeEmbedApi } from './embed-api' | 16 | import { PeerTubeEmbedApi } from './embed-api' |
21 | import { TranslationsManager } from '../../assets/player/translations-manager' | 17 | import { TranslationsManager } from '../../assets/player/translations-manager' |
18 | import { VideoJsPlayer } from 'video.js' | ||
19 | import { VideoJSCaption } from '../../assets/player/peertube-videojs-typings' | ||
20 | |||
21 | type Translations = { [ id: string ]: string } | ||
22 | 22 | ||
23 | export class PeerTubeEmbed { | 23 | export class PeerTubeEmbed { |
24 | videoElement: HTMLVideoElement | 24 | videoElement: HTMLVideoElement |
25 | player: any | 25 | player: VideoJsPlayer |
26 | api: PeerTubeEmbedApi = null | 26 | api: PeerTubeEmbedApi = null |
27 | autoplay: boolean | 27 | autoplay: boolean |
28 | controls: boolean | 28 | controls: boolean |
@@ -71,7 +71,7 @@ export class PeerTubeEmbed { | |||
71 | element.parentElement.removeChild(element) | 71 | element.parentElement.removeChild(element) |
72 | } | 72 | } |
73 | 73 | ||
74 | displayError (text: string, translations?: { [ id: string ]: string }) { | 74 | displayError (text: string, translations?: Translations) { |
75 | // Remove video element | 75 | // Remove video element |
76 | if (this.videoElement) this.removeElement(this.videoElement) | 76 | if (this.videoElement) this.removeElement(this.videoElement) |
77 | 77 | ||
@@ -90,12 +90,12 @@ export class PeerTubeEmbed { | |||
90 | errorText.innerHTML = translatedText | 90 | errorText.innerHTML = translatedText |
91 | } | 91 | } |
92 | 92 | ||
93 | videoNotFound (translations?: { [ id: string ]: string }) { | 93 | videoNotFound (translations?: Translations) { |
94 | const text = 'This video does not exist.' | 94 | const text = 'This video does not exist.' |
95 | this.displayError(text, translations) | 95 | this.displayError(text, translations) |
96 | } | 96 | } |
97 | 97 | ||
98 | videoFetchError (translations?: { [ id: string ]: string }) { | 98 | videoFetchError (translations?: Translations) { |
99 | const text = 'We cannot fetch the video. Please try again later.' | 99 | const text = 'We cannot fetch the video. Please try again later.' |
100 | this.displayError(text, translations) | 100 | this.displayError(text, translations) |
101 | } | 101 | } |
@@ -237,7 +237,7 @@ export class PeerTubeEmbed { | |||
237 | }) | 237 | }) |
238 | } | 238 | } |
239 | 239 | ||
240 | this.player = await PeertubePlayerManager.initialize(this.mode, options, (player: any) => this.player = player) | 240 | this.player = await PeertubePlayerManager.initialize(this.mode, options, (player: VideoJsPlayer) => this.player = player) |
241 | this.player.on('customError', (event: any, data: any) => this.handleError(data.err, serverTranslations)) | 241 | this.player.on('customError', (event: any, data: any) => this.handleError(data.err, serverTranslations)) |
242 | 242 | ||
243 | window[ 'videojsPlayer' ] = this.player | 243 | window[ 'videojsPlayer' ] = this.player |
@@ -261,19 +261,19 @@ export class PeerTubeEmbed { | |||
261 | } | 261 | } |
262 | 262 | ||
263 | private async buildDock (videoInfo: VideoDetails, configResponse: Response) { | 263 | private async buildDock (videoInfo: VideoDetails, configResponse: Response) { |
264 | if (this.controls) { | 264 | if (!this.controls) return |
265 | const title = this.title ? videoInfo.name : undefined | ||
266 | 265 | ||
267 | const config: ServerConfig = await configResponse.json() | 266 | const title = this.title ? videoInfo.name : undefined |
268 | const description = config.tracker.enabled && this.warningTitle | ||
269 | ? '<span class="text">' + this.player.localize('Watching this video may reveal your IP address to others.') + '</span>' | ||
270 | : undefined | ||
271 | 267 | ||
272 | this.player.dock({ | 268 | const config: ServerConfig = await configResponse.json() |
273 | title, | 269 | const description = config.tracker.enabled && this.warningTitle |
274 | description | 270 | ? '<span class="text">' + peertubeTranslate('Watching this video may reveal your IP address to others.') + '</span>' |
275 | }) | 271 | : undefined |
276 | } | 272 | |
273 | this.player.dock({ | ||
274 | title, | ||
275 | description | ||
276 | }) | ||
277 | } | 277 | } |
278 | 278 | ||
279 | private buildCSS () { | 279 | private buildCSS () { |