When the user tries to Start/Stop (up/down) a network, there is a lag in the backend, and it was possible to click on start/stop/delete again, and again, generating errors. This patch disables the buttons and shows loading gif to user, avoind this kind of error. Signed-off-by: Rodrigo Trujillo <rodrigo.trujillo@linux.vnet.ibm.com> --- ui/css/theme-default/network.css | 5 +++++ ui/js/src/kimchi.network.js | 14 ++++++++++---- 2 files changed, 15 insertions(+), 4 deletions(-) diff --git a/ui/css/theme-default/network.css b/ui/css/theme-default/network.css index 80640a3..67f2aa2 100644 --- a/ui/css/theme-default/network.css +++ b/ui/css/theme-default/network.css @@ -132,6 +132,11 @@ margin-left: 29px; } +.network .list .nw-loading { + background: #c0c0c0 url(../../images/theme-default/loading.gif) + center no-repeat; +} + .network .list .up { background: linear-gradient(to bottom, #BFD255 0%, #8EB92A 50%, #72AA00 51%, #9ECB2D 100%) repeat scroll 0 0 transparent; diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index 91324ee..7cedc01 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -84,20 +84,26 @@ kimchi.addNetworkActions = function(network) { $(".menu-container", "#" + network.name).toggle(false); var menu = $(evt.currentTarget).parent(); if ($(evt.currentTarget).attr("nwAct") === "start") { + $(".network-state", $("#" + network.name)).switchClass("down", "nw-loading"); + $("[nwAct='start']", menu).addClass("ui-state-disabled"); + $("[nwAct='delete']", menu).addClass("ui-state-disabled"); + $(":first-child", $("[nwAct='delete']", menu)).attr("disabled", true); kimchi.toggleNetwork(network.name, true, function() { $("[nwAct='start']", menu).addClass("hide-action-item"); + $("[nwAct='start']", menu).removeClass("ui-state-disabled"); $("[nwAct='stop']", menu).removeClass("hide-action-item"); - $("[nwAct='delete']", menu).addClass("ui-state-disabled"); - $(":first-child", $("[nwAct='delete']", menu)).attr("disabled", true); - $(".network-state", $("#" + network.name)).switchClass("down", "up"); + $(".network-state", $("#" + network.name)).switchClass("nw-loading", "up"); }); } else if ($(evt.currentTarget).attr("nwAct") === "stop") { + $(".network-state", $("#" + network.name)).switchClass("up", "nw-loading"); + $("[nwAct='stop']", menu).addClass("ui-state-disabled"); kimchi.toggleNetwork(network.name, false, function() { $("[nwAct='start']", menu).removeClass("hide-action-item"); $("[nwAct='stop']", menu).addClass("hide-action-item"); + $("[nwAct='stop']", menu).removeClass("ui-state-disabled"); $("[nwAct='delete']", menu).removeClass("ui-state-disabled"); $(":first-child", $("[nwAct='delete']", menu)).removeAttr("disabled"); - $(".network-state", $("#" + network.name)).switchClass("up", "down"); + $(".network-state", $("#" + network.name)).switchClass("nw-loading", "down"); }); } else if ($(evt.currentTarget).attr("nwAct") === "delete") { kimchi.confirm({ -- 1.8.5.3