Display a message in embed on unsupported web browser

2 files changed, 33 insertions, 7 deletions

diff --git a/client/src/standalone/videos/embed.html b/client/src/standalone/videos/embed.html
index 3455b4aa4..8ec03d199 100644
--- a/client/src/standalone/videos/embed.html
+++ b/client/src/standalone/videos/embed.html
@@ -44,5 +44,31 @@
 
     <div id="placeholder-preview"></div>
 
+    <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.'
+
+        document.title = 'Sorry' + ' - ' + text
+
+        const errorBlock = document.getElementById('error-block')
+        errorBlock.style.display = 'flex'
+
+        const errorTitle = document.getElementById('error-title')
+        errorTitle.innerHTML = 'Sorry'
+
+        const errorText = document.getElementById('error-content')
+        errorText.innerHTML = text
+      }
+
+      window.onerror = function () {
+        window.displayIncompatibleBrowser()
+      }
+
+      if (/MSIE|Trident/.test(window.navigator.userAgent) ) {
+        window.displayIncompatibleBrowser()
+      }
+    </script>
+
   </body>
 </html>
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index 36480922e..a6f0b2ed9 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -258,12 +258,8 @@ export class PeerTubeEmbed {
   }
 
   async init () {
-    try {
-      this.userTokens = Tokens.load()
-      await this.initCore()
-    } catch (e) {
-      console.error(e)
-    }
+    this.userTokens = Tokens.load()
+    await this.initCore()
   }
 
   private initializeApi () {
@@ -791,4 +787,8 @@ export class PeerTubeEmbed {
 }
 
 PeerTubeEmbed.main()
-  .catch(err => console.error('Cannot init embed.', err))
+  .catch(err => {
+    (window as any).displayIncompatibleBrowser()
+
+    console.error('Cannot init embed.', err)
+  })