Merge pull request #931 from Eastern-Research-Group/bugfix/663_fixed-…

…unsupported-slow-network Bugfix/663 fixed unsupported slow network
Eastern-Research-Group · Jan 17, 2024 · 5f91ad8 · 5f91ad8
2 parents c45f5e9 + 6ded43e
commit 5f91ad8
Show file tree

Hide file tree

Showing 2 changed files with 129 additions and 104 deletions.
diff --git a/app/client/public/index.html b/app/client/public/index.html
@@ -255,6 +255,7 @@
         position: sticky;
         top: 0;
         z-index: 900;
+        display: none;
       }
 
       .unsupportedErrorBox {
@@ -380,6 +381,130 @@
       });
     </script>
 
+    <script>
+      /**
+       * This script is used for displaying a "browser unsupported"
+       * message. This script polls for the unsupported-browser-message
+       * div, when available it then checks the browser version and
+       * displays the message if necessary.
+       */
+
+      function unsupportedBrowserMessage() {
+        const unsupportedMessage = document.getElementById(
+          'unsupported-browser-message',
+        );
+
+        if (unsupportedMessage) {
+          // If fetch is supported, hide the unsupported browser message until
+          // we can get the supported browsers lookup file.
+          if ('fetch' in window) {
+            unsupportedMessage.style.display = 'none';
+          }
+
+          // Parse the user agent string to determine which browser the user is using.
+          const { browserName, browserVersion } = (function () {
+            const ua = navigator.userAgent;
+
+            let item;
+            let M =
+              ua.match(
+                /(opera|chrome|safari|firefox|edg|msie|trident(?=\/))\/?\s*(\d+)/i,
+              ) || [];
+            if (/trident/i.test(M[1])) {
+              item = /\brv[ :]+(\d+)/g.exec(ua) || [];
+              return {
+                browserName: 'IE',
+                browserVersion: parseInt(item[1]) || 0,
+              };
+            }
+            if (M[1] === 'Chrome') {
+              item = ua.match(/\b(Edg)\/(\d+)/);
+              if (item != null) {
+                item = item.slice(1);
+                return {
+                  browserName: item[0].replace('Edg', 'Edge'),
+                  browserVersion: parseInt(item[1]) || 0,
+                };
+              }
+            }
+
+            M = M[2]
+              ? [M[1], M[2]]
+              : [navigator.appName, navigator.appVersion, '-?'];
+            if ((item = ua.match(/version\/(\d+)/i)) != null)
+              M.splice(1, 1, item[1]);
+
+            return {
+              browserName: M[0],
+              browserVersion: parseInt(M[1]) || 0,
+            };
+          })();
+
+          // fetch the supported browser list lookup file
+          const proxyUrl = `${origin}/proxy`;
+          const url = `${proxyUrl}?url=${origin}/data/config/supported-browsers.json`;
+          fetch(url)
+            .then((response) => {
+              if (response.status === 200) {
+                // parse the json
+                response.json().then((json) => {
+                  let browserSupported = false;
+
+                  // determine if the user's browser is supported
+                  if (
+                    browserName === 'Chrome' &&
+                    browserVersion >= json.chrome
+                  ) {
+                    browserSupported = true;
+                  }
+                  if (
+                    browserName === 'Firefox' &&
+                    browserVersion >= json.firefox
+                  ) {
+                    browserSupported = true;
+                  }
+                  if (
+                    browserName === 'Safari' &&
+                    browserVersion >= json.safari
+                  ) {
+                    browserSupported = true;
+                  }
+                  if (browserName === 'Edge' && browserVersion >= json.edge) {
+                    browserSupported = true;
+                  }
+
+                  // hide/show the unsupported browser message
+                  unsupportedMessage.style.display = browserSupported
+                    ? 'none'
+                    : 'block';
+                });
+              } else {
+                // show the unsupported browser message
+                unsupportedMessage.style.display = 'block';
+              }
+            })
+            .catch((err) => {
+              console.error(err);
+
+              // show the unsupported browser message
+              unsupportedMessage.style.display = 'block';
+            });
+        } else {
+          setTimeout(unsupportedBrowserMessage, 15);
+        }
+      }
+
+      // Allows the user to close the unsupported message.
+      function hideUnsupportedMessage() {
+        const unsupportedMessage = document.getElementById(
+          'unsupported-browser-message',
+        );
+        unsupportedMessage.style.display = 'none';
+      }
+
+      unsupportedBrowserMessage();
+    </script>
+
     <!-- Google Tag Manager -->
     <script>
       (function (w, d, s, l, i) {
@@ -1340,104 +1465,4 @@ <h2>Follow.</h2>
       }
     </style>
   </body>
-  <script>
-    /**
-     * This script is used for displaying a "browser unsupported"
-     * message. This script is placed after the body to ensure the
-     * div with the "unsupported-browser-message" id exists in the dom prior
-     * to this script running.
-     */
-
-    const unsupportedMessage = document.getElementById(
-      'unsupported-browser-message',
-    );
-
-    // Allows the user to close the unsupported message.
-    function hideUnsupportedMessage() {
-      unsupportedMessage.style.display = 'none';
-    }
-
-    // If fetch is supported, hide the unsupported browser message until
-    // we can get the supported browsers lookup file.
-    if ('fetch' in window) {
-      unsupportedMessage.style.display = 'none';
-    }
-
-    // Parse the user agent string to determine which browser the user is using.
-    const { browserName, browserVersion } = (function () {
-      const ua = navigator.userAgent;
-
-      let item;
-      let M =
-        ua.match(
-          /(opera|chrome|safari|firefox|edg|msie|trident(?=\/))\/?\s*(\d+)/i,
-        ) || [];
-      if (/trident/i.test(M[1])) {
-        item = /\brv[ :]+(\d+)/g.exec(ua) || [];
-        return {
-          browserName: 'IE',
-          browserVersion: parseInt(item[1]) || 0,
-        };
-      }
-      if (M[1] === 'Chrome') {
-        item = ua.match(/\b(Edg)\/(\d+)/);
-        if (item != null) {
-          item = item.slice(1);
-          return {
-            browserName: item[0].replace('Edg', 'Edge'),
-            browserVersion: parseInt(item[1]) || 0,
-          };
-        }
-      }
-
-      M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
-      if ((item = ua.match(/version\/(\d+)/i)) != null) M.splice(1, 1, item[1]);
-
-      return {
-        browserName: M[0],
-        browserVersion: parseInt(M[1]) || 0,
-      };
-    })();
-
-    // fetch the supported browser list lookup file
-    const proxyUrl = `${origin}/proxy`;
-    const url = `${proxyUrl}?url=${origin}/data/config/supported-browsers.json`;
-    fetch(url)
-      .then((response) => {
-        if (response.status === 200) {
-          // parse the json
-          response.json().then((json) => {
-            let browserSupported = false;
-
-            // determine if the user's browser is supported
-            if (browserName === 'Chrome' && browserVersion >= json.chrome) {
-              browserSupported = true;
-            }
-            if (browserName === 'Firefox' && browserVersion >= json.firefox) {
-              browserSupported = true;
-            }
-            if (browserName === 'Safari' && browserVersion >= json.safari) {
-              browserSupported = true;
-            }
-            if (browserName === 'Edge' && browserVersion >= json.edge) {
-              browserSupported = true;
-            }
-
-            // hide/show the unsupported browser message
-            unsupportedMessage.style.display = browserSupported
-              ? 'none'
-              : 'block';
-          });
-        } else {
-          // show the unsupported browser message
-          unsupportedMessage.style.display = 'block';
-        }
-      })
-      .catch((err) => {
-        console.error(err);
-
-        // show the unsupported browser message
-        unsupportedMessage.style.display = 'block';
-      });
-  </script>
 </html>
diff --git a/app/server/app/public/data/config/supported-browsers.json b/app/server/app/public/data/config/supported-browsers.json
@@ -1,6 +1,6 @@
 {
-    "chrome": 93,
-    "firefox": 93,
-    "safari": 14,
-    "edge": 93
+  "chrome": 115,
+  "firefox": 115,
+  "safari": 16,
+  "edge": 115
 }