3 import * as videojs from 'video.js'
5 import { VideoDetails } from '../../../../shared'
6 import { getVideojsOptions } from '../../assets/player/peertube-player'
8 function getVideoUrl (id: string) {
9 return window.location.origin + '/api/v1/videos/' + id
12 function loadVideoInfo (videoId: string): Promise<Response> {
13 return fetch(getVideoUrl(videoId))
16 function removeElement (element: HTMLElement) {
17 element.parentElement.removeChild(element)
20 function displayError (videoElement: HTMLVideoElement, text: string) {
21 // Remove video element
22 removeElement(videoElement)
24 document.title = 'Sorry - ' + text
26 const errorBlock = document.getElementById('error-block')
27 errorBlock.style.display = 'flex'
29 const errorText = document.getElementById('error-content')
30 errorText.innerHTML = text
33 function videoNotFound (videoElement: HTMLVideoElement) {
34 const text = 'This video does not exist.'
35 displayError(videoElement, text)
38 function videoFetchError (videoElement: HTMLVideoElement) {
39 const text = 'We cannot fetch the video. Please try again later.'
40 displayError(videoElement, text)
43 const urlParts = window.location.href.split('/')
44 const videoId = urlParts[urlParts.length - 1]
46 loadVideoInfo(videoId)
47 .then(async response => {
48 const videoContainerId = 'video-container'
49 const videoElement = document.getElementById(videoContainerId) as HTMLVideoElement
52 if (response.status === 404) return videoNotFound(videoElement)
54 return videoFetchError(videoElement)
57 const videoInfo: VideoDetails = await response.json()
63 let params = new URL(window.location.toString()).searchParams
64 autoplay = params.has('autoplay') && (params.get('autoplay') === '1' || params.get('autoplay') === 'true')
66 const startTimeParamString = params.get('start')
67 const startTimeParamNumber = parseInt(startTimeParamString, 10)
68 if (isNaN(startTimeParamNumber) === false) startTime = startTimeParamNumber
70 console.error('Cannot get params from URL.', err)
73 const videojsOptions = getVideojsOptions({
75 inactivityTimeout: 1500,
76 videoViewUrl: getVideoUrl(videoId) + '/views',
77 playerElement: videoElement,
78 videoFiles: videoInfo.files,
79 videoDuration: videoInfo.duration,
82 poster: window.location.origin + videoInfo.previewPath,
85 videojs(videoContainerId, videojsOptions, function () {
89 title: videoInfo.name,
90 description: 'Uses P2P, others may know you are watching this video.'
94 .catch(err => console.error(err))