Browse Source

[IMP] web_responsive: Menu wait for action

pull/1279/merge
Alexandre Díaz 6 years ago
committed by OCA-git-bot
parent
commit
edaae02c9e
  1. 24
      web_responsive/static/src/css/web_responsive.scss
  2. 79
      web_responsive/static/src/js/web_responsive.js

24
web_responsive/static/src/css/web_responsive.scss

@ -22,6 +22,30 @@
.o-app-waiting img { .o-app-waiting img {
animation: 1.3s infinite cubic-bezier(.65,.05,.36,1) o-app-icon-flash-animation; animation: 1.3s infinite cubic-bezier(.65,.05,.36,1) o-app-icon-flash-animation;
} }
// Menu icon waiting indicator anim
@keyframes o-menu-item-flash-animation {
0% {
background-color: $dropdown-link-hover-bg;
}
25% {
background-color: transparent;
}
50% {
background-color: $dropdown-link-hover-bg;
}
75% {
background-color: transparent;
}
100% {
background-color: $dropdown-link-hover-bg;
}
}
.o-menu-item-waiting {
animation: 1.3s infinite cubic-bezier(.65,.05,.36,1) o-menu-item-flash-animation;
}
.o-cursor-waiting {
cursor: progress;
}
@mixin full-screen-dropdown { @mixin full-screen-dropdown {
border: none; border: none;

79
web_responsive/static/src/js/web_responsive.js

@ -275,7 +275,7 @@ odoo.define('web_responsive', function (require) {
this.$el.find('.o-app-waiting').removeClass( this.$el.find('.o-app-waiting').removeClass(
'o-app-waiting'); 'o-app-waiting');
$(ev.currentTarget).addClass('o-app-waiting'); $(ev.currentTarget).addClass('o-app-waiting');
document.body.style.cursor = 'progress';
$(document.body).addClass('o-cursor-waiting');
this._super.apply(this, arguments); this._super.apply(this, arguments);
}, },
}); });
@ -283,10 +283,13 @@ odoo.define('web_responsive', function (require) {
Menu.include({ Menu.include({
events: _.extend({ events: _.extend({
// Clicking a hamburger menu item should close the hamburger // Clicking a hamburger menu item should close the hamburger
"click .o_menu_sections [role=menuitem]": "_hideMobileSubmenus",
// and sets waiting menu-item
"click .o_menu_sections [role=menuitem]": "_clickMenuItem",
// Opening any dropdown in the navbar should hide the hamburger // Opening any dropdown in the navbar should hide the hamburger
"show.bs.dropdown .o_menu_systray, .o_menu_apps": "show.bs.dropdown .o_menu_systray, .o_menu_apps":
"_hideMobileSubmenus", "_hideMobileSubmenus",
// Prevent close section menu
"hide.bs.dropdown .o_menu_sections": "_hideMenuSection",
}, Menu.prototype.events), }, Menu.prototype.events),
start: function () { start: function () {
@ -306,6 +309,36 @@ odoo.define('web_responsive', function (require) {
} }
}, },
/**
* Menu Item Click Event
*
* @param {jQuery.Event} event
*/
_clickMenuItem: function (event) {
this._hideMobileSubmenus();
// Prevents anim more menu-item if user click other
// before action is fully loaded
this.$el.find('.o-menu-item-waiting').removeClass(
'o-menu-item-waiting');
$(document.body).addClass('o-cursor-waiting');
$(event.currentTarget).addClass('o-menu-item-waiting');
},
/**
* Hide Menu Section
*
* @param {jQuery.Event} event
* @returns {Boolean}
*/
_hideMenuSection: function (event) {
var $target = $(event.target);
var $selected = $target.find('.o-menu-item-waiting');
if ($selected.length) {
return false;
}
return true;
},
/** /**
* No menu brand in mobiles * No menu brand in mobiles
* *
@ -378,22 +411,52 @@ odoo.define('web_responsive', function (require) {
// Hide AppMenu & remove waiting anim when loaded action // Hide AppMenu & remove waiting anim when loaded action
ActionManager.include({ ActionManager.include({
doAction: function (action, options) { doAction: function (action, options) {
return this._super.apply(this, arguments).then(function () {
return this._super.apply(this, arguments).always(function () {
if (options && 'action_menu_id' in options) {
// Need hide AppMenu?
var $app_menu = $('.o_menu_apps .dropdown'); var $app_menu = $('.o_menu_apps .dropdown');
if ($app_menu.length && options &&
'action_menu_id' in options) {
if (!$app_menu.length) {
return;
}
var $app = $app_menu.find('.o_app.active'); var $app = $app_menu.find('.o_app.active');
var menu_id = $app.data('menuId');
if (menu_id === options.action_menu_id) {
var app_menu_id = $app.data('menuId');
if (app_menu_id === options.action_menu_id) {
// Now uses this way because Odoo 12.0 uses
// bootstrap 4.1
// TODO: Change to use "hide" method in modern
// bootstrap versions (>4.1)
if ($app_menu.hasClass('show')) { if ($app_menu.hasClass('show')) {
$app_menu.dropdown('toggle'); $app_menu.dropdown('toggle');
} }
document.body.style.cursor = 'default';
$(document.body).removeClass('o-cursor-waiting');
$app_menu.find('.o-app-waiting').removeClass( $app_menu.find('.o-app-waiting').removeClass(
'o-app-waiting'); 'o-app-waiting');
} }
} else if (action) {
// Need hide Menu?
var $menu = $('.o_menu_sections');
if (!$menu.length) {
return;
}
var $item = $menu.find('.o-menu-item-waiting');
if (!$item.length) {
return;
}
var action_id = $item.data('actionId');
if (action_id === action.id) {
$item.removeClass('o-menu-item-waiting');
$menu.find('li.show').each(
function (i, el) {
if ($.contains(el, $item[0])) {
$(el).find('.dropdown-toggle')
.dropdown('toggle');
}
});
$(document.body).removeClass('o-cursor-waiting');
}
} }
}); });
}, },

Loading…
Cancel
Save