What is this install gadget ?
Quick overview
Gadget installer replace appcache by using serviceworker and jIO to deliver pages.
It's composed by an installer gadget and a presentation gadget for the installer.
If you want an exemple, use this branch https://lab.nexedi.com/vincentB/erp5/commits/officejs_code_editor.
Install business template "erp5_officejs" and use web site "code_editor".
Working process
- Installer gadget put all pages defined by a version in a local storage (indexeddb) via jio repair, during that install time the presentation gadget provide a waiting page.
- It install a serviceworker wich continue to download page from a cache manifest you have give him in parameters.
- The service worker get page from local storage, ( if present else fetch from web ) and deliver to the site.
How add this to your web site ?
Pre-configuration
- Have a version defined for your web page and only your web page
- These pages must not have maccro inside.
- If you can't defined a version for some page, put them in a cache manifest ( this manifest must have the version ).
- All your pages must have an unique url_string defined, this will be the id of your local storage.
- Your landing page must have "/" as url_string.
Configuration
You juste have to put your configuration in the html, here an exemple of gadget installer :
<!DOCTYPE html>
<html manifest="gadget_officejs_code_editor_install.appcache">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="gadget_erp5_nojqm.css">
<title> OfficeJS Install </title>
<script src="rsvp.js"></script>
<script src="renderjs.js"></script>
<script src="jiodev.js"></script>
<script src="gadget_officejs_install.js"></script>
</head>
<body>
<script data-install-configuration="document_version" type="text/x-renderjs-configuration">codeeditor</script>
<script data-install-configuration="version_url" type="text/x-renderjs-configuration">code_editor/</script>
<script data-install-configuration="redirect_url" type="text/x-renderjs-configuration">code_editor/</script>
<script data-install-configuration="cache_file" type="text/x-renderjs-configuration">gadget_officejs.appcache</script>
<script data-install-configuration="app_name" type="text/x-renderjs-configuration">Code Editor</script>
<script data-install-configuration="sub_app_installer" type="text/x-renderjs-configuration">../officejs_gadget_codemirror/</script>
</body>
</html>
Parameters :
- document_version: version of your pages
- version_url: version of your site, and this will be the serviceworker scope.
- redirect_url: url of site with no serviceworker use.
- cache_file: reference of your cache manifest.
- app_name: name of your application.
- sub_app_installer: url of all installer of application you use inside your main application.
Install
- Create your install gadget with the right parameter.
- Put it on the root of your site.
- Let's try your web site !