software/theia: Make the application installable

Add a webmanifest and a service worker to support "Add to home screen"


![image](/uploads/0ce9c6abdbe27291dd7fc8210d823c40/image.png)


Application name in this screenshot is "Theia SlapOS theia" because I requested with instance name "theia".

See merge request !1323

component/theia/buildout.hash.cfg

@@ -15,7 +15,7 @@
 
 [preloadTemplate.html]
 _update_hash_filename_ = preloadTemplate.html
-md5sum = 8157c22134200bd862a07c6521ebf799
+md5sum = 6343592161a349bb40e0de16ce67aa51
 
 [yarn.lock]
 _update_hash_filename_ = yarn.lock

component/theia/preloadTemplate.html

 <script>
-let link = document.createElement('link');
-link.rel = "stylesheet";
-link.href = "/css/slapos.css";
-document.head.appendChild(link);
+  let link = document.createElement('link');
+  link.rel = "stylesheet";
+  link.href = "/css/slapos.css";
+  document.head.appendChild(link);
+
+  link = document.createElement('link');
+  link.rel = "manifest";
+  link.href = "/theia.webmanifest";
+  document.head.appendChild(link);
+
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.register('/theia-serviceworker.js').then(function (reg) {
+      console.log('Successfully registered service worker', reg);
+    }).catch(function (err) {
+      console.warn('Error whilst registering service worker', err);
+    });
+  }
 </script>
\ No newline at end of file

software/theia/buildout.hash.cfg

@@ -15,7 +15,7 @@
 
 [instance-theia]
 _update_hash_filename_ = instance-theia.cfg.jinja.in
-md5sum = 937f8ebdfa8112aafe11235a23fb85a9
+md5sum = ca0f353d00131851a992cd3519bec5b0
 
 [instance]
 _update_hash_filename_ = instance.cfg.in

software/theia/instance-theia.cfg.jinja.in

@@ -324,7 +324,9 @@ inline =
     bind $${:ip}:$${:port} ssl crt $${frontend-instance-certificate:cert-file} alpn h2,http/1.1
     # writing twice the same ACL is doing OR
     acl is_public path_beg /public/
-    acl is_public path /$${favicon.ico:filename}
+    acl is_public path /$${frontend-instance-favicon.ico:filename}
+    acl is_public path /$${frontend-instance-theia.webmanifest:filename}
+    acl is_public path /$${frontend-instance-theia-serviceworker.js:filename}
     acl auth_ok http_auth(basic-auth-list)
     # No authentication for public folder
     http-request auth unless auth_ok || is_public
@@ -386,7 +388,42 @@ folder-name = css
 context =
   key logo_image frontend-instance-logo:filename
 
-[favicon.ico]
+[frontend-instance-theia.webmanifest]
+recipe = slapos.recipe.build
+short-name = {{ root_title }}
+name = Theia SlapOS $${:short-name}
+background-color = #3c3c3c
+install =
+  import json
+  with open(options['location'], 'w') as f:
+    json.dump({
+      "name": options["name"],
+      "short_name": options["short-name"],
+      "icons": [
+        {
+          "src": "/" + self.buildout["frontend-instance-favicon.ico"]["filename"],
+          "sizes": "256x256",
+          "type": "image/png"
+        },
+      ],
+      "start_url": "/",
+      "display": "fullscreen",
+      "background_color": options["background-color"]
+    }, f)
+
+location = $${directory:frontend-static}/$${:filename}
+filename = theia.webmanifest
+
+[frontend-instance-theia-serviceworker.js]
+recipe = slapos.recipe.template
+inline =
+  /* minimal service worker for A2HS */
+  self.addEventListener("fetch", function(event) { });
+
+output = $${directory:frontend-static}/$${:filename}
+filename = theia-serviceworker.js
+
+[frontend-instance-favicon.ico]
 # generate a pseudo random favicon, different for each instance name.
 recipe = slapos.recipe.build
 seed = {{ root_title }}
@@ -408,7 +445,7 @@ install =
     self.buildout['buildout']['offline'] = buildout_offline
 
 location = $${directory:frontend-static}/$${:filename}
-filename = $${:_buildout_section_name_}
+filename = favicon.ico
 
 # Local Python Server
 # -------------------