]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/standalone/player/player.ts
Handle playlist methods in embed api
[github/Chocobozzz/PeerTube.git] / client / src / standalone / player / player.ts
CommitLineData
99941732 1import * as Channel from 'jschannel'
1151f521 2import { EventHandler, PeerTubeResolution, PeerTubeTextTrack, PlayerEventType } from './definitions'
99941732 3import { EventRegistrar } from './events'
99941732
WL
4
5const PASSTHROUGH_EVENTS = [
902aa3a0
C
6 'pause',
7 'play',
99941732
WL
8 'playbackStatusUpdate',
9 'playbackStatusChange',
6377a9f2
C
10 'resolutionUpdate',
11 'volumeChange'
99941732
WL
12]
13
14/**
902aa3a0 15 * Allows for programmatic control of a PeerTube embed running in an <iframe>
99941732
WL
16 * within a web page.
17 */
18export class PeerTubePlayer {
902aa3a0
C
19
20 private eventRegistrar: EventRegistrar = new EventRegistrar()
21 private channel: Channel.MessagingChannel
22 private readyPromise: Promise<void>
23
99941732
WL
24 /**
25 * Construct a new PeerTubePlayer for the given PeerTube embed iframe.
902aa3a0
C
26 * Optionally provide a `scope` to ensure that messages are not crossed
27 * between multiple PeerTube embeds. The string passed here must match the
99941732 28 * `scope=` query parameter on the embed URL.
902aa3a0
C
29 *
30 * @param embedElement
31 * @param scope
99941732 32 */
902aa3a0
C
33 constructor (
34 private embedElement: HTMLIFrameElement,
35 private scope?: string
99941732
WL
36 ) {
37 this.eventRegistrar.registerTypes(PASSTHROUGH_EVENTS)
38
39 this.constructChannel()
40 this.prepareToBeReady()
41 }
42
99941732
WL
43 /**
44 * Destroy the player object and remove the associated player from the DOM.
45 */
902aa3a0 46 destroy () {
99941732
WL
47 this.embedElement.remove()
48 }
49
50 /**
51 * Listen to an event emitted by this player.
902aa3a0 52 *
99941732
WL
53 * @param event One of the supported event types
54 * @param handler A handler which will be passed an event object (or undefined if no event object is included)
55 */
902aa3a0 56 addEventListener (event: PlayerEventType, handler: EventHandler<any>): boolean {
99941732
WL
57 return this.eventRegistrar.addListener(event, handler)
58 }
59
60 /**
61 * Remove an event listener previously added with addEventListener().
902aa3a0 62 *
99941732 63 * @param event The name of the event previously listened to
902aa3a0 64 * @param handler
99941732 65 */
902aa3a0 66 removeEventListener (event: PlayerEventType, handler: EventHandler<any>): boolean {
99941732
WL
67 return this.eventRegistrar.removeListener(event, handler)
68 }
902aa3a0 69
99941732
WL
70 /**
71 * Promise resolves when the player is ready.
72 */
902aa3a0 73 get ready (): Promise<void> {
99941732
WL
74 return this.readyPromise
75 }
76
77 /**
78 * Tell the embed to start/resume playback
79 */
902aa3a0 80 async play () {
99941732
WL
81 await this.sendMessage('play')
82 }
83
84 /**
85 * Tell the embed to pause playback.
86 */
902aa3a0 87 async pause () {
99941732
WL
88 await this.sendMessage('pause')
89 }
90
91 /**
92 * Tell the embed to change the audio volume
93 * @param value A number from 0 to 1
94 */
902aa3a0 95 async setVolume (value: number) {
99941732
WL
96 await this.sendMessage('setVolume', value)
97 }
98
99 /**
100 * Get the current volume level in the embed.
101 * @param value A number from 0 to 1
102 */
902aa3a0 103 async getVolume (): Promise<number> {
6377a9f2 104 return this.sendMessage<void, number>('getVolume')
99941732
WL
105 }
106
1151f521
C
107 /**
108 * Tell the embed to change the current caption
109 * @param value Caption id
110 */
111 async setCaption (value: string) {
112 await this.sendMessage('setCaption', value)
113 }
114
115 /**
116 * Get video captions
117 */
118 async getCaptions (): Promise<PeerTubeTextTrack[]> {
119 return this.sendMessage<void, PeerTubeTextTrack[]>('getCaptions')
120 }
121
99941732
WL
122 /**
123 * Tell the embed to seek to a specific position (in seconds)
902aa3a0 124 * @param seconds
99941732 125 */
902aa3a0 126 async seek (seconds: number) {
99941732
WL
127 await this.sendMessage('seek', seconds)
128 }
129
130 /**
131 * Tell the embed to switch resolutions to the resolution identified
132 * by the given ID.
902aa3a0 133 *
99941732
WL
134 * @param resolutionId The ID of the resolution as found with getResolutions()
135 */
902aa3a0 136 async setResolution (resolutionId: any) {
99941732
WL
137 await this.sendMessage('setResolution', resolutionId)
138 }
139
140 /**
902aa3a0 141 * Retrieve a list of the available resolutions. This may change later, listen to the
99941732
WL
142 * `resolutionUpdate` event with `addEventListener` in order to be updated as the available
143 * resolutions change.
144 */
902aa3a0
C
145 async getResolutions (): Promise<PeerTubeResolution[]> {
146 return this.sendMessage<void, PeerTubeResolution[]>('getResolutions')
99941732
WL
147 }
148
149 /**
902aa3a0 150 * Retrieve a list of available playback rates.
99941732 151 */
902aa3a0
C
152 async getPlaybackRates (): Promise<number[]> {
153 return this.sendMessage<void, number[]>('getPlaybackRates')
99941732 154 }
902aa3a0 155
99941732
WL
156 /**
157 * Get the current playback rate. Defaults to 1 (1x playback rate).
158 */
902aa3a0
C
159 async getPlaybackRate (): Promise<number> {
160 return this.sendMessage<void, number>('getPlaybackRate')
99941732
WL
161 }
162
163 /**
164 * Set the playback rate. Should be one of the options returned by getPlaybackRates().
165 * Passing 0.5 means half speed, 1 means normal, 2 means 2x speed, etc.
902aa3a0
C
166 *
167 * @param rate
99941732 168 */
902aa3a0 169 async setPlaybackRate (rate: number) {
99941732
WL
170 await this.sendMessage('setPlaybackRate', rate)
171 }
172
9054a8b6
C
173 /**
174 * Play next video in playlist
175 */
176 async playNextVideo () {
177 await this.sendMessage('playNextVideo')
178 }
179
180 /**
181 * Play previous video in playlist
182 */
183 async playPreviousVideo () {
184 await this.sendMessage('playPreviousVideo')
185 }
186
187 /**
188 * Get video position currently played (starts from 1)
189 */
190 async getCurrentPosition () {
191 return this.sendMessage<void, number>('getCurrentPosition')
192 }
193
902aa3a0 194 private constructChannel () {
99941732
WL
195 this.channel = Channel.build({
196 window: this.embedElement.contentWindow,
197 origin: '*',
198 scope: this.scope || 'peertube'
199 })
200 this.eventRegistrar.bindToChannel(this.channel)
201 }
902aa3a0
C
202
203 private prepareToBeReady () {
204 let readyResolve: Function
205 let readyReject: Function
206
99941732
WL
207 this.readyPromise = new Promise<void>((res, rej) => {
208 readyResolve = res
209 readyReject = rej
210 })
902aa3a0 211
99941732
WL
212 this.channel.bind('ready', success => success ? readyResolve() : readyReject())
213 this.channel.call({
214 method: 'isReady',
215 success: isReady => isReady ? readyResolve() : null
216 })
217 }
218
902aa3a0 219 private sendMessage<TIn, TOut> (method: string, params?: TIn): Promise<TOut> {
99941732
WL
220 return new Promise<TOut>((resolve, reject) => {
221 this.channel.call({
222 method, params,
223 success: result => resolve(result),
224 error: error => reject(error)
225 })
226 })
227 }
228}
229
230// put it on the window as well as the export
03d641a0 231(window[ 'PeerTubePlayer' ] as any) = PeerTubePlayer