Merge PR #1857 into 13.0

Signed-off-by pedrobaeza

web_pwa_oca/README.rst

@@ -31,6 +31,17 @@ Progressive Web Apps provide an installable, app-like experience on desktop and
 They're web apps that are fast and reliable. And most importantly, they're web apps that work in any browser.
 If you're building a web app today, you're already on the path towards building a Progressive Web App.
 
+
++ Developers Info.
+
+The service worker is contructed using 'Odoo Class' to have the same class inheritance behaviour that in the 'user pages'. Be noticed
+that 'Odoo Bootstrap' is not supported so, you can't use 'require' here.
+
+All service worker content can be found in 'static/src/js/worker'. The management between 'user pages' and service worker is done in
+'pwa_manager.js'.
+
+The purpose of this module is give a base to make PWA applications.
+
 **Table of contents**
 
 .. contents::
@@ -51,30 +62,77 @@ And like all other installed apps, it's a top level app in the task switcher.
 
 In Chrome, a Progressive Web App can either be installed through the three-dot context menu.
 
-This module also provides a "Install PWA" link in Odoo user menu.
+In case you previously installed `web_pwa`, run the following steps with `odoo shell`, after having installed `openupgradelib`:
+
+
+>>> from openupgradelib import openupgrade
+>>> openupgrade.update_module_names(env.cr, [('web_pwa', 'web_pwa_oca')], merge_modules=False)
+>>> env.cr.commit()
 
 Configuration
 =============
 
-The following system parameters con be set to customize the appearance of the application
+This module allows you to set the following parameters under settings to customize the appearance of the application
 
-* pwa.manifest.name (defaults to "Odoo PWA")
+* PWA Name (defaults to "Odoo PWA")
-* pwa.manifest.short_name (defaults to "Odoo PWA")
+* PWA Short Name (defaults to "Odoo PWA")
-* pwa.manifest.icon128x128 (defaults to "/web_pwa_oca/static/img/icons/icon-128x128.png")
+* PWA Icon (**SVG**) (defaults to "/web_pwa_oca/static/img/icons/odoo-logo.svg")
-* pwa.manifest.icon144x144 (defaults to "/web_pwa_oca/static/img/icons/icon-144x144.png")
+
-* pwa.manifest.icon152x152 (defaults to "/web_pwa_oca/static/img/icons/icon-152x152.png")
+To configure your PWA:
-* pwa.manifest.icon192x192 (defaults to "/web_pwa_oca/static/img/icons/icon-192x192.png")
+
-* pwa.manifest.icon256x256 (defaults to "/web_pwa_oca/static/img/icons/icon-256x256.png")
+#. Go to **Settings > General Settings > Progressive Web App**.
-* pwa.manifest.icon512x512 (defaults to "/web_pwa_oca/static/img/icons/icon-512x512.png")
+#. Set the parameters (*Note:* Icon **must be a SVG file**)
+#. **Save**
+
+Usage
+=====
+
+To use your PWA:
+
+#. Open the Odoo web app using a supported browser (See https://caniuse.com/?search=A2HS)
+#. Open the browser options
+#. Click on 'Add to Home screen' (or 'Install' in other browsers)
+
+** Maybe you need refresh the page to load the service worker after using the option.
 
 Known issues / Roadmap
 ======================
 
-* Evaluate to extend ``FILES_TO_CACHE``
-* Evaluate to use a normal JS file for service worker and download data from a normal JSON controller
 * Integrate `Notification API <https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification>`_
 * Integrate `Web Share API <https://web.dev/web-share/>`_
 * Create ``portal_pwa`` module, intended to be used by front-end users (customers, suppliers...)
+* Current *John Resig's inheritance* implementation doesn't support ``async``
+  functions because ``this._super`` can't be called inside a promise. So we
+  need to use the following workaround:
+
+  - Natural 'async/await' example (This breaks "_super" call):
+
+    .. code-block:: javascript
+
+        var MyClass = OdooClass.extend({
+            myFunc: async function() {
+                const mydata = await ...do await stuff...
+                return mydata;
+            }
+        });
+
+  - Same code with the workaround:
+
+    .. code-block:: javascript
+
+        var MyClass = OdooClass.extend({
+            myFunc: function() {
+                return new Promise(async (resolve, reject) => {
+                    const mydata = await ...do await stuff...
+                    return resolve(mydata);
+                });
+            }
+        });
+
+* Fix issue when trying to run in localhost with several databases. The browser
+  doesn't send the cookie and web manifest returns 404.
+* Firefox can't detect 'standalone' mode. See https://bugzilla.mozilla.org/show_bug.cgi?id=1285858
+* Firefox disable service worker in private mode. See https://bugzilla.mozilla.org/show_bug.cgi?id=1601916
 
 Bug Tracker
 ===========
@@ -93,6 +151,7 @@ Authors
 ~~~~~~~
 
 * TAKOBI
+* Tecnativa
 
 Contributors
 ~~~~~~~~~~~~
@@ -101,6 +160,11 @@ Contributors
 
   * Lorenzo Battistini
 
+* `Tecnativa <https://tecnativa.com>`_:
+
+  * Alexandre D. Díaz
+  * João Marques
+
 Maintainers
 ~~~~~~~~~~~
 

web_pwa_oca/__init__.py

@@ -1 +1,2 @@
 from . import controllers
+from . import models

web_pwa_oca/__manifest__.py

@@ -1,4 +1,6 @@
 # Copyright 2020 Lorenzo Battistini @ TAKOBI
+# Copyright 2020 Tecnativa - Alexandre D. Díaz
+# Copyright 2020 Tecnativa - João Marques
 # License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl).
 
 {
@@ -8,13 +10,12 @@
     "development_status": "Beta",
     "category": "Website",
     "website": "https://github.com/OCA/web",
-    "author": "TAKOBI, Odoo Community Association (OCA)",
+    "author": "TAKOBI, Tecnativa, Odoo Community Association (OCA)",
     "maintainers": ["eLBati"],
     "license": "LGPL-3",
     "application": True,
     "installable": True,
     "depends": ["web", "mail"],
-    "data": ["views/webclient_templates.xml"],
+    "data": ["templates/assets.xml", "views/res_config_settings_views.xml"],
-    "qweb": ["static/src/xml/pwa_install.xml"],
     "images": ["static/description/pwa.png"],
 }

web_pwa_oca/controllers/__init__.py

@@ -1 +1,4 @@
+# Copyright 2020 Lorenzo Battistini @ TAKOBI
+# License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl).
 from . import main
+from . import service_worker

web_pwa_oca/controllers/main.py

@@ -1,77 +1,119 @@
+# Copyright 2020 Lorenzo Battistini @ TAKOBI
+# Copyright 2020 Tecnativa - Alexandre D. Díaz
+# Copyright 2020 Tecnativa - João Marques
+# License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl).
+import json
+
 from odoo.http import Controller, request, route
 
 
 class PWA(Controller):
-    def get_asset_urls(self, asset_xml_id):
+    def _get_pwa_scripts(self):
-        qweb = request.env["ir.qweb"].sudo()
+        """Scripts to be imported in the service worker (Order is important)"""
-        assets = qweb._get_asset_nodes(asset_xml_id, {}, True, True)
+        return [
-        urls = []
+            "/web/static/lib/underscore/underscore.js",
-        for asset in assets:
+            "/web_pwa_oca/static/src/js/worker/jquery-sw-compat.js",
-            if asset[0] == "link":
+            "/web/static/src/js/promise_extension.js",
-                urls.append(asset[1]["href"])
+            "/web/static/src/js/boot.js",
-            if asset[0] == "script":
+            "/web/static/src/js/core/class.js",
-                urls.append(asset[1]["src"])
+            "/web_pwa_oca/static/src/js/worker/pwa.js",
-        return urls
+        ]
 
     @route("/service-worker.js", type="http", auth="public")
-    def service_worker(self):
+    def render_service_worker(self):
-        qweb = request.env["ir.qweb"].sudo()
+        """Route to register the service worker in the 'main' scope ('/')"""
-        urls = []
+        return request.render(
-        urls.extend(self.get_asset_urls("web.assets_common"))
-        urls.extend(self.get_asset_urls("web.assets_backend"))
-        version_list = []
-        for url in urls:
-            version_list.append(url.split("/")[3])
-        cache_version = "-".join(version_list)
-        mimetype = "text/javascript;charset=utf-8"
-        content = qweb.render(
             "web_pwa_oca.service_worker",
-            {"pwa_cache_name": cache_version, "pwa_files_to_cache": urls},
+            {
+                "pwa_scripts": self._get_pwa_scripts(),
+                "pwa_params": self._get_pwa_params(),
+            },
+            headers=[("Content-Type", "text/javascript;charset=utf-8")],
         )
-        return request.make_response(content, [("Content-Type", mimetype)])
 
-    @route("/web_pwa_oca/manifest.json", type="http", auth="public")
+    def _get_pwa_params(self):
-    def manifest(self):
+        """Get javascript PWA class initialzation params"""
-        qweb = request.env["ir.qweb"].sudo()
+        return {}
-        config_param = request.env["ir.config_parameter"].sudo()
+
-        pwa_name = config_param.get_param("pwa.manifest.name", "Odoo PWA")
+    def _get_pwa_manifest_icons(self, pwa_icon):
-        pwa_short_name = config_param.get_param("pwa.manifest.short_name", "Odoo PWA")
+        icons = []
-        icon128x128 = config_param.get_param(
+        if not pwa_icon:
-            "pwa.manifest.icon128x128", "/web_pwa_oca/static/img/icons/icon-128x128.png"
+            for size in [
+                (128, 128),
+                (144, 144),
+                (152, 152),
+                (192, 192),
+                (256, 256),
+                (512, 512),
+            ]:
+                icons.append(
+                    {
+                        "src": "/web_pwa_oca/static/img/icons/icon-%sx%s.png"
+                        % (str(size[0]), str(size[1])),
+                        "sizes": "{}x{}".format(str(size[0]), str(size[1])),
+                        "type": "image/png",
+                    }
                 )
-        icon144x144 = config_param.get_param(
+        elif not pwa_icon.mimetype.startswith("image/svg"):
-            "pwa.manifest.icon144x144", "/web_pwa_oca/static/img/icons/icon-144x144.png"
+            all_icons = (
+                request.env["ir.attachment"]
+                .sudo()
+                .search(
+                    [
+                        ("url", "like", "/web_pwa_oca/icon"),
+                        (
+                            "url",
+                            "not like",
+                            "/web_pwa_oca/icon.",
+                        ),  # Get only resized icons
+                    ]
                 )
-        icon152x152 = config_param.get_param(
-            "pwa.manifest.icon152x152", "/web_pwa_oca/static/img/icons/icon-152x152.png"
             )
-        icon192x192 = config_param.get_param(
+            for icon in all_icons:
-            "pwa.manifest.icon192x192", "/web_pwa_oca/static/img/icons/icon-192x192.png"
+                icon_size_name = icon.url.split("/")[-1].lstrip("icon").split(".")[0]
+                icons.append(
+                    {"src": icon.url, "sizes": icon_size_name, "type": icon.mimetype}
                 )
-        icon256x256 = config_param.get_param(
+        else:
-            "pwa.manifest.icon256x256", "/web_pwa_oca/static/img/icons/icon-256x256.png"
+            icons = [
+                {
+                    "src": pwa_icon.url,
+                    "sizes": "128x128 144x144 152x152 192x192 256x256 512x512",
+                    "type": pwa_icon.mimetype,
+                }
+            ]
+        return icons
+
+    def _get_pwa_manifest(self):
+        """Webapp manifest"""
+        config_param_sudo = request.env["ir.config_parameter"].sudo()
+        pwa_name = config_param_sudo.get_param("pwa.manifest.name", "Odoo PWA")
+        pwa_short_name = config_param_sudo.get_param(
+            "pwa.manifest.short_name", "Odoo PWA"
         )
-        icon512x512 = config_param.get_param(
+        pwa_icon = (
-            "pwa.manifest.icon512x512", "/web_pwa_oca/static/img/icons/icon-512x512.png"
+            request.env["ir.attachment"]
+            .sudo()
+            .search([("url", "like", "/web_pwa_oca/icon.")])
         )
-        background_color = config_param.get_param(
+        background_color = config_param_sudo.get_param(
             "pwa.manifest.background_color", "#2E69B5"
         )
-        theme_color = config_param.get_param("pwa.manifest.theme_color", "#2E69B5")
+        theme_color = config_param_sudo.get_param("pwa.manifest.theme_color", "#2E69B5")
-        mimetype = "application/json;charset=utf-8"
+        return {
-        content = qweb.render(
+            "name": pwa_name,
-            "web_pwa_oca.manifest",
+            "short_name": pwa_short_name,
-            {
+            "icons": self._get_pwa_manifest_icons(pwa_icon),
-                "pwa_name": pwa_name,
+            "start_url": "/web",
-                "pwa_short_name": pwa_short_name,
+            "display": "standalone",
-                "icon128x128": icon128x128,
-                "icon144x144": icon144x144,
-                "icon152x152": icon152x152,
-                "icon192x192": icon192x192,
-                "icon256x256": icon256x256,
-                "icon512x512": icon512x512,
             "background_color": background_color,
             "theme_color": theme_color,
-            },
+        }
+
+    @route("/web_pwa_oca/manifest.webmanifest", type="http", auth="public")
+    def pwa_manifest(self):
+        """Returns the manifest used to install the page as app"""
+        return request.make_response(
+            json.dumps(self._get_pwa_manifest()),
+            headers=[("Content-Type", "application/json;charset=utf-8")],
         )
-        return request.make_response(content, [("Content-Type", mimetype)])

web_pwa_oca/controllers/service_worker.py

@@ -0,0 +1,98 @@
+# Copyright 2021 Tecnativa - Alexandre D. Díaz
+# License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl).
+from odoo.http import request, route
+
+from .main import PWA
+
+
+class ServiceWorker(PWA):
+
+    JS_PWA_CORE_EVENT_INSTALL = """
+        self.addEventListener('install', evt => {{
+            console.log('[ServiceWorker] Installing...');
+            {}
+        }});
+    """
+
+    JS_PWA_CORE_EVENT_FETCH = """
+        self.addEventListener('fetch', evt => {{
+            {}
+        }});
+    """
+
+    JS_PWA_CORE_EVENT_ACTIVATE = """
+        self.addEventListener('activate', evt => {{
+            {}
+        }});
+    """
+
+    JS_PWA_MAIN = """
+        self.importScripts(...{pwa_scripts});
+
+        odoo.define("web_pwa_oca.ServiceWorker", function (require) {{
+            "use strict";
+
+            {pwa_requires}
+
+            {pwa_init}
+            {pwa_core_event_install}
+            {pwa_core_event_activate}
+            {pwa_core_event_fetch}
+        }});
+    """
+
+    def _get_js_pwa_requires(self):
+        return """
+            const PWA = require('web_pwa_oca.PWA');
+        """
+
+    def _get_js_pwa_init(self):
+        return """
+            const oca_pwa = new PWA({});
+        """.format(
+            self._get_pwa_params()
+        )
+
+    def _get_js_pwa_core_event_install_impl(self):
+        return """
+            evt.waitUntil(oca_pwa.installWorker());
+            self.skipWaiting();
+        """
+
+    def _get_js_pwa_core_event_activate_impl(self):
+        return """
+            console.log('[ServiceWorker] Activating...');
+            evt.waitUntil(oca_pwa.activateWorker());
+            self.clients.claim();
+        """
+
+    def _get_js_pwa_core_event_fetch_impl(self):
+        return ""
+
+    @route("/service-worker.js", type="http", auth="public")
+    def render_service_worker(self):
+        """Route to register the service worker in the 'main' scope ('/')"""
+
+        sw_code = self.JS_PWA_MAIN.format(
+            **{
+                "pwa_scripts": self._get_pwa_scripts(),
+                "pwa_requires": self._get_js_pwa_requires(),
+                "pwa_init": self._get_js_pwa_init(),
+                "pwa_core_event_install": self.JS_PWA_CORE_EVENT_INSTALL.format(
+                    self._get_js_pwa_core_event_install_impl()
+                ),
+                "pwa_core_event_activate": self.JS_PWA_CORE_EVENT_ACTIVATE.format(
+                    self._get_js_pwa_core_event_activate_impl()
+                ),
+                "pwa_core_event_fetch": self.JS_PWA_CORE_EVENT_FETCH.format(
+                    self._get_js_pwa_core_event_fetch_impl()
+                ),
+            }
+        )
+        return request.make_response(
+            sw_code,
+            [
+                ("Content-Type", "text/javascript;charset=utf-8"),
+                ("Content-Length", len(sw_code)),
+            ],
+        )

web_pwa_oca/i18n/es.po

@@ -6,173 +6,135 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Odoo Server 13.0\n"
 "Report-Msgid-Bugs-To: \n"
-"PO-Revision-Date: 2021-02-17 14:45+0000\n"
+"POT-Creation-Date: 2021-03-16 18:49+0000\n"
+"PO-Revision-Date: 2021-03-16 19:50+0100\n"
 "Last-Translator: claudiagn <claudia.gargallo@qubiq.es>\n"
 "Language-Team: none\n"
 "Language: es\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
-"Content-Transfer-Encoding: \n"
+"Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=n != 1;\n"
-"X-Generator: Weblate 4.3.2\n"
+"X-Generator: Poedit 2.4.1\n"
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_background_color
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Background Color"
-"      \"sizes\": \"128x128\",\n"
+msgstr "Color de fondo"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
-msgstr ""
-"\",\n"
-"      \"sizes\": \"128x128\",\n"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model,name:web_pwa_oca.model_res_config_settings
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Config Settings"
-"      \"sizes\": \"144x144\",\n"
+msgstr "Ajustes de configuración"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_icon
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Icon"
-"      \"sizes\": \"152x152\",\n"
+msgstr "Icono"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Name"
-"      \"sizes\": \"192x192\",\n"
+msgstr "Nombre"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Name and icon of your PWA"
-"      \"sizes\": \"256x256\",\n"
+msgstr "Nombre e icono de su PWA"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,help:web_pwa_oca.field_res_config_settings__pwa_name
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Name of the Progressive Web Application"
-"      \"sizes\": \"512x512\",\n"
+msgstr "Nombre de la aplicación web progresiva"
-"      \"type\": \"image/png\"\n"
-"    }],\n"
-"  \"start_url\": \"/web\",\n"
-"  \"display\": \"standalone\",\n"
-"  \"background_color\": \""
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "PWA Title"
-"  \"icons\": [{\n"
+msgstr "Título de PWA"
-"    \"src\": \""
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Progressive Web App"
-"  \"short_name\": \""
+msgstr "Aplicación web progresiva"
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_name
-msgid ""
+#, fuzzy
-"\",\n"
+msgid "Progressive Web App Name"
-"  \"theme_color\": \""
+msgstr "Nombre de la aplicación web progresiva"
-msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.service_worker
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_short_name
-msgid ""
+#, fuzzy
-"';\n"
+msgid "Progressive Web App Short Name"
-"const FILES_TO_CACHE = ["
+msgstr "Nombre corto de la aplicación web progresiva"
-msgstr ""
-
-#. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.service_worker
-msgid ""
-"'use strict';\n"
-"const CACHE_NAME = '"
-msgstr ""
 
 #. module: web_pwa_oca
 #. openerp-web
-#: code:addons/web_pwa_oca/static/src/xml/pwa_install.xml:0
+#: code:addons/web_pwa_oca/static/src/js/pwa_manager.js:0
+#, fuzzy, python-format
+msgid ""
+"Service workers are not supported! Maybe you are not using HTTPS or you work "
+"in private mode."
+msgstr ""
+"¡Los trabajadores de servicios no son compatibles! Quizás no esté usando "
+"HTTPS o trabaje en modo privado."
+
+#. module: web_pwa_oca
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
+#, fuzzy
+msgid "Short Name"
+msgstr "Nombre corto"
+
+#. module: web_pwa_oca
+#: model:ir.model.fields,help:web_pwa_oca.field_res_config_settings__pwa_short_name
+#, fuzzy
+msgid "Short Name of the Progressive Web Application"
+msgstr "Nombre corto de la aplicación web progresiva"
+
+#. module: web_pwa_oca
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_theme_color
+#, fuzzy
+msgid "Theme Color"
+msgstr "Color del tema"
+
+#. module: web_pwa_oca
+#: code:addons/web_pwa_oca/models/res_config_settings.py:0
+#, fuzzy, python-format
+msgid "You can only upload PNG files bigger than 512x512"
+msgstr "Solo puede cargar archivos PNG de más de 512 x 512"
+
+#. module: web_pwa_oca
+#: code:addons/web_pwa_oca/models/res_config_settings.py:0
+#, fuzzy, python-format
+msgid "You can only upload SVG or PNG files"
+msgstr "Solo puede cargar archivos SVG o PNG"
+
+#. module: web_pwa_oca
+#: code:addons/web_pwa_oca/models/res_config_settings.py:0
+#, fuzzy, python-format
+msgid "You can't upload a file with more than 2 MB."
+msgstr "No puede cargar un archivo con más de 2 MB."
+
+#. module: web_pwa_oca
+#. openerp-web
+#: code:addons/web_pwa_oca/static/src/js/pwa_manager.js:0
+#, fuzzy, python-format
+#| msgid "[ServiceWorker] Registration failed: "
+msgid "[ServiceWorker] Registered:"
+msgstr "[ServiceWorker] Registrada:"
+
+#. module: web_pwa_oca
+#. openerp-web
+#: code:addons/web_pwa_oca/static/src/js/pwa_manager.js:0
 #, python-format
-msgid "Install PWA"
+msgid "[ServiceWorker] Registration failed: "
-msgstr ""
+msgstr "[ServiceWorker] Error en el registro: "
-
-#. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.service_worker
-msgid ""
-"];\n"
-"self.addEventListener('install', function (evt) {\n"
-"  console.log('[ServiceWorker] Install');\n"
-"  evt.waitUntil(\n"
-"   caches.open(CACHE_NAME).then(function (cache) {\n"
-"       console.log('[ServiceWorker] Pre-caching offline page');\n"
-"       return cache.addAll(FILES_TO_CACHE);\n"
-"   })\n"
-"  );\n"
-"  self.skipWaiting();\n"
-"});\n"
-"self.addEventListener('activate', function(evt) {\n"
-"  console.log('[ServiceWorker] Activate');\n"
-"   evt.waitUntil(\n"
-"       caches.keys().then(function(keyList) {\n"
-"           return Promise.all(keyList.map(function(key) {\n"
-"               if (key !== CACHE_NAME) {\n"
-"                   console.log('[ServiceWorker] Removing old cache', key);\n"
-"                   return caches.delete(key);\n"
-"               }\n"
-"           }));\n"
-"       })\n"
-"   );\n"
-"  self.clients.claim();\n"
-"});\n"
-"self.addEventListener('fetch', function(evt) {\n"
-"  if (evt.request.cache === 'only-if-cached' &amp;&amp; evt.request.mode !== 'same-origin') {\n"
-"    return;\n"
-"  }\n"
-"  console.log('[ServiceWorker] Fetch', evt.request.url);\n"
-"   evt.respondWith(\n"
-"       caches.open(CACHE_NAME).then(function(cache) {\n"
-"           return cache.match(evt.request)\n"
-"               .then(function(response) {\n"
-"                   return response || fetch(evt.request);\n"
-"                });\n"
-"       })\n"
-"   );\n"
-"});"
-msgstr ""
-
-#. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
-msgid ""
-"{\n"
-"  \"name\": \""
-msgstr ""

web_pwa_oca/i18n/web_pwa_oca.pot

@@ -6,6 +6,8 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Odoo Server 13.0\n"
 "Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: 2021-03-16 18:49+0000\n"
+"PO-Revision-Date: 2021-03-16 18:49+0000\n"
 "Last-Translator: \n"
 "Language-Team: \n"
 "MIME-Version: 1.0\n"
@@ -14,157 +16,107 @@ msgstr ""
 "Plural-Forms: \n"
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_background_color
-msgid ""
+msgid "Background Color"
-"\",\n"
-"      \"sizes\": \"128x128\",\n"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model,name:web_pwa_oca.model_res_config_settings
-msgid ""
+msgid "Config Settings"
-"\",\n"
-"      \"sizes\": \"144x144\",\n"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_icon
-msgid ""
+msgid "Icon"
-"\",\n"
-"      \"sizes\": \"152x152\",\n"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+msgid "Name"
-"\",\n"
-"      \"sizes\": \"192x192\",\n"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+msgid "Name and icon of your PWA"
-"\",\n"
-"      \"sizes\": \"256x256\",\n"
-"      \"type\": \"image/png\"\n"
-"    }, {\n"
-"      \"src\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,help:web_pwa_oca.field_res_config_settings__pwa_name
-msgid ""
+msgid "Name of the Progressive Web Application"
-"\",\n"
-"      \"sizes\": \"512x512\",\n"
-"      \"type\": \"image/png\"\n"
-"    }],\n"
-"  \"start_url\": \"/web\",\n"
-"  \"display\": \"standalone\",\n"
-"  \"background_color\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+msgid "PWA Title"
-"\",\n"
-"  \"icons\": [{\n"
-"    \"src\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+msgid "Progressive Web App"
-"\",\n"
-"  \"short_name\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_name
-msgid ""
+msgid "Progressive Web App Name"
-"\",\n"
-"  \"theme_color\": \""
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.service_worker
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_short_name
-msgid ""
+msgid "Progressive Web App Short Name"
-"';\n"
-"const FILES_TO_CACHE = ["
-msgstr ""
-
-#. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.service_worker
-msgid ""
-"'use strict';\n"
-"const CACHE_NAME = '"
 msgstr ""
 
 #. module: web_pwa_oca
 #. openerp-web
-#: code:addons/web_pwa_oca/static/src/xml/pwa_install.xml:0
+#: code:addons/web_pwa_oca/static/src/js/pwa_manager.js:0
 #, python-format
-msgid "Install PWA"
+msgid ""
+"Service workers are not supported! Maybe you are not using HTTPS or you work"
+" in private mode."
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.service_worker
+#: model_terms:ir.ui.view,arch_db:web_pwa_oca.res_config_settings_view_form
-msgid ""
+msgid "Short Name"
-"];\n"
-"self.addEventListener('install', function (evt) {\n"
-"  console.log('[ServiceWorker] Install');\n"
-"  evt.waitUntil(\n"
-"   caches.open(CACHE_NAME).then(function (cache) {\n"
-"       console.log('[ServiceWorker] Pre-caching offline page');\n"
-"       return cache.addAll(FILES_TO_CACHE);\n"
-"   })\n"
-"  );\n"
-"  self.skipWaiting();\n"
-"});\n"
-"self.addEventListener('activate', function(evt) {\n"
-"  console.log('[ServiceWorker] Activate');\n"
-"   evt.waitUntil(\n"
-"       caches.keys().then(function(keyList) {\n"
-"           return Promise.all(keyList.map(function(key) {\n"
-"               if (key !== CACHE_NAME) {\n"
-"                   console.log('[ServiceWorker] Removing old cache', key);\n"
-"                   return caches.delete(key);\n"
-"               }\n"
-"           }));\n"
-"       })\n"
-"   );\n"
-"  self.clients.claim();\n"
-"});\n"
-"self.addEventListener('fetch', function(evt) {\n"
-"  if (evt.request.cache === 'only-if-cached' && evt.request.mode !== 'same-origin') {\n"
-"    return;\n"
-"  }\n"
-"  console.log('[ServiceWorker] Fetch', evt.request.url);\n"
-"   evt.respondWith(\n"
-"       caches.open(CACHE_NAME).then(function(cache) {\n"
-"           return cache.match(evt.request)\n"
-"               .then(function(response) {\n"
-"                   return response || fetch(evt.request);\n"
-"                });\n"
-"       })\n"
-"   );\n"
-"});"
 msgstr ""
 
 #. module: web_pwa_oca
-#: model_terms:ir.ui.view,arch_db:web_pwa_oca.manifest
+#: model:ir.model.fields,help:web_pwa_oca.field_res_config_settings__pwa_short_name
-msgid ""
+msgid "Short Name of the Progressive Web Application"
-"{\n"
+msgstr ""
-"  \"name\": \""
+
+#. module: web_pwa_oca
+#: model:ir.model.fields,field_description:web_pwa_oca.field_res_config_settings__pwa_theme_color
+msgid "Theme Color"
+msgstr ""
+
+#. module: web_pwa_oca
+#: code:addons/web_pwa_oca/models/res_config_settings.py:0
+#, python-format
+msgid "You can only upload PNG files bigger than 512x512"
+msgstr ""
+
+#. module: web_pwa_oca
+#: code:addons/web_pwa_oca/models/res_config_settings.py:0
+#, python-format
+msgid "You can only upload SVG or PNG files"
+msgstr ""
+
+#. module: web_pwa_oca
+#: code:addons/web_pwa_oca/models/res_config_settings.py:0
+#, python-format
+msgid "You can't upload a file with more than 2 MB."
+msgstr ""
+
+#. module: web_pwa_oca
+#. openerp-web
+#: code:addons/web_pwa_oca/static/src/js/pwa_manager.js:0
+#, python-format
+msgid "[ServiceWorker] Registered:"
+msgstr ""
+
+#. module: web_pwa_oca
+#. openerp-web
+#: code:addons/web_pwa_oca/static/src/js/pwa_manager.js:0
+#, python-format
+msgid "[ServiceWorker] Registration failed: "
 msgstr ""

web_pwa_oca/models/__init__.py

@@ -0,0 +1 @@
+from . import res_config_settings

web_pwa_oca/models/res_config_settings.py

@@ -0,0 +1,153 @@
+# Copyright 2020 Tecnativa - João Marques
+# License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl).
+import base64
+import io
+import sys
+
+from odoo import _, api, exceptions, fields, models
+from odoo.tools.mimetypes import guess_mimetype
+
+from PIL import Image
+
+
+class ResConfigSettings(models.TransientModel):
+    _inherit = "res.config.settings"
+    _pwa_icon_url_base = "/web_pwa_oca/icon"
+
+    pwa_name = fields.Char(
+        "Progressive Web App Name", help="Name of the Progressive Web Application"
+    )
+    pwa_short_name = fields.Char(
+        "Progressive Web App Short Name",
+        help="Short Name of the Progressive Web Application",
+    )
+    pwa_icon = fields.Binary("Icon", readonly=False)
+    pwa_background_color = fields.Char("Background Color")
+    pwa_theme_color = fields.Char("Theme Color")
+
+    @api.model
+    def get_values(self):
+        config_parameter_obj_sudo = self.env["ir.config_parameter"].sudo()
+        res = super(ResConfigSettings, self).get_values()
+        res["pwa_name"] = config_parameter_obj_sudo.get_param(
+            "pwa.manifest.name", default="Odoo PWA"
+        )
+        res["pwa_short_name"] = config_parameter_obj_sudo.get_param(
+            "pwa.manifest.short_name", default="Odoo"
+        )
+        pwa_icon_ir_attachment = (
+            self.env["ir.attachment"]
+            .sudo()
+            .search([("url", "like", self._pwa_icon_url_base + ".")])
+        )
+        res["pwa_icon"] = (
+            pwa_icon_ir_attachment.datas if pwa_icon_ir_attachment else False
+        )
+        res["pwa_background_color"] = config_parameter_obj_sudo.get_param(
+            "pwa.manifest.background_color", default="#2E69B5"
+        )
+        res["pwa_theme_color"] = config_parameter_obj_sudo.get_param(
+            "pwa.manifest.theme_color", default="#2E69B5"
+        )
+        return res
+
+    def _unpack_icon(self, icon):
+        # Wrap decoded_icon in BytesIO object
+        decoded_icon = base64.b64decode(icon)
+        icon_bytes = io.BytesIO(decoded_icon)
+        return Image.open(icon_bytes)
+
+    def _write_icon_to_attachment(self, extension, mimetype, size=None):
+        url = self._pwa_icon_url_base + extension
+        icon = self.pwa_icon
+        # Resize image
+        if size:
+            image = self._unpack_icon(icon)
+            resized_image = image.resize(size)
+            icon_bytes_output = io.BytesIO()
+            resized_image.save(icon_bytes_output, format=extension.lstrip(".").upper())
+            icon = base64.b64encode(icon_bytes_output.getvalue())
+            url = "{}{}x{}{}".format(
+                self._pwa_icon_url_base, str(size[0]), str(size[1]), extension,
+            )
+        # Retreive existing attachment
+        existing_attachment = (
+            self.env["ir.attachment"].sudo().search([("url", "like", url)])
+        )
+        # Write values to ir_attachment
+        values = {
+            "datas": icon,
+            "db_datas": icon,
+            "url": url,
+            "name": url,
+            "type": "binary",
+            "mimetype": mimetype,
+        }
+        # Rewrite if exists, else create
+        if existing_attachment:
+            existing_attachment.sudo().write(values)
+        else:
+            self.env["ir.attachment"].sudo().create(values)
+
+    @api.model
+    def set_values(self):
+        config_parameter_obj_sudo = self.env["ir.config_parameter"].sudo()
+        res = super(ResConfigSettings, self).set_values()
+        config_parameter_obj_sudo.set_param("pwa.manifest.name", self.pwa_name)
+        config_parameter_obj_sudo.set_param(
+            "pwa.manifest.short_name", self.pwa_short_name
+        )
+        config_parameter_obj_sudo.set_param(
+            "pwa.manifest.background_color", self.pwa_background_color
+        )
+        config_parameter_obj_sudo.set_param(
+            "pwa.manifest.theme_color", self.pwa_theme_color
+        )
+        # Retrieve previous value for pwa_icon from ir_attachment
+        pwa_icon_ir_attachments = (
+            self.env["ir.attachment"]
+            .sudo()
+            .search([("url", "like", self._pwa_icon_url_base)])
+        )
+        # Delete or ignore if no icon provided
+        if not self.pwa_icon:
+            if pwa_icon_ir_attachments:
+                pwa_icon_ir_attachments.unlink()
+            return res
+        # Fail if icon provided is larger than 2mb
+        if sys.getsizeof(self.pwa_icon) > 2196608:
+            raise exceptions.UserError(
+                _("You can't upload a file with more than 2 MB.")
+            )
+        # Confirm if the pwa_icon binary content is an SVG or PNG
+        # and process accordingly
+        decoded_pwa_icon = base64.b64decode(self.pwa_icon)
+        # Full mimetype detection
+        pwa_icon_mimetype = guess_mimetype(decoded_pwa_icon)
+        pwa_icon_extension = "." + pwa_icon_mimetype.split("/")[-1].split("+")[0]
+        if not pwa_icon_mimetype.startswith(
+            "image/svg"
+        ) and not pwa_icon_mimetype.startswith("image/png"):
+            raise exceptions.UserError(_("You can only upload SVG or PNG files"))
+        # Delete all previous records if we are writting new ones
+        if pwa_icon_ir_attachments:
+            pwa_icon_ir_attachments.unlink()
+        self._write_icon_to_attachment(pwa_icon_extension, pwa_icon_mimetype)
+        # write multiple sizes if not SVG
+        if pwa_icon_extension != ".svg":
+            # Fail if provided PNG is smaller than 512x512
+            if self._unpack_icon(self.pwa_icon).size < (512, 512):
+                raise exceptions.UserError(
+                    _("You can only upload PNG files bigger than 512x512")
+                )
+            for size in [
+                (128, 128),
+                (144, 144),
+                (152, 152),
+                (192, 192),
+                (256, 256),
+                (512, 512),
+            ]:
+                self._write_icon_to_attachment(
+                    pwa_icon_extension, pwa_icon_mimetype, size=size
+                )

web_pwa_oca/readme/CONFIGURE.rst

@@ -1,10 +1,11 @@
-The following system parameters con be set to customize the appearance of the application
+This module allows you to set the following parameters under settings to customize the appearance of the application
 
-* pwa.manifest.name (defaults to "Odoo PWA")
+* PWA Name (defaults to "Odoo PWA")
-* pwa.manifest.short_name (defaults to "Odoo PWA")
+* PWA Short Name (defaults to "Odoo PWA")
-* pwa.manifest.icon128x128 (defaults to "/web_pwa_oca/static/img/icons/icon-128x128.png")
+* PWA Icon (**SVG**) (defaults to "/web_pwa_oca/static/img/icons/odoo-logo.svg")
-* pwa.manifest.icon144x144 (defaults to "/web_pwa_oca/static/img/icons/icon-144x144.png")
+
-* pwa.manifest.icon152x152 (defaults to "/web_pwa_oca/static/img/icons/icon-152x152.png")
+To configure your PWA:
-* pwa.manifest.icon192x192 (defaults to "/web_pwa_oca/static/img/icons/icon-192x192.png")
+
-* pwa.manifest.icon256x256 (defaults to "/web_pwa_oca/static/img/icons/icon-256x256.png")
+#. Go to **Settings > General Settings > Progressive Web App**.
-* pwa.manifest.icon512x512 (defaults to "/web_pwa_oca/static/img/icons/icon-512x512.png")
+#. Set the parameters (*Note:* Icon **must be a SVG file**)
+#. **Save**

web_pwa_oca/readme/CONTRIBUTORS.rst

@@ -1,3 +1,8 @@
 * `TAKOBI <https://takobi.online>`_:
 
   * Lorenzo Battistini
+
+* `Tecnativa <https://tecnativa.com>`_:
+
+  * Alexandre D. Díaz
+  * João Marques

web_pwa_oca/readme/DESCRIPTION.rst

@@ -3,3 +3,14 @@ Make Odoo an installable Progressive Web Application.
 Progressive Web Apps provide an installable, app-like experience on desktop and mobile that are built and delivered directly via the web.
 They're web apps that are fast and reliable. And most importantly, they're web apps that work in any browser.
 If you're building a web app today, you're already on the path towards building a Progressive Web App.
+
+
++ Developers Info.
+
+The service worker is contructed using 'Odoo Class' to have the same class inheritance behaviour that in the 'user pages'. Be noticed
+that 'Odoo Bootstrap' is not supported so, you can't use 'require' here.
+
+All service worker content can be found in 'static/src/js/worker'. The management between 'user pages' and service worker is done in
+'pwa_manager.js'.
+
+The purpose of this module is give a base to make PWA applications.

web_pwa_oca/readme/INSTALL.rst

@@ -10,4 +10,9 @@ And like all other installed apps, it's a top level app in the task switcher.
 
 In Chrome, a Progressive Web App can either be installed through the three-dot context menu.
 
-This module also provides a "Install PWA" link in Odoo user menu.
+In case you previously installed `web_pwa`, run the following steps with `odoo shell`, after having installed `openupgradelib`:
+
+
+>>> from openupgradelib import openupgrade
+>>> openupgrade.update_module_names(env.cr, [('web_pwa', 'web_pwa_oca')], merge_modules=False)
+>>> env.cr.commit()

web_pwa_oca/readme/ROADMAP.rst

@@ -1,5 +1,35 @@
-* Evaluate to extend ``FILES_TO_CACHE``
-* Evaluate to use a normal JS file for service worker and download data from a normal JSON controller
 * Integrate `Notification API <https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification>`_
 * Integrate `Web Share API <https://web.dev/web-share/>`_
 * Create ``portal_pwa`` module, intended to be used by front-end users (customers, suppliers...)
+* Current *John Resig's inheritance* implementation doesn't support ``async``
+  functions because ``this._super`` can't be called inside a promise. So we
+  need to use the following workaround:
+
+  - Natural 'async/await' example (This breaks "_super" call):
+
+    .. code-block:: javascript
+
+        var MyClass = OdooClass.extend({
+            myFunc: async function() {
+                const mydata = await ...do await stuff...
+                return mydata;
+            }
+        });
+
+  - Same code with the workaround:
+
+    .. code-block:: javascript
+
+        var MyClass = OdooClass.extend({
+            myFunc: function() {
+                return new Promise(async (resolve, reject) => {
+                    const mydata = await ...do await stuff...
+                    return resolve(mydata);
+                });
+            }
+        });
+
+* Fix issue when trying to run in localhost with several databases. The browser
+  doesn't send the cookie and web manifest returns 404.
+* Firefox can't detect 'standalone' mode. See https://bugzilla.mozilla.org/show_bug.cgi?id=1285858
+* Firefox disable service worker in private mode. See https://bugzilla.mozilla.org/show_bug.cgi?id=1601916

web_pwa_oca/readme/USAGE.rst

@@ -0,0 +1,7 @@
+To use your PWA:
+
+#. Open the Odoo web app using a supported browser (See https://caniuse.com/?search=A2HS)
+#. Open the browser options
+#. Click on 'Add to Home screen' (or 'Install' in other browsers)
+
+** Maybe you need refresh the page to load the service worker after using the option.

web_pwa_oca/static/description/index.html

@@ -372,17 +372,26 @@ ul.auto-toc {
 <p>Progressive Web Apps provide an installable, app-like experience on desktop and mobile that are built and delivered directly via the web.
 They’re web apps that are fast and reliable. And most importantly, they’re web apps that work in any browser.
 If you’re building a web app today, you’re already on the path towards building a Progressive Web App.</p>
+<ul class="simple">
+<li>Developers Info.</li>
+</ul>
+<p>The service worker is contructed using ‘Odoo Class’ to have the same class inheritance behaviour that in the ‘user pages’. Be noticed
+that ‘Odoo Bootstrap’ is not supported so, you can’t use ‘require’ here.</p>
+<p>All service worker content can be found in ‘static/src/js/worker’. The management between ‘user pages’ and service worker is done in
+‘pwa_manager.js’.</p>
+<p>The purpose of this module is give a base to make PWA applications.</p>
 <p><strong>Table of contents</strong></p>
 <div class="contents local topic" id="contents">
 <ul class="simple">
 <li><a class="reference internal" href="#installation" id="id1">Installation</a></li>
 <li><a class="reference internal" href="#configuration" id="id2">Configuration</a></li>
-<li><a class="reference internal" href="#known-issues-roadmap" id="id3">Known issues / Roadmap</a></li>
+<li><a class="reference internal" href="#usage" id="id3">Usage</a></li>
-<li><a class="reference internal" href="#bug-tracker" id="id4">Bug Tracker</a></li>
+<li><a class="reference internal" href="#known-issues-roadmap" id="id4">Known issues / Roadmap</a></li>
-<li><a class="reference internal" href="#credits" id="id5">Credits</a><ul>
+<li><a class="reference internal" href="#bug-tracker" id="id5">Bug Tracker</a></li>
-<li><a class="reference internal" href="#authors" id="id6">Authors</a></li>
+<li><a class="reference internal" href="#credits" id="id6">Credits</a><ul>
-<li><a class="reference internal" href="#contributors" id="id7">Contributors</a></li>
+<li><a class="reference internal" href="#authors" id="id7">Authors</a></li>
-<li><a class="reference internal" href="#maintainers" id="id8">Maintainers</a></li>
+<li><a class="reference internal" href="#contributors" id="id8">Contributors</a></li>
+<li><a class="reference internal" href="#maintainers" id="id9">Maintainers</a></li>
 </ul>
 </li>
 </ul>
@@ -396,34 +405,86 @@ If you’re building a web app today, you’re already on the path towards build
 It launches from the same place that other apps launch. It runs in an app without an address bar or other browser UI.
 And like all other installed apps, it’s a top level app in the task switcher.</p>
 <p>In Chrome, a Progressive Web App can either be installed through the three-dot context menu.</p>
-<p>This module also provides a “Install PWA” link in Odoo user menu.</p>
+<p>In case you previously installed <cite>web_pwa</cite>, run the following steps with <cite>odoo shell</cite>, after having installed <cite>openupgradelib</cite>:</p>
+<pre class="doctest-block">
+&gt;&gt;&gt; from openupgradelib import openupgrade
+&gt;&gt;&gt; openupgrade.update_module_names(env.cr, [('web_pwa', 'web_pwa_oca')], merge_modules=False)
+&gt;&gt;&gt; env.cr.commit()
+</pre>
 </div>
 <div class="section" id="configuration">
 <h1><a class="toc-backref" href="#id2">Configuration</a></h1>
-<p>The following system parameters con be set to customize the appearance of the application</p>
+<p>This module allows you to set the following parameters under settings to customize the appearance of the application</p>
 <ul class="simple">
-<li>pwa.manifest.name (defaults to “Odoo PWA”)</li>
+<li>PWA Name (defaults to “Odoo PWA”)</li>
-<li>pwa.manifest.short_name (defaults to “Odoo PWA”)</li>
+<li>PWA Short Name (defaults to “Odoo PWA”)</li>
-<li>pwa.manifest.icon128x128 (defaults to “/web_pwa_oca/static/img/icons/icon-128x128.png”)</li>
+<li>PWA Icon (<strong>SVG</strong>) (defaults to “/web_pwa_oca/static/img/icons/odoo-logo.svg”)</li>
-<li>pwa.manifest.icon144x144 (defaults to “/web_pwa_oca/static/img/icons/icon-144x144.png”)</li>
-<li>pwa.manifest.icon152x152 (defaults to “/web_pwa_oca/static/img/icons/icon-152x152.png”)</li>
-<li>pwa.manifest.icon192x192 (defaults to “/web_pwa_oca/static/img/icons/icon-192x192.png”)</li>
-<li>pwa.manifest.icon256x256 (defaults to “/web_pwa_oca/static/img/icons/icon-256x256.png”)</li>
-<li>pwa.manifest.icon512x512 (defaults to “/web_pwa_oca/static/img/icons/icon-512x512.png”)</li>
 </ul>
+<p>To configure your PWA:</p>
+<ol class="arabic simple">
+<li>Go to <strong>Settings &gt; General Settings &gt; Progressive Web App</strong>.</li>
+<li>Set the parameters (<em>Note:</em> Icon <strong>must be a SVG file</strong>)</li>
+<li><strong>Save</strong></li>
+</ol>
+</div>
+<div class="section" id="usage">
+<h1><a class="toc-backref" href="#id3">Usage</a></h1>
+<p>To use your PWA:</p>
+<ol class="arabic simple">
+<li>Open the Odoo web app using a supported browser (See <a class="reference external" href="https://caniuse.com/?search=A2HS">https://caniuse.com/?search=A2HS</a>)</li>
+<li>Open the browser options</li>
+<li>Click on ‘Add to Home screen’ (or ‘Install’ in other browsers)</li>
+</ol>
+<p>** Maybe you need refresh the page to load the service worker after using the option.</p>
 </div>
 <div class="section" id="known-issues-roadmap">
-<h1><a class="toc-backref" href="#id3">Known issues / Roadmap</a></h1>
+<h1><a class="toc-backref" href="#id4">Known issues / Roadmap</a></h1>
-<ul class="simple">
+<ul>
-<li>Evaluate to extend <tt class="docutils literal">FILES_TO_CACHE</tt></li>
+<li><p class="first">Integrate <a class="reference external" href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification">Notification API</a></p>
-<li>Evaluate to use a normal JS file for service worker and download data from a normal JSON controller</li>
+</li>
-<li>Integrate <a class="reference external" href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification">Notification API</a></li>
+<li><p class="first">Integrate <a class="reference external" href="https://web.dev/web-share/">Web Share API</a></p>
-<li>Integrate <a class="reference external" href="https://web.dev/web-share/">Web Share API</a></li>
+</li>
-<li>Create <tt class="docutils literal">portal_pwa</tt> module, intended to be used by front-end users (customers, suppliers…)</li>
+<li><p class="first">Create <tt class="docutils literal">portal_pwa</tt> module, intended to be used by front-end users (customers, suppliers…)</p>
+</li>
+<li><p class="first">Current <em>John Resig’s inheritance</em> implementation doesn’t support <tt class="docutils literal">async</tt>
+functions because <tt class="docutils literal">this._super</tt> can’t be called inside a promise. So we
+need to use the following workaround:</p>
+<ul>
+<li><p class="first">Natural ‘async/await’ example (This breaks “_super” call):</p>
+<pre class="code javascript literal-block">
+<span class="kd">var</span> <span class="nx">MyClass</span> <span class="o">=</span> <span class="nx">OdooClass</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
+    <span class="nx">myFunc</span><span class="o">:</span> <span class="k">async</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">const</span> <span class="nx">mydata</span> <span class="o">=</span> <span class="k">await</span> <span class="p">...</span><span class="k">do</span> <span class="k">await</span> <span class="nx">stuff</span><span class="p">...</span>
+        <span class="k">return</span> <span class="nx">mydata</span><span class="p">;</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre>
+</li>
+<li><p class="first">Same code with the workaround:</p>
+<pre class="code javascript literal-block">
+<span class="kd">var</span> <span class="nx">MyClass</span> <span class="o">=</span> <span class="nx">OdooClass</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
+    <span class="nx">myFunc</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">new</span> <span class="nb">Promise</span><span class="p">(</span><span class="k">async</span> <span class="p">(</span><span class="nx">resolve</span><span class="p">,</span> <span class="nx">reject</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="p">{</span>
+            <span class="kd">const</span> <span class="nx">mydata</span> <span class="o">=</span> <span class="k">await</span> <span class="p">...</span><span class="k">do</span> <span class="k">await</span> <span class="nx">stuff</span><span class="p">...</span>
+            <span class="k">return</span> <span class="nx">resolve</span><span class="p">(</span><span class="nx">mydata</span><span class="p">);</span>
+        <span class="p">});</span>
+    <span class="p">}</span>
+<span class="p">});</span>
+</pre>
+</li>
+</ul>
+</li>
+<li><p class="first">Fix issue when trying to run in localhost with several databases. The browser
+doesn’t send the cookie and web manifest returns 404.</p>
+</li>
+<li><p class="first">Firefox can’t detect ‘standalone’ mode. See <a class="reference external" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1285858">https://bugzilla.mozilla.org/show_bug.cgi?id=1285858</a></p>
+</li>
+<li><p class="first">Firefox disable service worker in private mode. See <a class="reference external" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1601916">https://bugzilla.mozilla.org/show_bug.cgi?id=1601916</a></p>
+</li>
 </ul>
 </div>
 <div class="section" id="bug-tracker">
-<h1><a class="toc-backref" href="#id4">Bug Tracker</a></h1>
+<h1><a class="toc-backref" href="#id5">Bug Tracker</a></h1>
 <p>Bugs are tracked on <a class="reference external" href="https://github.com/OCA/web/issues">GitHub Issues</a>.
 In case of trouble, please check there if your issue has already been reported.
 If you spotted it first, help us smashing it by providing a detailed and welcomed
@@ -431,24 +492,30 @@ If you spotted it first, help us smashing it by providing a detailed and welcome
 <p>Do not contact contributors directly about support or help with technical issues.</p>
 </div>
 <div class="section" id="credits">
-<h1><a class="toc-backref" href="#id5">Credits</a></h1>
+<h1><a class="toc-backref" href="#id6">Credits</a></h1>
 <div class="section" id="authors">
-<h2><a class="toc-backref" href="#id6">Authors</a></h2>
+<h2><a class="toc-backref" href="#id7">Authors</a></h2>
 <ul class="simple">
 <li>TAKOBI</li>
+<li>Tecnativa</li>
 </ul>
 </div>
 <div class="section" id="contributors">
-<h2><a class="toc-backref" href="#id7">Contributors</a></h2>
+<h2><a class="toc-backref" href="#id8">Contributors</a></h2>
 <ul class="simple">
 <li><a class="reference external" href="https://takobi.online">TAKOBI</a>:<ul>
 <li>Lorenzo Battistini</li>
 </ul>
 </li>
+<li><a class="reference external" href="https://tecnativa.com">Tecnativa</a>:<ul>
+<li>Alexandre D. Díaz</li>
+<li>João Marques</li>
+</ul>
+</li>
 </ul>
 </div>
 <div class="section" id="maintainers">
-<h2><a class="toc-backref" href="#id8">Maintainers</a></h2>
+<h2><a class="toc-backref" href="#id9">Maintainers</a></h2>
 <p>This module is maintained by the OCA.</p>
 <a class="reference external image-reference" href="https://odoo-community.org"><img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" /></a>
 <p>OCA, or the Odoo Community Association, is a nonprofit organization whose

web_pwa_oca/static/img/icons/odoo_logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="919" height="495" viewBox="0 0 919 495"><g fill="none"><path fill="#8F8F8F" d="M695 346c-41.421 0-75-33.579-75-75s33.579-75 75-75 75 33.579 75 75-33.579 75-75 75zm0-31c24.3 0 44-19.7 44-44s-19.7-44-44-44-44 19.7-44 44 19.7 44 44 44zm-157 31c-41.421 0-75-33.579-75-75s33.579-75 75-75 75 33.579 75 75-33.579 75-75 75zm0-31c24.3 0 44-19.7 44-44s-19.7-44-44-44-44 19.7-44 44 19.7 44 44 44zm-82-45c0 41.935-33.592 76-75.009 76C339.575 346 306 312.005 306 270.07c0-41.936 30.5-74.07 74.991-74.07 16.442 0 31.647 3.496 44.007 12.58l.002-43.49c0-8.334 7.27-15.09 15.5-15.09 8.228 0 15.5 6.762 15.5 15.09V270zm-75 45c24.3 0 44-19.7 44-44s-19.7-44-44-44-44 19.7-44 44 19.7 44 44 44z"/><path fill="#875A7B" d="M224 346c-41.421 0-75-33.579-75-75s33.579-75 75-75 75 33.579 75 75-33.579 75-75 75zm0-31c24.3 0 44-19.7 44-44s-19.7-44-44-44-44 19.7-44 44 19.7 44 44 44z"/></g><script xmlns=""/><script xmlns="" type="text/javascript"/><script xmlns="" type="text/javascript"/></svg>

web_pwa_oca/static/src/js/pwa_install.js

@@ -1,43 +0,0 @@
-odoo.define("web_pwa_oca.systray.install", function(require) {
-    "use strict";
-
-    var UserMenu = require("web.UserMenu");
-
-    if ("serviceWorker" in navigator) {
-        window.addEventListener("load", function() {
-            navigator.serviceWorker.register("/service-worker.js").then(function(reg) {
-                console.log("Service worker registered.", reg);
-            });
-        });
-    }
-
-    var deferredInstallPrompt = null;
-
-    UserMenu.include({
-        start: function() {
-            window.addEventListener(
-                "beforeinstallprompt",
-                this.saveBeforeInstallPromptEvent
-            );
-            return this._super.apply(this, arguments);
-        },
-        saveBeforeInstallPromptEvent: function(evt) {
-            deferredInstallPrompt = evt;
-            this.$.find("#pwa_install_button")[0].removeAttribute("hidden");
-        },
-        _onMenuInstallpwa: function() {
-            deferredInstallPrompt.prompt();
-            // Hide the install button, it can't be called twice.
-            this.el.setAttribute("hidden", true);
-            // Log user response to prompt.
-            deferredInstallPrompt.userChoice.then(function(choice) {
-                if (choice.outcome === "accepted") {
-                    console.log("User accepted the A2HS prompt", choice);
-                } else {
-                    console.log("User dismissed the A2HS prompt", choice);
-                }
-                deferredInstallPrompt = null;
-            });
-        },
-    });
-});

web_pwa_oca/static/src/js/pwa_manager.js

@@ -0,0 +1,55 @@
+/* Copyright 2020 Tecnativa - Alexandre D. Díaz
+ * License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). */
+
+odoo.define("web_pwa_oca.PWAManager", function(require) {
+    "use strict";
+
+    var core = require("web.core");
+    var Widget = require("web.Widget");
+
+    var _t = core._t;
+
+    var PWAManager = Widget.extend({
+        /**
+         * @override
+         */
+        init: function() {
+            this._super.apply(this, arguments);
+            if (!("serviceWorker" in navigator)) {
+                console.error(
+                    _t(
+                        "Service workers are not supported! Maybe you are not using HTTPS or you work in private mode."
+                    )
+                );
+            } else {
+                this._service_worker = navigator.serviceWorker;
+                this.registerServiceWorker("/service-worker.js");
+            }
+        },
+
+        /**
+         * @param {String} sw_script
+         * @returns {Promise}
+         */
+        registerServiceWorker: function(sw_script) {
+            return this._service_worker
+                .register(sw_script)
+                .then(this._onRegisterServiceWorker)
+                .catch(function(error) {
+                    console.log(_t("[ServiceWorker] Registration failed: "), error);
+                });
+        },
+
+        /**
+         * Need register some extra API? override this!
+         *
+         * @private
+         * @param {ServiceWorkerRegistration} registration
+         */
+        _onRegisterServiceWorker: function(registration) {
+            console.log(_t("[ServiceWorker] Registered:"), registration);
+        },
+    });
+
+    return PWAManager;
+});

web_pwa_oca/static/src/js/webclient.js

@@ -0,0 +1,19 @@
+/* Copyright 2020 Tecnativa - Alexandre D. Díaz
+ * License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). */
+
+odoo.define("web_pwa_oca.webclient", function(require) {
+    "use strict";
+
+    var WebClient = require("web.WebClient");
+    var PWAManager = require("web_pwa_oca.PWAManager");
+
+    WebClient.include({
+        /**
+         * @override
+         */
+        show_application: function() {
+            this.pwa_manager = new PWAManager(this);
+            return this._super.apply(this, arguments);
+        },
+    });
+});

web_pwa_oca/static/src/js/worker/jquery-sw-compat.js

@@ -0,0 +1,62 @@
+/* Copyright 2020 Tecnativa - Alexandre D. Díaz
+ * License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). */
+
+// Compatibility layer to load some Odoo modules
+// This is a hack, not a complete implementation!
+// only expected to be used by boot.js
+
+(function() {
+    "use strict";
+    function JQuery(selector, context) {
+        return new JQuery.prototype.init(selector, context);
+    }
+
+    JQuery.prototype = {
+        init: function(selector) {
+            if (typeof selector === "function") {
+                selector();
+            }
+        },
+
+        deparam: function(data) {
+            const params = data.split(",");
+            const res = [];
+            for (const param of params) {
+                res.push(param.split("="));
+            }
+            return _.object(res);
+        },
+
+        param: {
+            querystring: function() {
+                return "debug=1";
+            },
+        },
+
+        when: function(tasks) {
+            return Promise.all(tasks instanceof Array ? tasks : [tasks]).then(
+                results => {
+                    return results.length === 1 ? results[0] : results;
+                }
+            );
+        },
+    };
+
+    class Deferred {
+        constructor() {
+            this.promise = new Promise((resolve, reject) => {
+                this.reject = reject;
+                this.resolve = resolve;
+            });
+        }
+    }
+
+    JQuery.prototype.Deferred = () => new Deferred();
+
+    self.$ = JQuery;
+    self.$.deparam = JQuery.prototype.deparam;
+    self.$.param = JQuery.prototype.param;
+    self.$.Deferred = JQuery.prototype.Deferred;
+    self.$.when = JQuery.prototype.when;
+    self.window = self;
+})();

web_pwa_oca/static/src/js/worker/pwa.js

@@ -0,0 +1,40 @@
+/* Copyright 2020 Tecnativa - Alexandre D. Díaz
+ * License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). */
+
+/**
+ * Services workers are a piece of software separated from the user page.
+ * Here can't use 'Odoo Bootstrap', so we can't work with 'require' system.
+ * When the service worker is called to be installed from the "pwa_manager"
+ * this class is instantiated.
+ */
+
+odoo.define("web_pwa_oca.PWA", function(require) {
+    "use strict";
+
+    const OdooClass = require("web.Class");
+
+    const PWA = OdooClass.extend({
+        // eslint-disable-next-line
+        init: function(params) {
+            // To be overridden
+        },
+
+        /**
+         * @returns {Promise}
+         */
+        installWorker: function() {
+            // To be overridden
+            return Promise.resolve();
+        },
+
+        /**
+         * @returns {Promise}
+         */
+        activateWorker: function() {
+            // To be overridden
+            return Promise.resolve();
+        },
+    });
+
+    return PWA;
+});

web_pwa_oca/static/src/xml/pwa_install.xml

@@ -1,18 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" ?>
-<templates>
-    <t t-name="web_pwa_oca.systray.install">
-        <a
-            href="#"
-            role="menuitem"
-            id="pwa_install_button"
-            data-menu="installpwa"
-            class="dropdown-item"
-            hidden="1"
-        >Install PWA</a>
-    </t>
-    <t t-extend="UserMenu.Actions">
-        <t t-jquery="a[data-menu='settings']" t-operation="after">
-            <t t-call="web_pwa_oca.systray.install" />
-        </t>
-    </t>
-</templates>

web_pwa_oca/templates/assets.xml

@@ -0,0 +1,47 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<odoo>
+    <template
+        id="web_layout_pwa"
+        name="Web layout PWA"
+        inherit_id="web.webclient_bootstrap"
+    >
+        <xpath expr="//t[@t-call-assets='web.assets_common']" position="before">
+            <!-- Add link rel manifest -->
+            <link rel="manifest" t-attf-href="/web_pwa_oca/manifest.webmanifest" />
+            <!-- Add iOS meta tags and icons -->
+            <meta name="apple-mobile-web-app-capable" content="yes" />
+            <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+            <t
+                t-set="pwa_name"
+                t-value="request.env['ir.config_parameter'].sudo().get_param('pwa.manifest.name')"
+            />
+            <meta name="apple-mobile-web-app-title" t-att-content="pwa_name" />
+            <link
+                rel="apple-touch-icon"
+                href="/web_pwa_oca/static/img/icons/icon-152x152.png"
+            />
+            <!-- Add meta theme-color -->
+            <t
+                t-set="pwa_theme_color"
+                t-value="request.env['ir.config_parameter'].sudo().get_param('pwa.manifest.theme_color')"
+            />
+            <meta name="theme-color" t-att-content="pwa_theme_color" />
+        </xpath>
+    </template>
+    <template
+        id="assets_backend"
+        name="web service worker assets"
+        inherit_id="web.assets_backend"
+    >
+        <xpath expr="." position="inside">
+            <script
+                type="text/javascript"
+                src="/web_pwa_oca/static/src/js/pwa_manager.js"
+            />
+            <script
+                type="text/javascript"
+                src="/web_pwa_oca/static/src/js/webclient.js"
+            />
+        </xpath>
+    </template>
+</odoo>

web_pwa_oca/tests/__init__.py

@@ -0,0 +1 @@
+from . import test_web_pwa_oca_controller

web_pwa_oca/tests/test_web_pwa_oca_controller.py

@@ -0,0 +1,124 @@
+# Copyright 2020 João Marques
+# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl.html).
+
+import base64
+import json
+
+import odoo.tests
+from odoo import exceptions
+from odoo.modules.module import get_resource_path
+
+
+class TestUi(odoo.tests.HttpCase):
+    def setUp(self):
+        super().setUp()
+        self.user = self.env.ref("base.user_admin")
+        self.res_config_settings_obj = (
+            self.env["res.config.settings"].sudo(self.user.id).create({})
+        )
+
+    def test_manifest_valid_json(self):
+        # Call the manifest controller
+        manifest_data = self.url_open("/web_pwa_oca/manifest.webmanifest")
+        # should be valid json
+        manifest_content_str = manifest_data.content.decode("utf-8")
+        json.loads(manifest_content_str)
+
+    def test_manifest_correct_paramenters(self):
+        # Set PWA parameters in settings
+        self.res_config_settings_obj.pwa_name = "Test PWA"
+        self.res_config_settings_obj.pwa_short_name = "Test"
+        # icon should remain the default one
+        self.res_config_settings_obj.pwa_icon = False
+        self.res_config_settings_obj.set_values()
+
+        # Call the manifest controller
+        manifest_data = self.url_open("/web_pwa_oca/manifest.webmanifest")
+        manifest_content_str = manifest_data.content.decode("utf-8")
+        manifest_content = json.loads(manifest_content_str)
+
+        self.assertEquals(manifest_content["name"], "Test PWA")
+        self.assertEquals(manifest_content["short_name"], "Test")
+        # icon should remain the default one
+        self.assertEquals(
+            manifest_content["icons"][0]["src"],
+            "/web_pwa_oca/static/img/icons/icon-128x128.png",
+        )
+        self.assertEquals(manifest_content["icons"][0]["sizes"], "128x128")
+        self.assertTrue(manifest_content["icons"][0]["type"].startswith("image/png"))
+
+    def test_manifest_logo_upload(self):
+        with open(
+            "%s/static/img/icons/odoo_logo.svg" % get_resource_path("web_pwa_oca"), "rb"
+        ) as fi:
+            icon_to_send = base64.b64encode(fi.read())
+
+        # Set PWA icon in settings
+        self.res_config_settings_obj.pwa_icon = icon_to_send
+        self.res_config_settings_obj.set_values()
+
+        # Call the manifest controller
+        manifest_data = self.url_open("/web_pwa_oca/manifest.webmanifest")
+        manifest_content_str = manifest_data.content.decode("utf-8")
+        manifest_content = json.loads(manifest_content_str)
+
+        self.assertEquals(manifest_content["icons"][0]["src"], "/web_pwa_oca/icon.svg")
+        self.assertTrue(manifest_content["icons"][0]["type"].startswith("image/svg"))
+        self.assertEquals(
+            manifest_content["icons"][0]["sizes"],
+            "128x128 144x144 152x152 192x192 256x256 512x512",
+        )
+
+        # Get the icon and compare it
+        icon_data = self.url_open("/web_pwa_oca/icon.svg")
+        icon_data_bytes = base64.b64encode(icon_data.content)
+        self.assertEquals(icon_data_bytes, icon_to_send)
+
+    def test_png_logo_upload(self):
+        with open(
+            "%s/static/img/icons/icon-512x512.png" % get_resource_path("web_pwa_oca"),
+            "rb",
+        ) as fi:
+            icon_to_send = base64.b64encode(fi.read())
+
+        # Set PWA icon in settings
+        self.res_config_settings_obj.pwa_icon = icon_to_send
+        self.res_config_settings_obj.set_values()
+
+        # Call the manifest controller
+        manifest_data = self.url_open("/web_pwa_oca/manifest.webmanifest")
+        manifest_content_str = manifest_data.content.decode("utf-8")
+        manifest_content = json.loads(manifest_content_str)
+
+        expected_vals = {
+            "src": "/web_pwa_oca/icon512x512.png",
+            "sizes": "512x512",
+            "type": "image/png",
+        }
+        self.assertTrue(expected_vals in manifest_content["icons"])
+
+    def test_manifest_logo_upload_big(self):
+        # Set PWA icon in settings
+        with self.assertRaises(exceptions.UserError):
+            # Image with more than 2MB
+            self.res_config_settings_obj.pwa_icon = b"a" * 3000000
+            self.res_config_settings_obj.set_values()
+
+    def test_manifest_logo_upload_extension(self):
+        with self.assertRaises(exceptions.UserError):
+            # Image that is not SVG or PNG
+            self.res_config_settings_obj.pwa_icon = b"a" * 1000
+            self.res_config_settings_obj.set_values()
+
+    def test_manifest_logo_upload_small(self):
+        icon_to_send = None
+        with open(
+            "%s/static/img/icons/icon-128x128.png" % get_resource_path("web_pwa_oca"),
+            "rb",
+        ) as fi:
+            icon_to_send = base64.b64encode(fi.read())
+        # Set PWA icon in settings
+        with self.assertRaises(exceptions.UserError):
+            # Image smaller than 512X512
+            self.res_config_settings_obj.pwa_icon = icon_to_send
+            self.res_config_settings_obj.set_values()

web_pwa_oca/views/res_config_settings_views.xml

@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<odoo>
+    <data>
+        <record id="res_config_settings_view_form" model="ir.ui.view">
+            <field name="name">res.config.settings.view.form.pwa</field>
+            <field name="model">res.config.settings</field>
+            <field name="inherit_id" ref="base_setup.res_config_settings_view_form" />
+            <field name="arch" type="xml">
+                <div id="emails" position='after'>
+                    <h2>Progressive Web App</h2>
+                    <div class="row mt16 o_settings_container" id="pwa_settings">
+                        <div class="col-12 col-lg-6 o_setting_box" id="domain_setting">
+                            <div class="o_setting_right_pane">
+                                <label for="pwa_name" string="PWA Title" />
+                                <span class="fa fa-lg fa-globe" />
+                                <div class="text-muted">
+                                    Name and icon of your PWA
+                                </div>
+                                <div class="content-group">
+                                    <div class="row mt16">
+                                        <label
+                                            class="col-lg-3 o_light_label"
+                                            string="Name"
+                                            for="pwa_name"
+                                        />
+                                        <field name="pwa_name" />
+                                    </div>
+                                    <div class="row mt16">
+                                        <label
+                                            class="col-lg-3 o_light_label"
+                                            string="Short Name"
+                                            for="pwa_short_name"
+                                        />
+                                        <field name="pwa_short_name" />
+                                    </div>
+                                    <div class="row">
+                                        <label
+                                            class="col-lg-3 o_light_label"
+                                            for="pwa_background_color"
+                                        />
+                                        <field name="pwa_background_color" />
+                                    </div>
+                                    <div class="row">
+                                        <label
+                                            class="col-lg-3 o_light_label"
+                                            for="pwa_theme_color"
+                                        />
+                                        <field name="pwa_theme_color" />
+                                    </div>
+                                    <div class="row">
+                                        <label
+                                            class="col-lg-3 o_light_label"
+                                            for="pwa_icon"
+                                        />
+                                        <field
+                                            name="pwa_icon"
+                                            widget="image"
+                                            class="float-left oe_avatar"
+                                        />
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </field>
+        </record>
+    </data>
+</odoo>

web_pwa_oca/views/webclient_templates.xml

@@ -1,109 +0,0 @@
-<?xml version="1.0" encoding="utf-8" ?>
-<odoo>
-    <template id="web_layout_pwa" name="Web layout PWA" inherit_id="web.layout">
-        <xpath expr="//meta[@name='viewport']" position="after">
-            <!-- Add link rel manifest -->
-            <link rel="manifest" href="/web_pwa_oca/manifest.json" />
-            <!-- Add iOS meta tags and icons -->
-            <meta name="apple-mobile-web-app-capable" content="yes" />
-            <meta name="apple-mobile-web-app-status-bar-style" content="black" />
-            <meta name="apple-mobile-web-app-title" content="Odoo PWA" />
-            <link
-                rel="apple-touch-icon"
-                href="/web_pwa_oca/static/img/icons/icon-152x152.png"
-            />
-            <!-- Add meta theme-color -->
-            <meta name="theme-color" content="#2E69B5" />
-        </xpath>
-    </template>
-    <template id="assets_backend" name="PWA assets" inherit_id="web.assets_backend">
-        <xpath expr="." position="inside">
-            <script
-                type="text/javascript"
-                src="/web_pwa_oca/static/src/js/pwa_install.js"
-            />
-        </xpath>
-    </template>
-    <template id="service_worker" name="PWA service worker">
-'use strict';
-const CACHE_NAME = '<t t-esc="pwa_cache_name" />';
-const FILES_TO_CACHE = [
-  <t t-foreach="pwa_files_to_cache" t-as="file_to_cache">
-      '<t t-esc="file_to_cache" />',
-  </t>
-];
-self.addEventListener('install', function (evt) {
-  console.log('[ServiceWorker] Install');
-  evt.waitUntil(
-   caches.open(CACHE_NAME).then(function (cache) {
-       console.log('[ServiceWorker] Pre-caching offline page');
-       return cache.addAll(FILES_TO_CACHE);
-   })
-  );
-  self.skipWaiting();
-});
-self.addEventListener('activate', function(evt) {
-  console.log('[ServiceWorker] Activate');
-   evt.waitUntil(
-       caches.keys().then(function(keyList) {
-           return Promise.all(keyList.map(function(key) {
-               if (key !== CACHE_NAME) {
-                   console.log('[ServiceWorker] Removing old cache', key);
-                   return caches.delete(key);
-               }
-           }));
-       })
-   );
-  self.clients.claim();
-});
-self.addEventListener('fetch', function(evt) {
-  if (evt.request.cache === 'only-if-cached' &amp;&amp; evt.request.mode !== 'same-origin') {
-    return;
-  }
-  console.log('[ServiceWorker] Fetch', evt.request.url);
-   evt.respondWith(
-       caches.open(CACHE_NAME).then(function(cache) {
-           return cache.match(evt.request)
-               .then(function(response) {
-                   return response || fetch(evt.request);
-                });
-       })
-   );
-});
-    </template>
-    <template id="manifest" name="PWA manifest">
-{
-  "name": "<t t-esc="pwa_name" />",
-  "short_name": "<t t-esc="pwa_short_name" />",
-  "icons": [{
-    "src": "<t t-esc="icon128x128" />",
-      "sizes": "128x128",
-      "type": "image/png"
-    }, {
-      "src": "<t t-esc="icon144x144" />",
-      "sizes": "144x144",
-      "type": "image/png"
-    }, {
-      "src": "<t t-esc="icon152x152" />",
-      "sizes": "152x152",
-      "type": "image/png"
-    }, {
-      "src": "<t t-esc="icon192x192" />",
-      "sizes": "192x192",
-      "type": "image/png"
-    }, {
-      "src": "<t t-esc="icon256x256" />",
-      "sizes": "256x256",
-      "type": "image/png"
-    }, {
-      "src": "<t t-esc="icon512x512" />",
-      "sizes": "512x512",
-      "type": "image/png"
-    }],
-  "start_url": "/web",
-  "display": "standalone",
-  "background_color": "<t t-esc="background_color" />",
-  "theme_color": "<t t-esc="theme_color" />"
-}
-    </template>
-</odoo>