<!DOCTYPE html>
<html>
<head>
- <title>PeerTube</title>
-
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="robots" content="noindex">
+ <meta property="og:platform" content="PeerTube" />
- <link rel="icon" type="image/png" href="/client/assets/favicon.png" />
-
- <link rel="stylesheet" href="/client/assets/video-js/video-js.min.css">
- <link rel="stylesheet" href="/client/assets/video-js/videojs-dock.css">
+ <script type="text/javascript">
+ // Thanks: https://mathiasbynens.be/notes/globalthis
+ (function() {
+ if (typeof globalThis === 'object') return;
+ Object.prototype.__defineGetter__('__magic__', function() {
+ return this;
+ });
+ __magic__.globalThis = __magic__
+ delete Object.prototype.__magic__;
+ }());
+ </script>
- <script src="/client/assets/webtorrent/webtorrent.min.js"></script>
- <script src="/client/assets/video-js/video.min.js"></script>
- <script src="/client/assets/video-js/videojs-dock.min.js"></script>
- <style>
- video {
- width: 99%;
- }
+ <!-- /!\ The following comment is used by the server to prerender some tags /!\ -->
- /* fill the entire space */
- html, body {
- height: 100%;
- margin: 0;
- }
+ <!-- title tag -->
+ <!-- description tag -->
+ <!-- custom css tag -->
+ <!-- meta tags -->
+ <!-- server config -->
- .video-js {
- width: 100%;
- height: 100%;
- }
+ <!-- /!\ Do not remove it /!\ -->
- .vjs-poster {
- background-size: 100% auto;
- }
- </style>
+ <link rel="icon" type="image/png" href="/client/assets/images/favicon.png" />
</head>
- <body>
+ <body id="custom-css" class="standalone-video-embed">
- <video id="video-container" class="video-js vjs-default-skin vjs-big-play-centered">
- </video>
+ <div id="error-block">
+ <h1 id="error-title"></h1>
+ <div id="error-content"></div>
+ </div>
- <script>
- function loadVideoInfos (videoId, callback) {
- var xhttp = new XMLHttpRequest()
- xhttp.onreadystatechange = function () {
- if (this.readyState === 4 && this.status === 200) {
- var json = JSON.parse(this.responseText)
- return callback(json)
- }
- }
+ <div id="video-wrapper"></div>
- var url = window.location.origin + '/api/v1/videos/' + videoId
- xhttp.open('GET', url, true)
- xhttp.send()
- }
+ <div id="placeholder-preview"></div>
- function loadVideoTorrent (magnetUri) {
- console.log('Loading video ' + videoId)
- var client = new window.WebTorrent()
+ <script type="text/javascript">
+ // Can be called in embed.ts
+ window.displayIncompatibleBrowser = function () {
+ const text = 'The player is not compatible with your web browser. Please try latest Firefox version.'
- console.log('Adding magnet ' + magnetUri)
- client.add(magnetUri, function (torrent) {
- var file = torrent.files[0]
+ document.title = 'Sorry' + ' - ' + text
- file.renderTo('video', { autoplay: true })
- })
- }
+ const errorBlock = document.getElementById('error-block')
+ errorBlock.style.display = 'flex'
- var urlParts = window.location.href.split('/')
- var videoId = urlParts[urlParts.length - 1]
- var videoContainer = document.getElementById('video-container')
+ const errorTitle = document.getElementById('error-title')
+ errorTitle.innerHTML = 'Sorry'
- loadVideoInfos(videoId, function (videoInfos) {
- var magnetUri = videoInfos.magnetUri
- var thumbnailUrl = 'http://' + videoInfos.podUrl + videoInfos.thumbnailPath
- videoContainer.poster = thumbnailUrl
+ const errorText = document.getElementById('error-content')
+ errorText.innerHTML = text
- videojs('video-container', { controls: true, autoplay: false }, function () {
- var player = this
+ const videoWrapper = document.getElementById('video-wrapper')
+ if (videoWrapper) videoWrapper.style.display = 'none'
- player.dock({
- title: videoInfos.name
- })
+ const placeholderPreview = document.getElementById('placeholder-preview')
+ if (placeholderPreview) placeholderPreview.style.display = 'none'
+ }
- document.querySelector('.vjs-big-play-button').addEventListener('click', function () {
- loadVideoTorrent(magnetUri)
+ window.onerror = function (msg) {
+ if (typeof msg === 'string' && msg.toLowerCase().includes(' ice ')) {
+ console.warn(msg)
+ return
+ }
- player.play()
- }, false)
- })
- })
+ window.displayIncompatibleBrowser()
+ }
+
+ if (/MSIE|Trident/.test(window.navigator.userAgent) ) {
+ window.displayIncompatibleBrowser()
+ }
+ </script>
- </script>
</body>
</html>