1 import './test-embed.scss'
2 import { PeerTubePlayer } from '../player/player'
3 import { PlayerEventType } from '../player/definitions'
5 window.addEventListener('load', async () => {
6 const urlParts = window.location.href.split('/')
7 const lastPart = urlParts[ urlParts.length - 1 ]
8 const videoId = lastPart.indexOf('?') === -1 ? lastPart : lastPart.split('?')[ 0 ]
10 let iframe = document.createElement('iframe')
11 iframe.src = `/videos/embed/${videoId}?autoplay=1&controls=0&api=1`
12 let mainElement = document.querySelector('#host')
13 mainElement.appendChild(iframe)
15 console.log(`Document finished loading.`)
16 let player = new PeerTubePlayer(document.querySelector('iframe'))
18 window[ 'player' ] = player
20 console.log(`Awaiting player ready...`)
22 console.log(`Player is ready.`)
24 let monitoredEvents = [
27 'playbackStatusUpdate',
28 'playbackStatusChange'
31 monitoredEvents.forEach(e => {
32 player.addEventListener(e as PlayerEventType, () => console.log(`PLAYER: event '${e}' received`))
33 console.log(`PLAYER: now listening for event '${e}'`)
36 let playbackRates: number[] = []
37 let currentRate = await player.getPlaybackRate()
39 let updateRates = async () => {
40 let rateListEl = document.querySelector('#rate-list')
41 rateListEl.innerHTML = ''
43 playbackRates.forEach(rate => {
44 if (currentRate === rate) {
45 let itemEl = document.createElement('strong')
46 itemEl.innerText = `${rate} (active)`
47 itemEl.style.display = 'block'
48 rateListEl.appendChild(itemEl)
50 let itemEl = document.createElement('a')
51 itemEl.href = 'javascript:;'
52 itemEl.innerText = rate.toString()
53 itemEl.addEventListener('click', () => {
54 player.setPlaybackRate(rate)
58 itemEl.style.display = 'block'
59 rateListEl.appendChild(itemEl)
64 player.getPlaybackRates().then(rates => {
69 let updateResolutions = resolutions => {
70 let resolutionListEl = document.querySelector('#resolution-list')
71 resolutionListEl.innerHTML = ''
73 resolutions.forEach(resolution => {
74 if (resolution.active) {
75 let itemEl = document.createElement('strong')
76 itemEl.innerText = `${resolution.label} (active)`
77 itemEl.style.display = 'block'
78 resolutionListEl.appendChild(itemEl)
80 let itemEl = document.createElement('a')
81 itemEl.href = 'javascript:;'
82 itemEl.innerText = resolution.label
83 itemEl.addEventListener('click', () => {
84 player.setResolution(resolution.id)
86 itemEl.style.display = 'block'
87 resolutionListEl.appendChild(itemEl)
92 player.getResolutions().then(
93 resolutions => updateResolutions(resolutions))
94 player.addEventListener('resolutionUpdate',
95 resolutions => updateResolutions(resolutions))