Replace Service Worker with mini coi

Author: Jean-Baptiste Doderlein

README.md

@@ -2,19 +2,46 @@
 WIP : A small but efficient, intuitive and responsive Python IDE right in your browser! Ships Micro Python, interpreter by your browser (so it works offline!), compiled with pyscript. 
 
 ## TODO
-- Write a good README
-- Test on real programm (=debug)
-- Change icon and name from BetterOCaml
-- Change XtermJS look to better match BetterEditor design
-- Make script to build from the sources the libs in the repo
-- Update PWA settings
-- Clean up JS to remove every useless functions
-
-## Use of Web Worker / Python Interpreter
-We now use Micro Python but we could use original python interpreter if the toplevel was in a web worker.
-To accept the toplevel in web worker, we would need these headers :
-```
-Cross-Origin-Opener-Policy: same-origin
-Cross-Origin-Embedder-Policy: require-corp
-```
-But this is not possible on github pages.
+### Write a good README
+Take exampel from BetterOCaml, with gifs, screenshot and usecases
+
+### Test on real programm (=debug)
+Make test on real world program = teaching material, see if the editor is capable
+
+### Change icon and name from BetterOCaml
+
+### Change XtermJS look to better match BetterEditor design
+
+Need to integrate termjs plugins (for autosizing) + see if we can integrate matplotlib inside
+
+### Make script to build from the sources the libs in the repo
+
+Track all libs used and write how to update each files
+
+### Update PWA + serviceWorker settings
+
+Need to make mini-coi work with existing service worker to cache all fiels needed to the editor
+
+### Clean up JS to remove every useless functions
+
+## BetterPython + BetterPythonLight ?
+
+The choice of interpreter is important.
+
+### MicroPython
+- lightweight
+- fast to load + to execute
+- no package = no matplotlib
+- work without worker if needed
+
+### Pyoide
+- real cpython implementation
+- can import package = can use matplotlib
+- heavy to load
+- package are heavy
+- need worker to work
+- import package is slow
+
+2 solutions : choose one of the interpreter or make 2 versions
+
+Need advice and feedbacks to decide

src/index.html

@@ -331,14 +331,15 @@ <h4>Graphics main window</h4>
         r.style.setProperty('--toplevel-font-size', (localStorage.getItem("betterocaml-text-toplevel") || "1.2em"));
 
         // Service Worker
+        /*
         if ('serviceWorker' in navigator) {
             try {
                 navigator.serviceWorker.register('serviceWorker.js');
                 console.log("Service Worker Registered");
             } catch (error) {
                 console.log("Service Worker Registration Failed");
             }
-        }
+        }*/
 
         // Init navbar size
         navbar_resize()

src/mini-coi.js

@@ -1,5 +1,14 @@
 /*! coi-serviceworker v0.1.7 - Guido Zuidhof and contributors, licensed under MIT */
 /*! mini-coi - Andrea Giammarchi and contributors, licensed under MIT */
+
+const staticAssets = [
+    // './',
+    './manifest.json',
+    './index.html',
+    './favicon.ico'
+];
+
+
 (({ document: d, navigator: { serviceWorker: s } }) => {
     if (d) {
       const { currentScript: c } = d;
@@ -9,10 +18,24 @@
       });
     }
     else {
-      addEventListener('install', () => skipWaiting());
+      addEventListener('install', async event => {
+        skipWaiting();
+        const cache = await caches.open('static-cache');
+        cache.addAll(staticAssets);
+        });
       addEventListener('activate', e => e.waitUntil(clients.claim()));
       addEventListener('fetch', e => {
+        const req = e.request;
+        const url = new URL(req.url);
         const { request: r } = e;
+        let cached_req;
+        /*
+        if(url.origin === location.url){
+            cached_req = cacheFirst(req);
+        } else {
+            cached_req = newtorkFirst(req);
+        }
+        */
         if (r.cache === 'only-if-cached' && r.mode !== 'same-origin') return;
         e.respondWith(fetch(r).then(r => {
           const { body, status, statusText } = r;
@@ -26,4 +49,21 @@
       });
     }
   })(self);
+
+async function cacheFirst(req){
+    const cachedResponse = caches.match(req);
+    return cachedResponse || fetch(req);
+}
+
+async function newtorkFirst(req){
+    const cache = await caches.open('dynamic-cache');
+
+    try {
+        const res = await fetch(req);
+        cache.put(req, res.clone());
+        return res;
+    } catch (error) {
+        return await cache.match(req);
+    }
+}