diff --git a/web_responsive/README.rst b/web_responsive/README.rst
index db5299685..6eae1ac65 100644
--- a/web_responsive/README.rst
+++ b/web_responsive/README.rst
@@ -87,6 +87,22 @@ Features for computers:
.. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter_topbar.gif
+* AppMenu waits for action finished to show the view
+
+ .. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/appmenu.gif
+
+* Sticky header & footer in list view
+
+ .. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/listview.gif
+
+* Sticky statusbar in form view
+
+ .. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/formview.gif
+
+* Followers and send button is displayed on mobile. Avatar is hidden.
+
+ .. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter.gif
+
**Table of contents**
.. contents::
diff --git a/web_responsive/__manifest__.py b/web_responsive/__manifest__.py
index 0d5d1564a..f190bd608 100644
--- a/web_responsive/__manifest__.py
+++ b/web_responsive/__manifest__.py
@@ -5,7 +5,7 @@
{
"name": "Web Responsive",
"summary": "Responsive web client, community-supported",
- "version": "12.0.1.1.0",
+ "version": "12.0.1.1.1",
"category": "Website",
"website": "https://github.com/OCA/web",
"author": "LasLabs, Tecnativa, Alexandre Díaz, "
diff --git a/web_responsive/readme/DESCRIPTION.rst b/web_responsive/readme/DESCRIPTION.rst
index cf4391432..2b73a88a3 100644
--- a/web_responsive/readme/DESCRIPTION.rst
+++ b/web_responsive/readme/DESCRIPTION.rst
@@ -58,4 +58,20 @@ Features for computers:
* Sticky chatter topbar
- .. image:: ./static/img/chatter_topbar.gif
+ .. image:: ../static/img/chatter_topbar.gif
+
+* AppMenu waits for action finished to show the view
+
+ .. image:: ../static/img/appmenu.gif
+
+* Sticky header & footer in list view
+
+ .. image:: ../static/img/listview.gif
+
+* Sticky statusbar in form view
+
+ .. image:: ../static/img/formview.gif
+
+* Followers and send button is displayed on mobile. Avatar is hidden.
+
+ .. image:: ../static/img/chatter.gif
diff --git a/web_responsive/static/description/index.html b/web_responsive/static/description/index.html
index d38086eaa..979f020cc 100644
--- a/web_responsive/static/description/index.html
+++ b/web_responsive/static/description/index.html
@@ -418,6 +418,18 @@ See Sticky chatter topbar
+AppMenu waits for action finished to show the view
+
+
+Sticky header & footer in list view
+
+
+Sticky statusbar in form view
+
+
+Followers and send button is displayed on mobile. Avatar is hidden.
+
+
Table of contents
diff --git a/web_responsive/static/img/appmenu.gif b/web_responsive/static/img/appmenu.gif
new file mode 100644
index 000000000..411937bc2
Binary files /dev/null and b/web_responsive/static/img/appmenu.gif differ
diff --git a/web_responsive/static/img/chatter.gif b/web_responsive/static/img/chatter.gif
new file mode 100644
index 000000000..0a2af93d2
Binary files /dev/null and b/web_responsive/static/img/chatter.gif differ
diff --git a/web_responsive/static/img/formview.gif b/web_responsive/static/img/formview.gif
new file mode 100644
index 000000000..688bbc9f9
Binary files /dev/null and b/web_responsive/static/img/formview.gif differ
diff --git a/web_responsive/static/img/listview.gif b/web_responsive/static/img/listview.gif
new file mode 100644
index 000000000..ebdcac8a9
Binary files /dev/null and b/web_responsive/static/img/listview.gif differ
diff --git a/web_responsive/static/src/css/web_responsive.scss b/web_responsive/static/src/css/web_responsive.scss
index 565d146eb..b61c6c2a1 100644
--- a/web_responsive/static/src/css/web_responsive.scss
+++ b/web_responsive/static/src/css/web_responsive.scss
@@ -172,7 +172,6 @@
.o-app-icon {
height: auto;
max-width: 7rem;
- width: 100%;
}
// Search input for menus
@@ -216,6 +215,8 @@ html .o_web_client .o_main .o_main_content {
overflow: initial;
}
}
+
+ max-width: 100%;
}
// Control panel (breadcrumbs, search box, buttons...)
@@ -328,6 +329,30 @@ html .o_web_client .o_main .o_main_content {
.o_form_view {
.o_form_sheet {
max-width: calc(100% - 32px);
+ overflow-x: scroll;
+ }
+
+ // Sticky statusbar
+ .o_form_statusbar {
+ position: sticky;
+ top: 0;
+ z-index: 1;
+ }
+
+ // Support for long title (with ellipsis)
+ .oe_title {
+ width: initial;
+
+ span {
+ max-width: 100%;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+ width: initial;
+ }
+ span:active {
+ white-space: normal;
+ }
}
@include media-breakpoint-down(sm) {
@@ -398,19 +423,53 @@ html .o_web_client .o_main .o_main_content {
margin: 0;
}
}
+
+ .o_chatter {
+ // Display send button on small screens
+ .o_thread_composer {
+ padding-left: $o-mail-thread-avatar-size*0.5;
+
+ .o_composer_button_send {
+ display: initial !important; // Forced in core
+ }
+ .o_chatter_avatar {
+ display: none;
+ }
+ }
+
+ .o_chatter_topbar {
+ height: auto;
+ flex-wrap: wrap-reverse;
+
+ > .o_topbar_right_area {
+ flex: 1 0 auto;
+ flex-wrap: wrap;
+ max-width: 100%;
+
+ // Display followers on small screens
+ .o_followers {
+ display: initial !important; // Forced in core
+
+ @include media-breakpoint-down(xs) {
+ padding-bottom: 50px;
+ }
+ }
+ }
+ }
+ }
}
}
// Sided chatter, if user wants
.o_chatter_position_sided & {
- @include media-breakpoint-up(md) {
+ @include media-breakpoint-up(lg) {
.o_form_view:not(.o_form_nosheet) {
display: flex;
flex-flow: row nowrap;
height: 100%;
.o_form_sheet_bg {
- flex: 1 1 60%;
+ flex: 1 1 auto;
overflow: auto;
> .o_form_sheet {
@@ -420,9 +479,9 @@ html .o_web_client .o_main .o_main_content {
.o_chatter {
border-left: 1px solid gray('400');
- flex: 1 1 40%;
- max-width: 50%;
- min-width: 30%;
+ flex: 0 0 35%;
+ max-width: initial;
+ min-width: initial;
overflow: auto;
.o_chatter_header_container {
@@ -434,6 +493,18 @@ html .o_web_client .o_main .o_main_content {
.o_chatter_topbar {
margin-top: 0;
+ flex-wrap: wrap;
+ height: auto;
+ button:last-of-type {
+ flex: 1 0 auto;
+ text-align: left;
+ }
+
+ .o_topbar_right_area {
+ order: -10;
+ flex: 0 1 100%;
+ border-bottom-color: transparent;
+ }
}
.o_attachments_previews {
@@ -446,3 +517,32 @@ html .o_web_client .o_main .o_main_content {
}
}
}
+
+// Sticky Header & Footer in List View
+.table-responsive {
+ overflow-x: initial;
+
+ .o_list_view {
+ // th & td are here for compatibility with chrome
+ thead, thead tr:nth-child(1) th {
+ position: sticky;
+ top: 0;
+ z-index: 1;
+ }
+ thead tr:nth-child(1) th {
+ background-color: $o-list-footer-bg-color;
+ }
+ tfoot, tfoot tr:nth-child(1) td {
+ position: sticky;
+ bottom: 0;
+ }
+ tfoot tr:nth-child(1) td {
+ background-color: $o-list-footer-bg-color;
+ }
+ }
+}
+
+// Waiting Cursor
+.oe_wait {
+ cursor: progress;
+}
diff --git a/web_responsive/static/src/js/web_responsive.js b/web_responsive/static/src/js/web_responsive.js
index 387bdaf42..f128f2c59 100644
--- a/web_responsive/static/src/js/web_responsive.js
+++ b/web_responsive/static/src/js/web_responsive.js
@@ -4,6 +4,7 @@
odoo.define('web_responsive', function (require) {
'use strict';
+ var ActionManager = require('web.ActionManager');
var AbstractWebClient = require("web.AbstractWebClient");
var AppsMenu = require("web.AppsMenu");
var config = require("web.config");
@@ -76,6 +77,7 @@ odoo.define('web_responsive', function (require) {
"click .o-menu-search-result": "_searchResultChosen",
"shown.bs.dropdown": "_searchFocus",
"hidden.bs.dropdown": "_searchReset",
+ "hide.bs.dropdown": "_hideAppsMenu",
}, AppsMenu.prototype.events),
/**
@@ -194,6 +196,7 @@ odoo.define('web_responsive', function (require) {
*/
_searchResultChosen: function (event) {
event.preventDefault();
+ event.stopPropagation();
var $result = $(event.currentTarget),
text = $result.text().trim(),
data = $result.data(),
@@ -264,6 +267,13 @@ odoo.define('web_responsive', function (require) {
},
});
},
+
+ /*
+ * Control if AppDrawer can be closed
+ */
+ _hideAppsMenu: function () {
+ return $('.oe_wait').length === 0 && !this.$('input').is(':focus');
+ },
});
Menu.include({
@@ -273,6 +283,8 @@ odoo.define('web_responsive', function (require) {
// Opening any dropdown in the navbar should hide the hamburger
"show.bs.dropdown .o_menu_systray, .o_menu_apps":
"_hideMobileSubmenus",
+ // Prevent close section menu
+ "hide.bs.dropdown .o_menu_sections": "_hideMenuSection",
}, Menu.prototype.events),
start: function () {
@@ -286,12 +298,22 @@ odoo.define('web_responsive', function (require) {
_hideMobileSubmenus: function () {
if (
this.$menu_toggle.is(":visible") &&
- this.$section_placeholder.is(":visible")
+ this.$section_placeholder.is(":visible") &&
+ $('.oe_wait').length === 0
) {
this.$section_placeholder.collapse("hide");
}
},
+ /**
+ * Hide Menu Section
+ *
+ * @returns {Boolean}
+ */
+ _hideMenuSection: function () {
+ return $('.oe_wait').length === 0;
+ },
+
/**
* No menu brand in mobiles
*
@@ -358,7 +380,39 @@ odoo.define('web_responsive', function (require) {
} else {
this._super.apply(this, arguments);
}
- }
+ },
+ });
+
+ // Hide AppDrawer or Menu when the action has been completed
+ ActionManager.include({
+
+ /**
+ * Because the menu aren't closed when click, this method
+ * searchs for the menu with the action executed to close it.
+ *
+ * @param {action} action
+ * The executed action
+ */
+ _hideMenusByAction: function (action) {
+ var uniq_sel = '[data-action-id='+action.id+']';
+ // Need close AppDrawer?
+ $(_.str.sprintf(
+ '.o_menu_apps .dropdown:has(.dropdown-menu.show:has(%s)) > a',
+ uniq_sel)).dropdown('toggle');
+ // Need close Sections Menu?
+ // TODO: Change to 'hide' in modern Bootstrap >4.1
+ $(_.str.sprintf(
+ '.o_menu_sections li.show:has(%s) .dropdown-toggle', uniq_sel))
+ .dropdown('toggle');
+ // Need close Mobile?
+ $(_.str.sprintf('.o_menu_sections.show:has(%s)', uniq_sel))
+ .collapse('hide');
+ },
+
+ _handleAction: function (action) {
+ return this._super.apply(this, arguments).always(
+ $.proxy(this, '_hideMenusByAction', action));
+ },
});
/**