3 PeerTube lets you embed videos and programmatically control their playback. This documentation covers how to interact with the PeerTube Embed API.
7 Any PeerTube embed URL (ie `https://my-instance.example.com/videos/embed/52a10666-3a18-4e73-93da-e8d3c12c305a`) can be viewed as an embedding playground which
8 allows you to test various aspects of PeerTube embeds. Simply replace `/embed` with `/test-embed` and visit the URL in a browser.
9 For instance, the playground URL for the above embed URL is `https://my-instance.example.com/videos/test-embed/52a10666-3a18-4e73-93da-e8d3c12c305a`.
13 Given an existing PeerTube embed `<iframe>` **with API enabled** (`https://my-instance.example.com/videos/embed/52a10666-3a18-4e73-93da-e8d3c12c305a?api=1`),
14 one can use the PeerTube Embed API to control it by first including the library. You can include it via Yarn with:
17 yarn add @peertube/embed-api
20 Now just use the `PeerTubePlayer` class exported by the module:
23 import { PeerTubePlayer } from '@peertube/embed-api'
28 Or use the minified build from NPM CDN in your HTML file:
31 <script src="https://unpkg.com/@peertube/embed-api/build/player.min.js"></script>
34 const PeerTubePlayer = window['PeerTubePlayer']
40 Then you can instantiate the player:
43 let player = new PeerTubePlayer(document.querySelector('iframe'))
44 await player.ready // wait for the player to be ready
46 // now you can use it!
54 ## `play() : Promise<void>`
56 Starts playback, or resumes playback if it is paused.
58 ## `pause() : Promise<void>`
62 ## `seek(positionInSeconds : number)`
64 Seek to the given position, as specified in seconds into the video.
66 ## `addEventListener(eventName : string, handler : Function)`
68 Add a listener for a specific event. See below for the available events.
70 ## `getResolutions() : Promise<PeerTubeResolution[]>`
72 Get the available resolutions. A `PeerTubeResolution` looks like:
83 `active` is true if the resolution is the currently selected resolution.
85 ## `setResolution(resolutionId : number): Promise<void>`
87 Change the current resolution. Pass `-1` for automatic resolution (when available).
88 Otherwise, `resolutionId` should be the ID of an object returned by `getResolutions()`
90 ## `getPlaybackRates() : Promise<number[]>`
92 Get the available playback rates, where `1` represents normal speed, `0.5` is half speed, `2` is double speed, etc.
94 ## `getPlaybackRates() : Promise<number>`
96 Get the current playback rate. See `getPlaybackRates()` for more information.
98 ## `setPlaybackRate(rate : number) : Promise<void>`
100 Set the current playback rate. The passed rate should be a value as returned by `getPlaybackRates()`.
102 ## `setVolume(factor : number) : Promise<void>`
104 Set the playback volume. Value should be between `0` and `1`.
106 ## `getVolume(): Promise<number>`
108 Get the playback volume. Returns a value between `0` and `1`.
112 You can subscribe to events by using `addEventListener()`. See above for details.
114 ## Event `playbackStatusUpdate`
116 Fired every half second to provide the current status of playback.
117 The parameter of the callback will resemble:
123 "duration": "171.37499",
124 "playbackState": "playing"
128 `duration` field and `ended` `playbackState` are available in PeerTube >= 2.2.
130 The `volume` field contains the volume from `0` (silent) to `1` (full volume).
131 The `playbackState` can be `unstarted`, `playing`, `paused` or `ended`. More states may be added later.
133 ## Event `playbackStatusChange`
135 Fired when playback transitions between states, such as `paused` and `playing`. More states may be added later.
137 ## Event `resolutionUpdate`
139 Fired when the available resolutions have changed, or when the currently selected resolution has changed. Listener should call `getResolutions()` to get the updated information.
141 ## Event `volumeChange`
143 Fired when the player volume changed.