aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/standalone/videos
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2021-08-17 14:42:53 +0200
committerChocobozzz <me@florianbigard.com>2021-08-18 08:35:06 +0200
commit9df52d660feb722404be00a50f3c8a612bec1c15 (patch)
treedde52880fa012874d24c60f64eb596b0a789cc8b /client/src/standalone/videos
parentadb8809d43648ea0a64d6845bb39aa3bd0e005a6 (diff)
downloadPeerTube-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.ts19
-rw-r--r--client/src/standalone/videos/embed.ts47
-rw-r--r--client/src/standalone/videos/test-embed.ts20
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
5window.addEventListener('load', async () => { 5window.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))