diff --git a/services/static-webserver/client/source/class/osparc/data/model/IframeHandler.js b/services/static-webserver/client/source/class/osparc/data/model/IframeHandler.js index 1dd46c13b134..9620c80daf18 100644 --- a/services/static-webserver/client/source/class/osparc/data/model/IframeHandler.js +++ b/services/static-webserver/client/source/class/osparc/data/model/IframeHandler.js @@ -115,7 +115,7 @@ qx.Class.define("osparc.data.model.IframeHandler", { const nodeStatus = node.getStatus(); const sequenceWidget = nodeStatus.getProgressSequence().getWidgetForLoadingPage(); nodeStatus.bind("interactive", sequenceWidget, "visibility", { - converter: state => ["starting", "pulling", "pending", "connecting"].includes(state) ? "visible" : "excluded" + converter: state => ["pending", "pulling", "starting", "connecting"].includes(state) ? "visible" : "excluded" }); loadingPage.addExtraWidget(sequenceWidget); @@ -189,6 +189,8 @@ qx.Class.define("osparc.data.model.IframeHandler", { const nodeId = data["service_uuid"]; const node = this.getNode(); const status = node.getStatus(); + const loadingPage = this.getLoadingPage(); + loadingPage.clearMessages(); switch (serviceState) { case "idle": { status.setInteractive(serviceState); @@ -200,8 +202,14 @@ qx.Class.define("osparc.data.model.IframeHandler", { } case "pending": { if (data["service_message"]) { - const serviceName = node.getLabel(); const serviceMessage = data["service_message"]; + loadingPage.setMessages([serviceMessage]); + // show pending messages only after 10" + loadingPage.getMessageLabels().forEach(label => label.exclude()); + setTimeout(() => { + loadingPage.getMessageLabels().forEach(label => label.show()); + }, 10000); + const serviceName = node.getLabel(); const msg = `The service "${serviceName}" is waiting for available ` + `resources. Please inform support and provide the following message ` + `in case this does not resolve in a few minutes: "${nodeId}" ` + diff --git a/services/static-webserver/client/source/class/osparc/data/model/Node.js b/services/static-webserver/client/source/class/osparc/data/model/Node.js index c04e32ab64ef..b52c08dbf25e 100644 --- a/services/static-webserver/client/source/class/osparc/data/model/Node.js +++ b/services/static-webserver/client/source/class/osparc/data/model/Node.js @@ -1108,6 +1108,11 @@ qx.Class.define("osparc.data.model.Node", { if (nodeStatus.getProgressSequence()) { nodeStatus.getProgressSequence().addProgressMessage(progressType, progressReport); } + // there might be some pending ``service_message`` still shown, remove it + if (this.getIframeHandler()) { + const loadingPage = this.getIframeHandler().getLoadingPage(); + loadingPage.clearMessages(); + } }, attachHandlersToStartButton: function(startButton) { diff --git a/services/static-webserver/client/source/class/osparc/data/model/NodeProgressSequence.js b/services/static-webserver/client/source/class/osparc/data/model/NodeProgressSequence.js index 27c04a156b9d..d15270613b26 100644 --- a/services/static-webserver/client/source/class/osparc/data/model/NodeProgressSequence.js +++ b/services/static-webserver/client/source/class/osparc/data/model/NodeProgressSequence.js @@ -22,6 +22,7 @@ * [CLUSTER_UP_SCALING] * [SIDECARS_PULLING] * [SERVICE_OUTPUTS_PULLING, SERVICE_STATE_PULLING, SERVICE_IMAGES_PULLING] (notice the parallelism here) + * [SERVICE_CONTAINERS_STARTING] * [SERVICE_INPUTS_PULLING] (when this happens, the frontend has already loaded the service and is displaying it to the user) I would still keep it as is, when we decide to make inputs pulling part of the boot sequence this will be helpful. * * This class provides different widgets that render the progress status diff --git a/services/static-webserver/client/source/class/osparc/ui/message/Loading.js b/services/static-webserver/client/source/class/osparc/ui/message/Loading.js index 550b336820f2..bfd238cd9e21 100644 --- a/services/static-webserver/client/source/class/osparc/ui/message/Loading.js +++ b/services/static-webserver/client/source/class/osparc/ui/message/Loading.js @@ -93,7 +93,7 @@ qx.Class.define("osparc.ui.message.Loading", { __mainLayout: null, __thumbnail: null, __header: null, - __messages: null, + __messagesContainer: null, __extraWidgets: null, __maxButton: null, @@ -162,7 +162,7 @@ qx.Class.define("osparc.ui.message.Loading", { row: this.self().GRID_POS.WAITING }); - const messages = this.__messages = new qx.ui.container.Composite(new qx.ui.layout.VBox(10).set({ + const messages = this.__messagesContainer = new qx.ui.container.Composite(new qx.ui.layout.VBox(10).set({ alignX: "center" })); mainLayout.addAt(messages, { @@ -236,24 +236,28 @@ qx.Class.define("osparc.ui.message.Loading", { rich: true, wrap: true }); - this.__messages.add(text); + this.__messagesContainer.add(text); }); - this.__messages.show(); + this.__messagesContainer.show(); } else { - this.__messages.exclude(); + this.__messagesContainer.exclude(); } }, clearMessages: function() { - this.__messages.removeAll(); + this.__messagesContainer.removeAll(); + }, + + getMessageLabels: function() { + return this.__messagesContainer.getChildren(); }, addWidgetToMessages: function(widget) { if (widget) { - this.__messages.add(widget); - this.__messages.show(); + this.__messagesContainer.add(widget); + this.__messagesContainer.show(); } else { - this.__messages.exclude(); + this.__messagesContainer.exclude(); } },