Force autoplay when live starts

[github/Chocobozzz/PeerTube.git] / client / src / assets / player / shared / peertube / peertube-plugin.ts

diff --git a/client/src/assets/player/shared/peertube/peertube-plugin.ts b/client/src/assets/player/shared/peertube/peertube-plugin.ts
index 83c32415e833f4c8bd1b8bd6c5422badb395b6c5..ec8fbb320b448b90e0e55cb5f4dcba47e8702ae3 100644 (file)
--- a/client/src/assets/player/shared/peertube/peertube-plugin.ts
+++ b/client/src/assets/player/shared/peertube/peertube-plugin.ts
@@ -22,7 +22,7 @@ const Plugin = videojs.getPlugin('plugin')
 
 class PeerTubePlugin extends Plugin {
   private readonly videoViewUrl: string
-  private readonly authorizationHeader: string
+  private readonly authorizationHeader: () => string
 
   private readonly videoUUID: string
   private readonly startTime: number
@@ -52,7 +52,7 @@ class PeerTubePlugin extends Plugin {
     this.videoCaptions = options.videoCaptions
     this.initialInactivityTimeout = this.player.options_.inactivityTimeout
 
-    if (options.autoplay) this.player.addClass('vjs-has-autoplay')
+    if (options.autoplay !== false) this.player.addClass('vjs-has-autoplay')
 
     this.player.on('autoplay-failure', () => {
       this.player.removeClass('vjs-has-autoplay')
@@ -125,6 +125,32 @@ class PeerTubePlugin extends Plugin {
   }
 
   displayFatalError () {
+    this.player.loadingSpinner.hide()
+
+    const buildModal = (error: MediaError) => {
+      const localize = this.player.localize.bind(this.player)
+
+      const wrapper = document.createElement('div')
+      const header = document.createElement('h1')
+      header.innerText = localize('Failed to play video')
+      wrapper.appendChild(header)
+      const desc = document.createElement('div')
+      desc.innerText = localize('The video failed to play due to technical issues.')
+      wrapper.appendChild(desc)
+      const details = document.createElement('p')
+      details.classList.add('error-details')
+      details.innerText = error.message
+      wrapper.appendChild(details)
+
+      return wrapper
+    }
+
+    const modal = this.player.createModal(buildModal(this.player.error()), {
+      temporary: false,
+      uncloseable: true
+    })
+    modal.addClass('vjs-custom-error-display')
+
     this.player.addClass('vjs-error-display-enabled')
   }
 
@@ -184,7 +210,7 @@ class PeerTubePlugin extends Plugin {
       lastViewEvent = undefined
 
       // Server won't save history, so save the video position in local storage
-      if (!this.authorizationHeader) {
+      if (!this.authorizationHeader()) {
         saveVideoWatchHistory(this.videoUUID, currentTime)
       }
     }, this.CONSTANTS.USER_VIEW_VIDEO_INTERVAL)
@@ -202,7 +228,7 @@ class PeerTubePlugin extends Plugin {
       'Content-type': 'application/json; charset=UTF-8'
     })
 
-    if (this.authorizationHeader) headers.set('Authorization', this.authorizationHeader)
+    if (this.authorizationHeader()) headers.set('Authorization', this.authorizationHeader())
 
     return fetch(this.videoViewUrl, { method: 'POST', body: JSON.stringify(body), headers })
   }