Kaynağa Gözat

Show warning if browser does not support TextDecoder

Danilo Bargen 6 yıl önce
ebeveyn
işleme
b1ad91f552
3 değiştirilmiş dosya ile 24 ekleme ve 5 silme
  1. 10 4
      index.html
  2. 13 1
      public/js/compat.js
  3. 1 0
      src/sass/sections/_noscript.scss

+ 10 - 4
index.html

@@ -59,7 +59,7 @@
 <body class="{{ ctrl.statusClass }}" ng-class="{expanded: ctrl.expandStatusBar}">
     <img src="img/bg.jpg?v=[[VERSION]]" aria-label="Background image: Blurred photo of a mountain" id="background-image" draggable="false">
 
-    <noscript class="compat">
+    <noscript class="compat compat-nojs">
         <img class="logo-compat" src="img/logo.svg?v=[[VERSION]]"/>
         <div>
             <h2>Error: JavaScript not supported</h2>
@@ -67,11 +67,17 @@
         </div>
     </noscript>
 
-    <div class="compat wasm" style="display: none;">
+    <div class="compat compat-js" style="display: none;">
         <img class="logo-compat" src="img/logo.svg?v=[[VERSION]]"/>
-        <div>
+        <div class="wasm" style="display: none;">
+            <h2>Error: Browser not supported</h2>
+            <p>You are using a browser without <strong>WebAssembly</strong> support. Please
+            upgrade to the latest version of a
+            <a href="https://threema.ch/faq/web_requirements">supported browser</a>.</p>
+        </div>
+        <div class="textdecoder" style="display: none;">
             <h2>Error: Browser not supported</h2>
-            <p>You are using a browser without WebAssembly support. Please
+            <p>You are using a browser without <strong>TextDecoder</strong> support. Please
             upgrade to the latest version of a
             <a href="https://threema.ch/faq/web_requirements">supported browser</a>.</p>
         </div>

+ 13 - 1
public/js/compat.js

@@ -1,7 +1,19 @@
+// WebAssembly
 if (typeof WebAssembly === "object" && typeof WebAssembly.instantiate === "function") {
     console.debug('Compat: WebAssembly is supported');
 } else {
     console.error('Compat: WebAssembly is NOT supported');
     // Show warning
-    document.querySelector('.compat.wasm').style = 'inherit';
+    document.querySelector('.compat.compat-js').style.display = 'inherit';
+    document.querySelector('.compat.compat-js .wasm').style.display = 'inherit';
+}
+
+// TextDecoder
+if (typeof TextDecoder !== "undefined") {
+    console.debug('Compat: TextDecoder is supported');
+} else {
+    console.error('Compat: TextDecoder is NOT supported');
+    // Show warning
+    document.querySelector('.compat.compat-js').style.display = 'inherit';
+    document.querySelector('.compat.compat-js .textdecoder').style.display = 'inherit';
 }

+ 1 - 0
src/sass/sections/_noscript.scss

@@ -14,6 +14,7 @@
         margin: 16px auto;
         min-width: 100px;
         max-width: 300px;
+        max-height: 80px;
         text-align: center;
     }