feat(web): add browser check

NateScarlet · Mar 20, 2022 · 2333f36 · 2333f36
1 parent f88ba95
commit 2333f36
Show file tree

Hide file tree

Showing 10 changed files with 2,129 additions and 56 deletions.
diff --git a/..._derby/web/dist/assets/index.53f6ea70.css → ..._derby/web/dist/assets/index.8d55c26d.css b/..._derby/web/dist/assets/index.53f6ea70.css → ..._derby/web/dist/assets/index.8d55c26d.css
diff --git a/auto_derby/web/dist/index.html b/auto_derby/web/dist/index.html
@@ -1,19 +1,24 @@
-<!DOCTYPE html>
-<html lang="en" id="h">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" href="/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<!DOCTYPE html><html lang="en" id="h"><head>
+    <meta charset="UTF-8">
+    <link rel="icon" href="/favicon.ico">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>auto-derby</title>
     <script id="data" type="application/json">
       <!-- inject data here -->
     </script>
-    <script type="module" crossorigin src="/assets/index.ac25b9a9.js"></script>
+    <script type="module" crossorigin="" src="/assets/index.ac25b9a9.js"></script>
     <link rel="modulepreload" href="/assets/vendor.1a7cc180.js">
-    <link rel="stylesheet" href="/assets/index.53f6ea70.css">
+    <link rel="stylesheet" href="/assets/index.8d55c26d.css">
   </head>
   <body>
-    <div id="app"></div>
+    <noscript>
+      <strong>
+        JavaScript is disabled on this page.
+        Please enable it to continue.
+      </strong>
+    </noscript>
+    <div id="app"></div><script>"use strict";function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},_typeof(obj)}(function(){"use strict";var i="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z",a="<div\n  style=\"\n    position: absolute;\n    display: flex;\n    flex-direction: column;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    justify-content: center;\n    align-items: center;\n  \"\n>\n  <section style=\"max-width: 100%\">\n    <h1 style=\"font-size: 24px; font-weight: bold\">\n      <p>Please use a newer browser</p>\n      <p>\u8BF7\u4F7F\u7528\u66F4\u65B0\u7684\u6D4F\u89C8\u5668</p>\n    </h1>\n    <p>\n      All versions of IE is not supported, chrome or firefox is recommended.\n    </p>\n    <p>\u4E0D\u652F\u6301\u6240\u6709\u7248\u672C\u7684 IE\uFF0C\u63A8\u8350\u4F7F\u7528\u8C37\u6B4C\u6216\u8005\u706B\u72D0\u6D4F\u89C8\u5668\u3002</p>\n    <p>\n      If you see this message in recent browsers, please ensure not using IE\n      compatibility mode of your browser.\n    </p>\n    <p>\u5982\u679C\u8F83\u65B0\u7684\u6D4F\u89C8\u5668\u770B\u5230\u6B64\u4FE1\u606F\uFF0C\u8BF7\u786E\u4FDD\u672A\u542F\u7528\u60A8\u6D4F\u89C8\u5668\u7684 IE \u517C\u5BB9\u6A21\u5F0F\u3002</p>\n    <p>\n      <span>If the error still cannot be resolved.</span\n      ><a\n        style=\"margin: 0px 12px; color: rgb(96, 165, 250)\"\n        href=\"https://github.com/NateScarlet/auto-derby/issues/new\"\n        class=\"new-issue-link\"\n        >Click here to report</a\n      >\n    </p>\n    <p>\n      <span>\u5982\u679C\u9519\u8BEF\u4F9D\u65E7\u65E0\u6CD5\u89E3\u51B3\u3002</span\n      ><a\n        style=\"margin: 0px 12px; color: rgb(96, 165, 250)\"\n        href=\"https://github.com/NateScarlet/auto-derby/issues/new\"\n        class=\"new-issue-link\"\n        >\u8BF7\u70B9\u6B64\u6C47\u62A5</a\n      >\n    </p>\n    <pre id=\"error\"></pre>\n  </section>\n</div>\n",p="<div\n  style=\"\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    flex-direction: column;\n  \"\n>\n  <style>\n    @keyframes spin {\n      from {\n        transform: rotate(0deg);\n      }\n      to {\n        transform: rotate(360deg);\n      }\n    }\n  </style>\n  <svg\n    style=\"display: block; fill: currentColor; height: 4rem; color: #718096\"\n    viewBox=\"0 0 24 24\"\n  >\n    <path\n      style=\"\n        display: inline-block;\n        transform-origin: center;\n        animation: spin 1s linear infinite;\n      \"\n      id=\"loading-icon-svg-path\"\n      d=\"M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z\"\n    ></path>\n  </svg>\n  <p style=\"font-size: 1.25rem; font-weight: 700\">Loading...</p>\n</div>\n";function l(e){try{if(Object.entries===void 0)throw new Error("Object.entries is not supported");if(Array.prototype.flatMap===void 0)throw new Error("Array.prototype.flatMap is not supported");if((typeof CSS==="undefined"?"undefined":_typeof(CSS))>"u"||CSS.supports===void 0)throw new Error("CSS.supports is not supported");if(!CSS.supports("display","grid"))throw new Error("grid layout is not supported");e===null||e===void 0?void 0:e()}catch(n){var _n$stack;var t=document.getElementById("app");if(!t)throw new Error("missing app element");t.id="browser-check-message",t.innerHTML=a;var r=document.getElementById("error");r&&(r.innerText=String(n));var d=n instanceof Error?(_n$stack=n.stack)!==null&&_n$stack!==void 0?_n$stack:n.message:String(n),u="https://github.com/NateScarlet/auto-derby/issues/new?title=".concat(encodeURIComponent("[web] ".concat(n instanceof Error?n.message:String(n).slice(0,80))),"&body=").concat(encodeURIComponent("## Version\n\nv1.16.0-3-g75c2204\n\n## URL\n\n".concat(document.location.href,"\n\n## User Agent\n\n").concat(navigator.userAgent,"\n\n## Error\n\n```\n").concat(d,"\n```\n")),"&labels=bug"),s=document.querySelectorAll("a.new-issue-link");for(var o=0;o<s.length;o+=1){var g=s.item(o);g.href=u}throw n}}function c(){var _document$getElementB;var e=document.createElement("div");(_document$getElementB=document.getElementById("app"))!==null&&_document$getElementB!==void 0&&_document$getElementB.append(e),e.innerHTML=p;var n=document.getElementById("loading-icon-svg-path");n&&n.setAttribute("d",i)}l(function(){c()})})();</script>
 
-  </body>
-</html>
+
+
+</body></html>
diff --git a/auto_derby/web/index.html b/auto_derby/web/index.html
@@ -10,6 +10,12 @@
     </script>
   </head>
   <body>
+    <noscript>
+      <strong>
+        JavaScript is disabled on this page.
+        Please enable it to continue.
+      </strong>
+    </noscript>
     <div id="app"></div>
     <script type="module" src="/src/main.ts"></script>
   </body>

diff --git a/auto_derby/web/package.json b/auto_derby/web/package.json
@@ -9,22 +9,28 @@
     "lint": "eslint . --ext js,ts,vue"
   },
   "dependencies": {
-    "vue": "^3.2.25",
-    "@mdi/js": "^6.5.95"
+    "@mdi/js": "^6.5.95",
+    "vue": "^3.2.25"
   },
   "devDependencies": {
+    "@babel/core": "^7.17.8",
+    "@babel/preset-env": "^7.16.11",
     "@tailwindcss/forms": "^0.5.0",
+    "@types/babel__core": "^7.1.18",
     "@types/node": "14",
     "@typescript-eslint/eslint-plugin": "5.13.0",
     "@typescript-eslint/parser": "5.13.0",
     "@vitejs/plugin-vue": "^2.2.0",
+    "autoprefixer": "^10.4.4",
+    "cheerio": "^1.0.0-rc.10",
     "eslint": "^8.10.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-prettier": "^8.4.0",
     "eslint-import-resolver-typescript": "^2.5.0",
     "eslint-plugin-import": "2.25.4",
     "eslint-plugin-prettier": "4.0.0",
     "eslint-plugin-vue": "8.0.3",
+    "postcss": "^8.4.12",
     "prettier": "2.4.1",
     "sass": "^1.49.9",
     "tailwindcss": "^3.0.23",