diff options
author | Chocobozzz <me@florianbigard.com> | 2021-08-17 14:42:53 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2021-08-18 08:35:06 +0200 |
commit | 9df52d660feb722404be00a50f3c8a612bec1c15 (patch) | |
tree | dde52880fa012874d24c60f64eb596b0a789cc8b /client/src/standalone/videos | |
parent | adb8809d43648ea0a64d6845bb39aa3bd0e005a6 (diff) | |
download | PeerTube-9df52d660feb722404be00a50f3c8a612bec1c15.tar.gz PeerTube-9df52d660feb722404be00a50f3c8a612bec1c15.tar.zst PeerTube-9df52d660feb722404be00a50f3c8a612bec1c15.zip |
Migrate client to eslint
Diffstat (limited to 'client/src/standalone/videos')
-rw-r--r-- | client/src/standalone/videos/embed-api.ts | 19 | ||||
-rw-r--r-- | client/src/standalone/videos/embed.ts | 47 | ||||
-rw-r--r-- | client/src/standalone/videos/test-embed.ts | 20 |
3 files changed, 45 insertions, 41 deletions
diff --git a/client/src/standalone/videos/embed-api.ts b/client/src/standalone/videos/embed-api.ts index 75174f2f8..b5c9da431 100644 --- a/client/src/standalone/videos/embed-api.ts +++ b/client/src/standalone/videos/embed-api.ts | |||
@@ -13,7 +13,8 @@ export class PeerTubeEmbedApi { | |||
13 | private isReady = false | 13 | private isReady = false |
14 | private resolutions: PeerTubeResolution[] = [] | 14 | private resolutions: PeerTubeResolution[] = [] |
15 | 15 | ||
16 | constructor (private embed: PeerTubeEmbed) { | 16 | constructor (private readonly embed: PeerTubeEmbed) { |
17 | |||
17 | } | 18 | } |
18 | 19 | ||
19 | initialize () { | 20 | initialize () { |
@@ -45,7 +46,7 @@ export class PeerTubeEmbedApi { | |||
45 | channel.bind('getResolutions', (txn, params) => this.resolutions) | 46 | channel.bind('getResolutions', (txn, params) => this.resolutions) |
46 | 47 | ||
47 | channel.bind('getCaptions', (txn, params) => this.getCaptions()) | 48 | channel.bind('getCaptions', (txn, params) => this.getCaptions()) |
48 | channel.bind('setCaption', (txn, id) => this.setCaption(id)), | 49 | channel.bind('setCaption', (txn, id) => this.setCaption(id)) |
49 | 50 | ||
50 | channel.bind('setPlaybackRate', (txn, playbackRate) => this.embed.player.playbackRate(playbackRate)) | 51 | channel.bind('setPlaybackRate', (txn, playbackRate) => this.embed.player.playbackRate(playbackRate)) |
51 | channel.bind('getPlaybackRate', (txn, params) => this.embed.player.playbackRate()) | 52 | channel.bind('getPlaybackRate', (txn, params) => this.embed.player.playbackRate()) |
@@ -79,14 +80,12 @@ export class PeerTubeEmbedApi { | |||
79 | } | 80 | } |
80 | 81 | ||
81 | private getCaptions (): PeerTubeTextTrack[] { | 82 | private getCaptions (): PeerTubeTextTrack[] { |
82 | return this.embed.player.textTracks().tracks_.map(t => { | 83 | return this.embed.player.textTracks().tracks_.map(t => ({ |
83 | return { | 84 | id: t.id, |
84 | id: t.id, | 85 | src: t.src, |
85 | src: t.src, | 86 | label: t.label, |
86 | label: t.label, | 87 | mode: t.mode |
87 | mode: t.mode as any | 88 | })) |
88 | } | ||
89 | }) | ||
90 | } | 89 | } |
91 | 90 | ||
92 | private setCaption (id: string) { | 91 | private setCaption (id: string) { |
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts index c9a4e541c..dad717108 100644 --- a/client/src/standalone/videos/embed.ts +++ b/client/src/standalone/videos/embed.ts | |||
@@ -64,17 +64,11 @@ export class PeerTubeEmbed { | |||
64 | private playlistElements: VideoPlaylistElement[] | 64 | private playlistElements: VideoPlaylistElement[] |
65 | private currentPlaylistElement: VideoPlaylistElement | 65 | private currentPlaylistElement: VideoPlaylistElement |
66 | 66 | ||
67 | private wrapperElement: HTMLElement | 67 | private readonly wrapperElement: HTMLElement |
68 | 68 | ||
69 | private pluginsManager: PluginsManager | 69 | private pluginsManager: PluginsManager |
70 | 70 | ||
71 | static async main () { | 71 | constructor (private readonly videoWrapperId: string) { |
72 | const videoContainerId = 'video-wrapper' | ||
73 | const embed = new PeerTubeEmbed(videoContainerId) | ||
74 | await embed.init() | ||
75 | } | ||
76 | |||
77 | constructor (private videoWrapperId: string) { | ||
78 | this.wrapperElement = document.getElementById(this.videoWrapperId) | 72 | this.wrapperElement = document.getElementById(this.videoWrapperId) |
79 | 73 | ||
80 | try { | 74 | try { |
@@ -84,6 +78,12 @@ export class PeerTubeEmbed { | |||
84 | } | 78 | } |
85 | } | 79 | } |
86 | 80 | ||
81 | static async main () { | ||
82 | const videoContainerId = 'video-wrapper' | ||
83 | const embed = new PeerTubeEmbed(videoContainerId) | ||
84 | await embed.init() | ||
85 | } | ||
86 | |||
87 | getVideoUrl (id: string) { | 87 | getVideoUrl (id: string) { |
88 | return window.location.origin + '/api/v1/videos/' + id | 88 | return window.location.origin + '/api/v1/videos/' + id |
89 | } | 89 | } |
@@ -316,7 +316,7 @@ export class PeerTubeEmbed { | |||
316 | while (total > elements.length && i < 10) { | 316 | while (total > elements.length && i < 10) { |
317 | const result = await this.loadPlaylistElements(playlistId, elements.length) | 317 | const result = await this.loadPlaylistElements(playlistId, elements.length) |
318 | 318 | ||
319 | const json = await result.json() as ResultList<VideoPlaylistElement> | 319 | const json = await result.json() |
320 | total = json.total | 320 | total = json.total |
321 | 321 | ||
322 | elements = elements.concat(json.data) | 322 | elements = elements.concat(json.data) |
@@ -469,7 +469,7 @@ export class PeerTubeEmbed { | |||
469 | // Issue when we parsed config from HTML, fallback to API | 469 | // Issue when we parsed config from HTML, fallback to API |
470 | if (!this.config) { | 470 | if (!this.config) { |
471 | this.config = await this.refreshFetch('/api/v1/config') | 471 | this.config = await this.refreshFetch('/api/v1/config') |
472 | .then(res => res.json()) | 472 | .then(res => res.json()) |
473 | } | 473 | } |
474 | 474 | ||
475 | const videoInfoPromise = videoResponse.json() | 475 | const videoInfoPromise = videoResponse.json() |
@@ -506,7 +506,7 @@ export class PeerTubeEmbed { | |||
506 | this.currentPlaylistElement = videoPlaylistElement | 506 | this.currentPlaylistElement = videoPlaylistElement |
507 | 507 | ||
508 | this.loadVideoAndBuildPlayer(this.currentPlaylistElement.video.uuid) | 508 | this.loadVideoAndBuildPlayer(this.currentPlaylistElement.video.uuid) |
509 | .catch(err => console.error(err)) | 509 | .catch(err => console.error(err)) |
510 | } | 510 | } |
511 | } | 511 | } |
512 | : undefined | 512 | : undefined |
@@ -542,7 +542,9 @@ export class PeerTubeEmbed { | |||
542 | isLive: videoInfo.isLive, | 542 | isLive: videoInfo.isLive, |
543 | 543 | ||
544 | playerElement: this.playerElement, | 544 | playerElement: this.playerElement, |
545 | onPlayerElementChange: (element: HTMLVideoElement) => this.playerElement = element, | 545 | onPlayerElementChange: (element: HTMLVideoElement) => { |
546 | this.playerElement = element | ||
547 | }, | ||
546 | 548 | ||
547 | videoDuration: videoInfo.duration, | 549 | videoDuration: videoInfo.duration, |
548 | enableHotkeys: true, | 550 | enableHotkeys: true, |
@@ -577,10 +579,13 @@ export class PeerTubeEmbed { | |||
577 | }) | 579 | }) |
578 | } | 580 | } |
579 | 581 | ||
580 | this.player = await PeertubePlayerManager.initialize(this.mode, options, (player: videojs.Player) => this.player = player) | 582 | this.player = await PeertubePlayerManager.initialize(this.mode, options, (player: videojs.Player) => { |
583 | this.player = player | ||
584 | }) | ||
585 | |||
581 | this.player.on('customError', (event: any, data: any) => this.handleError(data.err, serverTranslations)) | 586 | this.player.on('customError', (event: any, data: any) => this.handleError(data.err, serverTranslations)) |
582 | 587 | ||
583 | window[ 'videojsPlayer' ] = this.player | 588 | window['videojsPlayer'] = this.player |
584 | 589 | ||
585 | this.buildCSS() | 590 | this.buildCSS() |
586 | 591 | ||
@@ -656,7 +661,7 @@ export class PeerTubeEmbed { | |||
656 | this.player.dispose() | 661 | this.player.dispose() |
657 | this.playerElement = null | 662 | this.playerElement = null |
658 | this.displayError('This video is not available because the remote instance is not responding.', translations) | 663 | this.displayError('This video is not available because the remote instance is not responding.', translations) |
659 | return | 664 | |
660 | } | 665 | } |
661 | } | 666 | } |
662 | 667 | ||
@@ -694,9 +699,9 @@ export class PeerTubeEmbed { | |||
694 | 699 | ||
695 | private async buildCaptions (serverTranslations: any, captionsResponse: Response): Promise<VideoJSCaption[]> { | 700 | private async buildCaptions (serverTranslations: any, captionsResponse: Response): Promise<VideoJSCaption[]> { |
696 | if (captionsResponse.ok) { | 701 | if (captionsResponse.ok) { |
697 | const { data } = (await captionsResponse.json()) as ResultList<VideoCaption> | 702 | const { data } = await captionsResponse.json() |
698 | 703 | ||
699 | return data.map(c => ({ | 704 | return data.map((c: VideoCaption) => ({ |
700 | label: peertubeTranslate(c.language.label, serverTranslations), | 705 | label: peertubeTranslate(c.language.label, serverTranslations), |
701 | language: c.language.id, | 706 | language: c.language.id, |
702 | src: window.location.origin + c.captionPath | 707 | src: window.location.origin + c.captionPath |
@@ -733,7 +738,7 @@ export class PeerTubeEmbed { | |||
733 | 738 | ||
734 | private getResourceId () { | 739 | private getResourceId () { |
735 | const urlParts = window.location.pathname.split('/') | 740 | const urlParts = window.location.pathname.split('/') |
736 | return urlParts[ urlParts.length - 1 ] | 741 | return urlParts[urlParts.length - 1] |
737 | } | 742 | } |
738 | 743 | ||
739 | private isPlaylistEmbed () { | 744 | private isPlaylistEmbed () { |
@@ -751,7 +756,7 @@ export class PeerTubeEmbed { | |||
751 | } | 756 | } |
752 | 757 | ||
753 | private buildPeerTubeHelpers (translations?: { [ id: string ]: string }): RegisterClientHelpers { | 758 | private buildPeerTubeHelpers (translations?: { [ id: string ]: string }): RegisterClientHelpers { |
754 | function unimplemented (): any { | 759 | const unimplemented = () => { |
755 | throw new Error('This helper is not implemented in embed.') | 760 | throw new Error('This helper is not implemented in embed.') |
756 | } | 761 | } |
757 | 762 | ||
@@ -780,9 +785,7 @@ export class PeerTubeEmbed { | |||
780 | enhancedMarkdownToHTML: unimplemented | 785 | enhancedMarkdownToHTML: unimplemented |
781 | }, | 786 | }, |
782 | 787 | ||
783 | translate: (value: string) => { | 788 | translate: (value: string) => Promise.resolve(peertubeTranslate(value, translations)) |
784 | return Promise.resolve(peertubeTranslate(value, translations)) | ||
785 | } | ||
786 | } | 789 | } |
787 | } | 790 | } |
788 | } | 791 | } |
diff --git a/client/src/standalone/videos/test-embed.ts b/client/src/standalone/videos/test-embed.ts index 6e035c0c9..066b3e024 100644 --- a/client/src/standalone/videos/test-embed.ts +++ b/client/src/standalone/videos/test-embed.ts | |||
@@ -4,11 +4,11 @@ import { PeerTubePlayer } from '../player/player' | |||
4 | 4 | ||
5 | window.addEventListener('load', async () => { | 5 | window.addEventListener('load', async () => { |
6 | const urlParts = window.location.href.split('/') | 6 | const urlParts = window.location.href.split('/') |
7 | const lastPart = urlParts[ urlParts.length - 1 ] | 7 | const lastPart = urlParts[urlParts.length - 1] |
8 | 8 | ||
9 | const isPlaylist = window.location.pathname.startsWith('/video-playlists/') | 9 | const isPlaylist = window.location.pathname.startsWith('/video-playlists/') |
10 | 10 | ||
11 | const elementId = lastPart.indexOf('?') === -1 ? lastPart : lastPart.split('?')[ 0 ] | 11 | const elementId = lastPart.indexOf('?') === -1 ? lastPart : lastPart.split('?')[0] |
12 | 12 | ||
13 | const iframe = document.createElement('iframe') | 13 | const iframe = document.createElement('iframe') |
14 | iframe.src = isPlaylist | 14 | iframe.src = isPlaylist |
@@ -18,14 +18,14 @@ window.addEventListener('load', async () => { | |||
18 | const mainElement = document.querySelector('#host') | 18 | const mainElement = document.querySelector('#host') |
19 | mainElement.appendChild(iframe) | 19 | mainElement.appendChild(iframe) |
20 | 20 | ||
21 | console.log(`Document finished loading.`) | 21 | console.log('Document finished loading.') |
22 | const player = new PeerTubePlayer(document.querySelector('iframe')) | 22 | const player = new PeerTubePlayer(document.querySelector('iframe')) |
23 | 23 | ||
24 | window[ 'player' ] = player | 24 | window['player'] = player |
25 | 25 | ||
26 | console.log(`Awaiting player ready...`) | 26 | console.log('Awaiting player ready...') |
27 | await player.ready | 27 | await player.ready |
28 | console.log(`Player is ready.`) | 28 | console.log('Player is ready.') |
29 | 29 | ||
30 | const monitoredEvents = [ | 30 | const monitoredEvents = [ |
31 | 'pause', | 31 | 'pause', |
@@ -39,7 +39,9 @@ window.addEventListener('load', async () => { | |||
39 | console.log(`PLAYER: now listening for event '${e}'`) | 39 | console.log(`PLAYER: now listening for event '${e}'`) |
40 | 40 | ||
41 | player.getCurrentPosition() | 41 | player.getCurrentPosition() |
42 | .then(position => document.getElementById('playlist-position').innerHTML = position + '') | 42 | .then(position => { |
43 | document.getElementById('playlist-position').innerHTML = position + '' | ||
44 | }) | ||
43 | }) | 45 | }) |
44 | 46 | ||
45 | let playbackRates: number[] = [] | 47 | let playbackRates: number[] = [] |
@@ -105,7 +107,7 @@ window.addEventListener('load', async () => { | |||
105 | 107 | ||
106 | updateCaptions() | 108 | updateCaptions() |
107 | 109 | ||
108 | const updateResolutions = ((resolutions: PeerTubeResolution[]) => { | 110 | const updateResolutions = (resolutions: PeerTubeResolution[]) => { |
109 | const resolutionListEl = document.querySelector('#resolution-list') | 111 | const resolutionListEl = document.querySelector('#resolution-list') |
110 | resolutionListEl.innerHTML = '' | 112 | resolutionListEl.innerHTML = '' |
111 | 113 | ||
@@ -126,7 +128,7 @@ window.addEventListener('load', async () => { | |||
126 | resolutionListEl.appendChild(itemEl) | 128 | resolutionListEl.appendChild(itemEl) |
127 | } | 129 | } |
128 | }) | 130 | }) |
129 | }) | 131 | } |
130 | 132 | ||
131 | player.getResolutions().then( | 133 | player.getResolutions().then( |
132 | resolutions => updateResolutions(resolutions)) | 134 | resolutions => updateResolutions(resolutions)) |