From 9831ed08fe60f36244e8e941012ca6866cab3e16 Mon Sep 17 00:00:00 2001 From: Romeo Fragomeli Date: Tue, 15 Oct 2019 08:31:09 +0000 Subject: [PATCH 1/3] [IMP] web: force desktop mode on mobile Before this commit, some views appeared broken on mobile. We don't consider this as a bug because Odoo is not supposed to be responsive in Community edition. This feature is only available on Enterprise. This commit aims at clarifying this situation by clearly moving the base requirements to support browsers' responsive to the Enterprise edition and stating that the Community edition only targets desktop. It's important to note that, for technical reasons, some responsive-related JS/CSS code may still be present in the Community codebase but they are not meant to provide any explicit or implicit support for responsive/mobile devices. Technically speaking, this commit removes the viewport meta tag. This change will then force the "desktop-like" rendering even on small screens for the Community edition and will keep the current behavior (scaling/zooming on small screens) for the Enterprise edition. By doing this we do not let the users think that something is broken and must be fixed. So, in Community edition, desktop is always displayed; In Enterprise edition, Responsive Web Design is available. We also had to adapt a test to be able to apply XPath adding viewport meta tag in enterprise. Task ID: 2090202 --- addons/web/tests/test_js.py | 2 +- addons/web/views/webclient_templates.xml | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/addons/web/tests/test_js.py b/addons/web/tests/test_js.py index 71e96c8b3b8..2547a82d978 100644 --- a/addons/web/tests/test_js.py +++ b/addons/web/tests/test_js.py @@ -22,7 +22,7 @@ class WebSuite(odoo.tests.HttpCase): def _check_only_call(self, suite): # As we currently aren't in a request context, we can't render `web.layout`. # redefinied it as a minimal proxy template. - self.env.ref('web.layout').write({'arch_db': ''}) + self.env.ref('web.layout').write({'arch_db': ''}) for asset in self.env['ir.qweb']._get_asset_content(suite, options={})[0]: filename = asset['filename'] diff --git a/addons/web/views/webclient_templates.xml b/addons/web/views/webclient_templates.xml index 6de09a8379b..56a57751e03 100644 --- a/addons/web/views/webclient_templates.xml +++ b/addons/web/views/webclient_templates.xml @@ -417,7 +417,6 @@ - <link type="image/x-icon" rel="shortcut icon" t-att-href="x_icon or '/web/static/src/img/favicon.ico'"/> From 78b9dad560aec804bf67eb7e656443bac9caefbf Mon Sep 17 00:00:00 2001 From: Romeo Fragomeli <rfr@odoo.com> Date: Thu, 17 Oct 2019 13:54:53 +0000 Subject: [PATCH 2/3] [REF] web,barcodes: simplify mobile device detection In this commit, we introduce "isMobileDevice". Do not confuse with isMobile. isMobile: A frequent use case is to have a different render in 'mobile' mode, meaning when the screen is small. This flag (boolean) is true when the size is XS/VSM/SM. It is also updated dynamically. isMobileDevice: Mobile device detection using userAgent. This flag doesn't depend on the size/resolution of the screen. It targets mobile devices which suggests that there is a virtual keyboard. Task ID: 2090202 --- addons/barcodes/static/src/js/barcode_events.js | 10 ++-------- addons/web/static/src/js/services/config.js | 14 ++++++++++++++ 2 files changed, 16 insertions(+), 8 deletions(-) diff --git a/addons/barcodes/static/src/js/barcode_events.js b/addons/barcodes/static/src/js/barcode_events.js index 5fcd68ac680..b07cf7bd19b 100644 --- a/addons/barcodes/static/src/js/barcode_events.js +++ b/addons/barcodes/static/src/js/barcode_events.js @@ -1,6 +1,7 @@ odoo.define('barcodes.BarcodeEvents', function(require) { "use strict"; +var config = require('web.config'); var core = require('web.core'); var mixins = require('web.mixins'); var session = require('web.session'); @@ -46,14 +47,7 @@ var BarcodeEvents = core.Class.extend(mixins.PropertiesMixin, { $(_.bind(this.start, this, false)); // Mobile device detection - var isMobile = navigator.userAgent.match(/Android/i) || - navigator.userAgent.match(/webOS/i) || - navigator.userAgent.match(/iPhone/i) || - navigator.userAgent.match(/iPad/i) || - navigator.userAgent.match(/iPod/i) || - navigator.userAgent.match(/BlackBerry/i) || - navigator.userAgent.match(/Windows Phone/i); - this.isChromeMobile = isMobile && navigator.userAgent.match(/Chrome/i); + this.isChromeMobile = config.device.isMobileDevice && navigator.userAgent.match(/Chrome/i); // Creates an input who will receive the barcode scanner value. this.$barcodeInput = $('<input/>', { diff --git a/addons/web/static/src/js/services/config.js b/addons/web/static/src/js/services/config.js index 8412c1319a8..91c3f1c764c 100644 --- a/addons/web/static/src/js/services/config.js +++ b/addons/web/static/src/js/services/config.js @@ -34,6 +34,20 @@ var config = { * @type Boolean */ isMobile: null, + /** + * Mobile device detection using userAgent. + * This flag doesn't depend on the size/resolution of the screen. + * It targets mobile devices which suggests that there is a virtual keyboard. + * + * @return {boolean} + */ + isMobileDevice: navigator.userAgent.match(/Android/i) || + navigator.userAgent.match(/webOS/i) || + navigator.userAgent.match(/iPhone/i) || + navigator.userAgent.match(/iPad/i) || + navigator.userAgent.match(/iPod/i) || + navigator.userAgent.match(/BlackBerry/i) || + navigator.userAgent.match(/Windows Phone/i), /** * Mapping between the numbers 0,1,2,3,4,5,6 and some descriptions */ From 56b91ccdc0bec338588877d2e7ff6829a9e023d9 Mon Sep 17 00:00:00 2001 From: Romeo Fragomeli <rfr@odoo.com> Date: Thu, 17 Oct 2019 13:57:42 +0000 Subject: [PATCH 3/3] [FIX] web: virtual keyboard is always showing during navigation Before this commit, the search bar auto focus was already disable on mobile based on media queries. But "isMobile" equals false since we force the desktop mode. To fix this, we use isMobileDevice which doesn't depend on the resolution. Task ID: 2090202 --- .../static/src/js/views/control_panel/control_panel_renderer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/web/static/src/js/views/control_panel/control_panel_renderer.js b/addons/web/static/src/js/views/control_panel/control_panel_renderer.js index bdde2827e96..12d120b53ab 100644 --- a/addons/web/static/src/js/views/control_panel/control_panel_renderer.js +++ b/addons/web/static/src/js/views/control_panel/control_panel_renderer.js @@ -185,7 +185,7 @@ var ControlPanelRenderer = Renderer.extend({ * @private */ _focusSearchInput: function () { - if (this.withSearchBar && !config.device.isMobile) { + if (this.withSearchBar && !config.device.isMobileDevice) { // in mobile mode, we would rather not focus manually the // input, because it opens up the integrated keyboard, which is // not what you expect when you just selected a filter.