From ab6b651ac9bd71ac2e67ab6ed53d7a46798356ac Mon Sep 17 00:00:00 2001 From: Aleksander Machniak Date: Thu, 25 Oct 2018 13:13:02 +0200 Subject: [PATCH] - Make menu button inactive if all subactions are inactive (#6444) Elastic skin only (for now) --- CHANGELOG | 1 + program/include/rcmail_output_html.php | 3 +- program/js/app.js | 47 ++++++++++++++++++++++++++ skins/elastic/styles/styles.less | 4 +++ skins/elastic/templates/compose.html | 8 ++--- skins/elastic/templates/mail.html | 4 +-- skins/elastic/ui.js | 13 +++++-- 7 files changed, 71 insertions(+), 9 deletions(-) diff --git a/CHANGELOG b/CHANGELOG index 103bc6770..3b29d310a 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -11,6 +11,7 @@ CHANGELOG Roundcube Webmail - Password: Added 'modoboa' driver (#6361) - Password: Fix bug where password_dovecotpw_with_method setting could be ignored (#6436) - Password: Fix bug where new users could skip forced password change (#6434) +- Elastic: Make menu button inactive if all subactions are inactive (#6444) - Elastic: On mobile/tablet jump to the list on folder selection (#6415) - Elastic: Various improvements on mail compose screen (#6413) - Elastic: Support new-line char as a separator for pasted recipients (#6460) diff --git a/program/include/rcmail_output_html.php b/program/include/rcmail_output_html.php index 56fef3cee..09502e1fc 100644 --- a/program/include/rcmail_output_html.php +++ b/program/include/rcmail_output_html.php @@ -1628,8 +1628,9 @@ EOF; else if ($attrib['type'] == 'link') { $btn_content = isset($attrib['content']) ? $attrib['content'] : ($attrib['label'] ? $attrib['label'] : $attrib['command']); $link_attrib = array_merge(html::$common_attrib, array('href', 'onclick', 'tabindex', 'target', 'rel')); - if ($attrib['innerclass']) + if ($attrib['innerclass']) { $btn_content = html::span($attrib['innerclass'], $btn_content); + } } else if ($attrib['type'] == 'input') { $attrib['type'] = 'button'; diff --git a/program/js/app.js b/program/js/app.js index 7d3811f6b..81ad61618 100644 --- a/program/js/app.js +++ b/program/js/app.js @@ -47,6 +47,7 @@ function rcube_webmail() this.group2expand = {}; this.http_request_jobs = {}; this.menu_stack = []; + this.menu_buttons = []; this.entity_selectors = []; this.image_style = {}; @@ -121,6 +122,47 @@ function rcube_webmail() this.init_button(command, button_prop); }; + // register a button with popup menu, to set its state according to the state of all commands in the menu + this.register_menu_button = function(button, menu_id) + { + var commands = []; + + $('#' + menu_id).find('a').each(function() { + var command, link = $(this), onclick = link.attr('onclick'); + + if (onclick && String(onclick).match(/rcmail\.command\(\'([^']+)/)) + command = RegExp.$1; + else + command = function() { return link.is('.active'); }; + + commands.push(command); + }); + + if (commands.length) + this.menu_buttons.push([button, commands]); + + this.set_menu_buttons(); + }; + + // set state of a menu button according to state of all menu actions + this.set_menu_buttons = function() + { + // Use timeouts to not block and set menu button states only once + clearTimeout(this.menu_buttons_timeout); + this.menu_buttons_timeout = setTimeout(function() { + $.each(ref.menu_buttons, function() { + var disabled = true; + $.each(this[1], function() { + var is_func = typeof(this) == 'function'; + if ((is_func && this()) || (!is_func && ref.commands[this])) { + return disabled = false; + } + }); + $(this[0]).addClass(disabled ? 'disabled' : 'active').removeClass(disabled ? 'active' : 'disabled'); + }); + }, 50); + }; + // register a specific gui object this.gui_object = function(name, id) { @@ -666,6 +708,9 @@ function rcube_webmail() this.onloads[n](); } + // register menu buttons + $('[data-popup]').each(function() { ref.register_menu_button(this, $(this).data('popup')); }); + // start keep-alive and refresh intervals this.start_refresh(); this.start_keepalive(); @@ -1463,6 +1508,8 @@ function rcube_webmail() args.push(cmd[i]); } } + + this.set_menu_buttons(); }; this.command_enabled = function(cmd) diff --git a/skins/elastic/styles/styles.less b/skins/elastic/styles/styles.less index 2316db40a..55be46301 100644 --- a/skins/elastic/styles/styles.less +++ b/skins/elastic/styles/styles.less @@ -111,6 +111,10 @@ a { color: @color-link-hover; } + &.disabled { + pointer-events: none; + } + &.disabled:not(.btn) { opacity: .5; } diff --git a/skins/elastic/templates/compose.html b/skins/elastic/templates/compose.html index 6c77265f5..016ff4c9c 100644 --- a/skins/elastic/templates/compose.html +++ b/skins/elastic/templates/compose.html @@ -229,10 +229,10 @@

diff --git a/skins/elastic/templates/mail.html b/skins/elastic/templates/mail.html index 42962e98d..9d033aaa8 100644 --- a/skins/elastic/templates/mail.html +++ b/skins/elastic/templates/mail.html @@ -32,9 +32,9 @@