[PATCH v2] [Wok] Issue #79: All error messages should keep on UI until user dismiss it
From: Samuel Guimarães <sguimaraes943@gmail.com> This commit makes all messages closeable by default, removing the fade animation after 10 seconds. A parameter to allow a custom ID for each alert was also added to wok.message function. v2: - Fixed an issue where some alerts were not dismissible; - This commit also fixes a bug where alert "close" buttons would close modal windows. Samuel Guimarães (1): Issue #79: All error messages should keep on UI until user dismiss it ui/js/src/wok.message.js | 69 +++++++++++++++++++++++++----------------------- ui/js/src/wok.window.js | 2 +- 2 files changed, 37 insertions(+), 34 deletions(-) -- 1.8.3.1
From: Samuel Guimarães <sguimaraes943@gmail.com> This commit also fixes a bug where alert "close" buttons would close modal windows. Signed-off-by: Samuel Guimarães <sguimaraes943@gmail.com> --- ui/js/src/wok.message.js | 69 +++++++++++++++++++++++++----------------------- ui/js/src/wok.window.js | 2 +- 2 files changed, 37 insertions(+), 34 deletions(-) diff --git a/ui/js/src/wok.message.js b/ui/js/src/wok.message.js index e4c2ebd..159dc36 100644 --- a/ui/js/src/wok.message.js +++ b/ui/js/src/wok.message.js @@ -18,53 +18,56 @@ * limitations under the License. */ -wok.message = function(msg, level, node, closeable, onclick) { +wok.message = function(msg, level, node, closeable, onclick, alertId) { "use strict"; + var close = closeable || true; var container = node || $('#alert-fields'); - if ($(container).size() < 1) { - container = $('<div id="alert-fields"/>').appendTo($('#alert-container')); - } - var message = '<div role="alert" class="alert ' + (level || '') + ' alert-dismissible fade in" style="display: none;">'; - if(!node || closeable) { - message += '<button type="button" class="close" data-dismiss="alert" aria-label="Close" onclick="' + (onclick || '') + '"><span aria-hidden="true"><i class="fa fa-times-circle"></i></span></button>'; - } - message += msg; - message += '</div>'; - var $message = $(message); - $(container).show(); - $(container).append($message); - $message.alert(); - $message.fadeIn(100); + if($("#" + alertId).length === 0) { + if ($(container).size() < 1) { + container = $('<div id="alert-fields"/>').appendTo($('#alert-container')); + } + var message = '<div '+( alertId ? 'id="'+alertId+'"' : '')+' role="alert" class="alert ' + (level || '') + ' '+( close ? 'alert-dismissible' : '')+' fade in" style="display: none;">'; + if(!node || close) { + message += '<button type="button" class="close" data-dismiss="alert" aria-label="Close" onclick="' + (onclick || '') + '"><span aria-hidden="true"><i class="fa fa-times-circle"></i></span></button>'; + } + message += msg; + message += '</div>'; + var $message = $(message); + $(container).show(); + $(container).append($message); + $message.alert(); + $message.fadeIn(100); - if(!closeable){ - var timeout = setTimeout(function() { - $message.delay(4000).fadeOut(100, function() { - $message.alert('close'); - $(this).remove(); - if ($(container).children().length < 1) { - $(container).hide(); - } - }); - }, 10000); + if(!close){ + var timeout = setTimeout(function() { + $message.delay(4000).fadeOut(100, function() { + $message.alert('close'); + $(this).remove(); + if ($(container).children().length < 1) { + $(container).hide(); + } + }); + }, 10000); + } } }; -wok.message.warn = function(msg, node, closeable) { +wok.message.warn = function(msg, node, closeable, alertId) { "use strict"; - wok.message(msg, 'alert-warning', node, closeable); + wok.message(msg, 'alert-warning', node, closeable, null, alertId); }; -wok.message.error = function(msg, node, closeable) { +wok.message.error = function(msg, node, closeable, alertId) { "use strict"; - wok.message(msg, 'alert-danger', node, closeable); + wok.message(msg, 'alert-danger', node, closeable, null, alertId); }; -wok.message.error.code = function(code, node, closeable) { +wok.message.error.code = function(code, node, closeable, alertId) { "use strict"; var msg = code + ": " + i18n[code]; - wok.message(msg, 'alert-danger', node, closeable); + wok.message(msg, 'alert-danger', node, closeable, null, alertId); }; -wok.message.success = function(msg, node, closeable) { +wok.message.success = function(msg, node, closeable, alertId) { "use strict"; - wok.message(msg, 'alert-success', node, closeable); + wok.message(msg, 'alert-success', node, closeable, null, alertId); }; wok.message.notify = function(notification, node) { "use strict"; diff --git a/ui/js/src/wok.window.js b/ui/js/src/wok.window.js index 1386e09..b021605 100644 --- a/ui/js/src/wok.window.js +++ b/ui/js/src/wok.window.js @@ -49,7 +49,7 @@ wok.window = (function() { $('#' + windowID).remove(); }); - $(windowNode).appendTo('#' + target).on('click', '.window .close', function() { + $(windowNode).appendTo('#' + target).on('click', '.modal-header > .close', function() { wok.window.close(); }); -- 1.8.3.1
Reviewed-by: Socorro Stoppler <socorro@linux.vnet.ibm.com> Tested-by: Socorro Stoppler <socorro@linux.vnet.ibm.com> On 06/23/2016 06:40 AM, sguimaraes943@gmail.com wrote:
From: Samuel Guimarães <sguimaraes943@gmail.com>
This commit makes all messages closeable by default, removing the fade animation after 10 seconds. A parameter to allow a custom ID for each alert was also added to wok.message function.
v2: - Fixed an issue where some alerts were not dismissible; - This commit also fixes a bug where alert "close" buttons would close modal windows.
Samuel Guimarães (1): Issue #79: All error messages should keep on UI until user dismiss it
ui/js/src/wok.message.js | 69 +++++++++++++++++++++++++----------------------- ui/js/src/wok.window.js | 2 +- 2 files changed, 37 insertions(+), 34 deletions(-)
participants (3)
-
Aline Manera -
sguimaraes943＠gmail.com -
Socorro Stoppler