1 import * as Channel from 'jschannel'
2 import { EventRegistrar } from './events'
3 import { EventHandler, PlayerEventType, PeerTubeResolution } from './definitions'
5 const PASSTHROUGH_EVENTS = [
8 'playbackStatusUpdate',
9 'playbackStatusChange',
15 * Allows for programmatic control of a PeerTube embed running in an <iframe>
18 export class PeerTubePlayer {
20 private eventRegistrar: EventRegistrar = new EventRegistrar()
21 private channel: Channel.MessagingChannel
22 private readyPromise: Promise<void>
25 * Construct a new PeerTubePlayer for the given PeerTube embed iframe.
26 * Optionally provide a `scope` to ensure that messages are not crossed
27 * between multiple PeerTube embeds. The string passed here must match the
28 * `scope=` query parameter on the embed URL.
34 private embedElement: HTMLIFrameElement,
35 private scope?: string
37 this.eventRegistrar.registerTypes(PASSTHROUGH_EVENTS)
39 this.constructChannel()
40 this.prepareToBeReady()
44 * Destroy the player object and remove the associated player from the DOM.
47 this.embedElement.remove()
51 * Listen to an event emitted by this player.
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)
56 addEventListener (event: PlayerEventType, handler: EventHandler<any>): boolean {
57 return this.eventRegistrar.addListener(event, handler)
61 * Remove an event listener previously added with addEventListener().
63 * @param event The name of the event previously listened to
66 removeEventListener (event: PlayerEventType, handler: EventHandler<any>): boolean {
67 return this.eventRegistrar.removeListener(event, handler)
71 * Promise resolves when the player is ready.
73 get ready (): Promise<void> {
74 return this.readyPromise
78 * Tell the embed to start/resume playback
81 await this.sendMessage('play')
85 * Tell the embed to pause playback.
88 await this.sendMessage('pause')
92 * Tell the embed to change the audio volume
93 * @param value A number from 0 to 1
95 async setVolume (value: number) {
96 await this.sendMessage('setVolume', value)
100 * Get the current volume level in the embed.
101 * @param value A number from 0 to 1
103 async getVolume (): Promise<number> {
104 return this.sendMessage<void, number>('getVolume')
108 * Tell the embed to seek to a specific position (in seconds)
111 async seek (seconds: number) {
112 await this.sendMessage('seek', seconds)
116 * Tell the embed to switch resolutions to the resolution identified
119 * @param resolutionId The ID of the resolution as found with getResolutions()
121 async setResolution (resolutionId: any) {
122 await this.sendMessage('setResolution', resolutionId)
126 * Retrieve a list of the available resolutions. This may change later, listen to the
127 * `resolutionUpdate` event with `addEventListener` in order to be updated as the available
128 * resolutions change.
130 async getResolutions (): Promise<PeerTubeResolution[]> {
131 return this.sendMessage<void, PeerTubeResolution[]>('getResolutions')
135 * Retrieve a list of available playback rates.
137 async getPlaybackRates (): Promise<number[]> {
138 return this.sendMessage<void, number[]>('getPlaybackRates')
142 * Get the current playback rate. Defaults to 1 (1x playback rate).
144 async getPlaybackRate (): Promise<number> {
145 return this.sendMessage<void, number>('getPlaybackRate')
149 * Set the playback rate. Should be one of the options returned by getPlaybackRates().
150 * Passing 0.5 means half speed, 1 means normal, 2 means 2x speed, etc.
154 async setPlaybackRate (rate: number) {
155 await this.sendMessage('setPlaybackRate', rate)
158 private constructChannel () {
159 this.channel = Channel.build({
160 window: this.embedElement.contentWindow,
162 scope: this.scope || 'peertube'
164 this.eventRegistrar.bindToChannel(this.channel)
167 private prepareToBeReady () {
168 let readyResolve: Function
169 let readyReject: Function
171 this.readyPromise = new Promise<void>((res, rej) => {
176 this.channel.bind('ready', success => success ? readyResolve() : readyReject())
179 success: isReady => isReady ? readyResolve() : null
183 private sendMessage<TIn, TOut> (method: string, params?: TIn): Promise<TOut> {
184 return new Promise<TOut>((resolve, reject) => {
187 success: result => resolve(result),
188 error: error => reject(error)
194 // put it on the window as well as the export
195 (window[ 'PeerTubePlayer' ] as any) = PeerTubePlayer