PWA for jscadui (#109)

What is added: * icons of differents sizes (192 needed for apple and 512 for android) * jscadui.manifest, declaring the PWA * meta tags in index.html to enable manifest, apple touch icon and theme-color (needed for PWA)
hrgdavor · Jul 10, 2024 · 79b8cda · 79b8cda
1 parent 49991b6
commit 79b8cda
Show file tree

Hide file tree

Showing 8 changed files with 26 additions and 4 deletions.
diff --git a/apps/jscad-web/static/icon_128.png b/apps/jscad-web/static/icon_128.png
diff --git a/apps/jscad-web/static/icon_192.png b/apps/jscad-web/static/icon_192.png
diff --git a/apps/jscad-web/static/icon_256.png b/apps/jscad-web/static/icon_256.png
diff --git a/apps/jscad-web/static/icon_512.png b/apps/jscad-web/static/icon_512.png
diff --git a/apps/jscad-web/static/index.html b/apps/jscad-web/static/index.html
@@ -3,6 +3,9 @@
   <head>
     <meta charset="UTF-8">
     <link rel="icon" type="image/png" href="/favicon.png">
+    <meta name="theme-color" content="#fff">
+    <link rel="manifest" href="/jscadui.manifest">
+    <link rel="apple-touch-icon" href="/icon_192.png">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="description" content="JSCAD is an open source set of modular, browser and command line tools for creating parametric 2D and 3D CAD designs with JavaScript code.">
     <meta name="keywords" content="jscad, openjscad, javascript, typescript, cad, svg, stl, obj, csg, 3mf, 3d-design, 2d-design">

diff --git a/apps/jscad-web/static/jscadui.manifest b/apps/jscad-web/static/jscadui.manifest
@@ -0,0 +1,17 @@
+{
+  "name":"JSCADUI",
+  "display":"standalone",
+  "description":"Parametric CAD in JS",
+  "lang":"en",
+  "background_color":"#fff",
+  "theme_color":"#fff",
+  "start_url":"index.html",
+  "icons":[
+    {"src":"/favicon.png","sizes":"64x64","type":"image/png"},
+    {"src":"/icon_128.png","sizes":"128x128","type":"image/png"},
+    {"src":"/icon_192.png","sizes":"192x192","type":"image/png"},
+    {"src":"/icon_256.png","sizes":"256x256","type":"image/png","purpose":"maskable"},
+    {"src":"/icon_512.png","sizes":"512x512","type":"image/png","purpose":"maskable"}
+  ],
+  "scope":"/" 
+}
diff --git a/apps/jscad-web/tsconfig.json b/apps/jscad-web/tsconfig.json
@@ -3,7 +3,8 @@
     "allowJs": true,
     "skipLibCheck": true,
     "outDir": "build_dev",
-    "moduleResolution": "node16"
+    "moduleResolution": "node16",
+    "module": "node16"
   },
   "include":["src"],
   "exclude": ["node_modules", "build_dev", "build", "dist","build.js","jscad"]

diff --git a/packages/fs-serviceworker/fs-serviceworker.js b/packages/fs-serviceworker/fs-serviceworker.js
@@ -18,9 +18,10 @@ self.addEventListener('install', event => {
   self.skipWaiting()
 })
 
-/** Create a client wrapper, or return one from cahce. It is important to know
- * that cache can dissapear (likely due to browser suspending the worker when idle).
- * page calling init will createa a cached instance, but if dev tools in chrome
+
+/** Create a client wrapper, or return one from cache. It is important to know
+ * that cache can disappear (likely due to browser suspending the worker when idle).
+ * page calling init will create a cached instance, but if dev tools in chrome
  * are nto open, after about 10 seconds, looks like cache is gone (likely worker got suspended)
  *
  * @param {string} clientId