[MIG] web_responsive: Migrate to v10

* Bump version
* Change all openerp to odoo
* Fix qunit suite injection
* Remove jQuery require
* Change to new selectors:
  * `oe_leftbar` to `o_sub_menu`
  * `oe_logo` to `o_sub_menu_logo`
  * `oe_footer` to `o_sub_menu_footer`
  * `oe_secondary_menus_container` to `o_sub_menu_content`
* Add style to hide oe_footer instead of remove to not break `support_branding`
* Add note in ReadMe explaining override of `support_branding`
* Set top margin of app drawer title to 0 to fit v10 proportions
* Fix notification badge positioning
* Add o_web_client class to body to fix overlaps
* Scroll control panel with page
* Change navbar z-index to not be overlapped by buttons
* Raise z-index on header to raise over buttons
* Handle layered notifications via z-index
* Remove `#` from navigation links HREF to prevent history littering

web_responsive/README.rst

@@ -35,7 +35,7 @@ The following keyboard shortcuts are implemented:
 
 .. image:: https://odoo-community.org/website/image/ir.attachment/5784_f2813bd/datas
    :alt: Try me on Runbot
-   :target: https://runbot.odoo-community.org/runbot/154/9.0
+   :target: https://runbot.odoo-community.org/runbot/154/10.0
 
 Known issues / Roadmap
 ======================

web_responsive/__openerp__.py → web_responsive/__manifest__.py

@@ -6,7 +6,7 @@
     "name": "Web Responsive",
     "summary": "It provides a mobile compliant interface for Odoo Community "
                "web",
-    "version": "9.0.1.0.0",
+    "version": "10.0.1.0.0",
     "category": "Website",
     "website": "https://laslabs.com/",
     "author": "LasLabs, Tecnativa, Odoo Community Association (OCA)",

web_responsive/static/src/js/web_responsive.js

@@ -4,7 +4,6 @@
 odoo.define('web_responsive', function(require) {
     'use strict';
 
-    var $ = require('$');
     var Menu = require('web.Menu');
     var Class = require('web.Class');
     var SearchView = require('web.SearchView');
@@ -83,12 +82,18 @@ odoo.define('web_responsive', function(require) {
                 '-': this.LEFT,
             };
             this.initDrawer();
-            var $clickZones = $('.openerp_webclient_container, ' +
+            var $clickZones = $('.odoo_webclient_container, ' +
                                 'a.oe_menu_leaf, ' +
                                 'a.oe_menu_toggler, ' +
                                 'a.oe_logo, ' +
                                 'i.oe_logo_edit'
                                 );
+            $('.o_content').scroll(function() {
+                $('.o_control_panel').css(
+                    'margin-top',
+                    -$(this).scrollTop() + 'px'
+                );
+            });
             $clickZones.click($.proxy(this.handleClickZones, this));
             core.bus.on('resize', this, this.handleWindowResize);
             core.bus.on('keydown', this, this.handleNavKeys);
@@ -115,7 +120,7 @@ odoo.define('web_responsive', function(require) {
         // It provides handlers to hide drawer when "unfocused"
         handleClickZones: function() {
             this.$el.drawer('close');
-            $('.oe_secondary_menus_container')
+            $('.o_sub_menu_content')
                 .parent()
                 .collapse('hide');
         },

web_responsive/static/src/less/app_drawer.less

@@ -11,10 +11,15 @@
     border-radius: @border-radius-base;
     .box-shadow(0 6px 12px rgba(0, 0, 0, .175));
     background-clip: padding-box;
+    z-index: 2000;
+    
+    .o_tooltip {
+        z-index: 2051;
+    }
     
     .oe_logo {
         img {
-            margin-top: -@app-drawer-navbar-padding-vertical;
+            margin-top: -@app-drawer-navbar-padding-vertical * 2;
             height: @app-drawer-title-height;
         }
         .oe_logo_edit {
@@ -65,14 +70,12 @@
         position: absolute;
         height: @app-drawer-title-height;
         width: 100%;
-        z-index: 9999;
     }
 
 }
 
 .drawer-nav {
     width: @app-drawer-width;
-    z-index: 9999;
 }
 
 .drawer--left .drawer-nav {

web_responsive/static/src/less/main.less

@@ -22,6 +22,25 @@ main {
     overflow: hidden;
 }
 
-div.oe_footer {
-    display: none;
+header {
+    z-index: 10;
+}
+
+.o_cp_switch_buttons {
+    .active {
+        z-index: 10;
+    }
+}
+
+.o_sub_menu {
+    .o_sub_menu_logo {
+        display: none;
+    }
+    .o_sub_menu_footer {
+        display: none;
+    }
+}
+
+.o_tooltip.active {
+    z-index: 2051;
 }

web_responsive/static/src/less/navbar.less

@@ -2,12 +2,22 @@
  * License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
 
 .main-nav {
+
     margin-bottom: 0;
     min-height: @app-drawer-navbar-height;
-}
+    z-index: 1;
+    border: none;
+    
+    .badge {
+        position: absolute;
+        top: 3px;
+        right: @navbar-padding-horizontal / 2;
+    }
+    
+    ul.nav > li > a {
+        padding: @app-drawer-navbar-padding-vertical @app-drawer-padding-horizontal;
+    }
     
-.main-nav ul.nav > li > a {
-    padding: @app-drawer-navbar-padding-vertical @app-drawer-padding-horizontal;
 }
 
 .oe_topbar_avatar {

web_responsive/static/src/less/variables.less

@@ -5,7 +5,7 @@
 @app-drawer-icon-size:      6em;
 @app-drawer-icon-margin:    1em;
 @app-drawer-width:          80%;
-@app-drawer-title-height:   @navbar-height;
+@app-drawer-title-height:   54px;
 
 // Navbar
 @app-drawer-navbar-height:  @navbar-height / 2;

web_responsive/static/tests/js/web_responsive.js

@@ -23,7 +23,7 @@ odoo.define_section('web_responsive', ['web_responsive'], function(test) {
         
         self.$clickZone = $('<a class="oe_menu_leaf">');
         
-        self.$secondaryMenu = $('<div><div class="oe_secondary_menus_container">');
+        self.$secondaryMenu = $('<div><div class="o_sub_menu_content">');
         
         self.$dropdown = $('<div class="dropdown-scrollable">');
     

web_responsive/tests/test_ui.py

@@ -2,7 +2,7 @@
 # Copyright 2016 LasLabs Inc.
 # License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl.html).
 
-from openerp.tests import HttpCase
+from odoo.tests import HttpCase
 
 
 class TestUi(HttpCase):

web_responsive/views/assets.xml

@@ -37,7 +37,7 @@
         </xpath>
     </template>
     <template id="qunit_suite" inherit_id="web.qunit_suite">
-        <xpath expr="//html/head" position="inside">
+        <xpath expr="//t[@t-set='head']" position="inside">
             <script type="application/javascript"
                     src="/web_responsive/static/tests/js/web_responsive.js"
                     />

web_responsive/views/web.xml

@@ -12,7 +12,7 @@
               name="App Drawer - Web Client"
               >
 
-        <xpath expr="//div[@class='oe_leftbar']" position="replace" />
+        <xpath expr="//div[@class='o_sub_menu']" position="replace" />
 
         <xpath expr="//t[@t-set='head']" position="inside">
             <meta charset="utf-8" />
@@ -25,7 +25,7 @@
 
         <xpath expr="//nav[@id='oe_main_menu_navbar']" position="replace">
 
-            <t t-set="body_classname" t-value="'drawer drawer--left'" />
+            <t t-set="body_classname" t-value="'drawer drawer--left o_web_client'" />
 
             <header role="banner">
                 <nav id="odooAppDrawer" class="app-drawer-nav drawer-nav" role="navigation">
@@ -40,8 +40,7 @@
 
                         <div class="navbar-header">
 
-                            <a href="#"
-                               class="drawer-toggle navbar-collapse collapse btn btn-default app-drawer-toggle"
+                            <a class="drawer-toggle navbar-collapse collapse btn btn-default app-drawer-toggle"
                                accesskey="A"
                                >
                                 <span class="sr-only">Toggle App Drawer</span>
@@ -78,7 +77,7 @@
                              data-parent="#odooMenuBarToggle"
                              aria-expanded="false"
                              >
-                            <div class="oe_leftbar"
+                            <div class="o_sub_menu"
                                  groups="base.group_user,base.group_portal"
                                  >
                                 <t t-call="web.menu_secondary" />
@@ -106,9 +105,7 @@
               name="App Drawer - Secondary Menu"
               >
 
-        <xpath expr="//a[@class='oe_logo']" position="replace" />
-
-        <xpath expr="//div[@class='oe_secondary_menus_container']/t" position="replace">
+        <xpath expr="//div[@class='o_sub_menu_content']/t" position="replace">
 
             <t t-foreach="menu_data['children']" t-as="menu">
                 <ul class="oe_secondary_menu nav navbar-nav"
@@ -140,8 +137,7 @@
                             </t>
                         </t>
                         <t t-if="not submenu">
-                            <a href="#"
-                               class="dropdown-toggle"
+                            <a class="dropdown-toggle"
                                data-toggle="dropdown"
                                role="button"
                                aria-haspopup="true"
@@ -215,7 +211,7 @@
                 <div class="panel-heading" id="appDrawerAppPanelHead">
                     <div class="col-xs-6">
                         <h4 class="app-drawer-panel-title pull-left">
-                            <a href="#" class="app-drawer-icon-close drawer-toggle">
+                            <a class="app-drawer-icon-close drawer-toggle">
                                 <i class="fa fa-lg fa-chevron-left"
                                    t-translation="off"
                                    aria-hidden="true"
@@ -244,7 +240,7 @@
                             </t>
                         </li>
                         <li id="menu_more_container" class="dropdown" style="display: none;">
-                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
+                            <a class="dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
                             <ul id="menu_more" class="dropdown-menu"></ul>
                         </li>
                     </ul>