diff --git a/services/static-webserver/client/source/class/osparc/dashboard/AppBrowser.js b/services/static-webserver/client/source/class/osparc/dashboard/AppBrowser.js index de4f2614836..e2ed9fc5314 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/AppBrowser.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/AppBrowser.js @@ -42,6 +42,7 @@ qx.Class.define("osparc.dashboard.AppBrowser", { } this._resourcesInitialized = true; + this._showLoadingPage(this.tr("Loading Apps...")); this._resourcesList = []; Promise.all([ osparc.store.Services.getServicesLatest(), @@ -63,19 +64,21 @@ qx.Class.define("osparc.dashboard.AppBrowser", { this.getChildControl("resources-layout"); this.reloadResources(); - this._hideLoadingPage(); }); }, reloadResources: function(useCache = true) { - this.__loadServices(); - this.__loadHypertools(useCache); + Promise.all([ + this.__loadServices(), + this.__loadHypertools(useCache), + ]) + .finally(() => this._hideLoadingPage()); }, __loadServices: function() { const excludeFrontend = true; const excludeDeprecated = true - osparc.store.Services.getServicesLatestList(excludeFrontend, excludeDeprecated) + return osparc.store.Services.getServicesLatestList(excludeFrontend, excludeDeprecated) .then(servicesList => { servicesList.forEach(service => service["resourceType"] = "service"); this._resourcesList.push(...servicesList.filter(service => service !== null)); @@ -84,7 +87,7 @@ qx.Class.define("osparc.dashboard.AppBrowser", { }, __loadHypertools: function(useCache = true) { - osparc.store.Templates.getHypertools(useCache) + return osparc.store.Templates.getHypertools(useCache) .then(hypertoolsList => { hypertoolsList.forEach(hypertool => hypertool["resourceType"] = "hypertool"); this._resourcesList.push(...hypertoolsList.filter(hypertool => hypertool !== null)); @@ -126,6 +129,8 @@ qx.Class.define("osparc.dashboard.AppBrowser", { this._populateCardMenu(card); }); osparc.filter.UIFilterController.dispatch("searchBarFilter"); + + this._resourcesContainer.evaluateNoResourcesFoundLabel(cards, this._resourceType); }, __itemClicked: function(card) { diff --git a/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js b/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js index cb83065b35f..5e9a2466309 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js @@ -209,7 +209,7 @@ qx.Class.define("osparc.dashboard.Dashboard", { selectedTab.resourceBrowser.initResources(); } else { const initTab = () => { - selectedTab.resourceBrowser.initResources() + selectedTab.resourceBrowser.initResources(); this.removeListener("preResourcesLoaded", initTab); }; this.addListener("preResourcesLoaded", initTab, this); diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js index fa516600a4f..09fe9f840a5 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js @@ -42,6 +42,13 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { this._add(foldersContainer); } + const noResourcesFound = this.__noResourcesFound = new qx.ui.basic.Label("No resources found").set({ + visibility: "excluded", + font: "text-14" + }); + noResourcesFound.exclude(); + this._add(noResourcesFound); + const nonGroupedContainer = this.__nonGroupedContainer = this.__createFlatList(); this._add(nonGroupedContainer); @@ -128,9 +135,38 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { __groupedContainersList: null, __foldersContainer: null, __workspacesContainer: null, + __noResourcesFound: null, __nonGroupedContainer: null, __groupedContainers: null, + evaluateNoResourcesFoundLabel: function(cards, context) { + if (this.__noResourcesFound) { + let text = null; + switch (context) { + case "studiesAndFolders": + case "search": + text = this.tr("No Projects found"); + break; + case "templates": + text = this.tr("No Templates found"); + break; + case "public": + text = this.tr("No Public Projects found"); + break; + case "template": + text = this.tr("No Tutorials found"); + break; + case "service": + text = this.tr("No Apps found"); + break; + } + this.__noResourcesFound.set({ + value: text, + visibility: text && cards.length === 0 ? "visible" : "excluded", + }); + } + }, + addNonResourceCard: function(card) { if (osparc.dashboard.CardContainer.isValidCard(card)) { let groupContainer = null; diff --git a/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js b/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js index b03288184a8..163be91a007 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js @@ -95,7 +95,6 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { __foldersList: null, __loadingFolders: null, __loadingWorkspaces: null, - __dragWidget: null, // overridden initResources: function() { @@ -104,6 +103,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { } this._resourcesInitialized = true; + this._showLoadingPage(this.tr("Loading Projects...")); this._resourcesList = []; this.__getActiveStudy() .then(() => { @@ -118,8 +118,6 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { } else { this.reloadResources(); } - // "Starting..." page - this._hideLoadingPage(); // since all the resources (templates, users, orgs...) were already loaded, notifications can be built osparc.data.Resources.get("notifications") @@ -150,10 +148,14 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { osparc.data.Permissions.getInstance().canDo("studies.user.read") && osparc.auth.Manager.getInstance().isLoggedIn() ) { - this.__reloadFolders(); - this.__reloadStudies(); + Promise.all([ + this.__reloadFolders(), + this.__reloadStudies(), + ]) + .finally(() => this._hideLoadingPage()); } else { this.__resetStudiesList(); + this._hideLoadingPage(); } }, @@ -235,7 +237,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { this.__loadingFolders = true; this.__setFoldersToList([]); - request + return request .then(folders => { this.__setFoldersToList(folders); if (this.getCurrentContext() === "trash") { @@ -267,7 +269,8 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { this._loadingResourcesBtn.setFetching(true); this._loadingResourcesBtn.setVisibility("visible"); - this.__getNextStudiesRequest() + this._resourcesContainer.evaluateNoResourcesFoundLabel([]); + return this.__getNextStudiesRequest() .then(resp => { // Context might have been changed while waiting for the response. // The new call is on the way, therefore this response can be ignored. @@ -341,7 +344,8 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { if (this._resourcesContainer.getFlatList()) { this._loadingResourcesBtn.setVisibility(this._resourcesContainer.getFlatList().nextRequest === null ? "excluded" : "visible"); } - this._moreResourcesRequired(); + // delay the next request to avoid flooding the server + setTimeout(() => this._moreResourcesRequired(), 100); }); }, @@ -415,6 +419,8 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { this._resourcesContainer.addNonResourceCard(loadMoreBtn); osparc.filter.UIFilterController.dispatch("searchBarFilter"); + + this._resourcesContainer.evaluateNoResourcesFoundLabel(cards, this.getCurrentContext()); }, __reloadNewCards: function() { @@ -423,6 +429,8 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { this.__configureStudyCards(cards); osparc.filter.UIFilterController.dispatch("searchBarFilter"); + + this._resourcesContainer.evaluateNoResourcesFoundLabel(cards, this.getCurrentContext()); }, // WORKSPACES diff --git a/services/static-webserver/client/source/class/osparc/dashboard/TutorialBrowser.js b/services/static-webserver/client/source/class/osparc/dashboard/TutorialBrowser.js index 78ae0e458a0..73c9cb69bdb 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/TutorialBrowser.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/TutorialBrowser.js @@ -34,21 +34,23 @@ qx.Class.define("osparc.dashboard.TutorialBrowser", { } this._resourcesInitialized = true; + this._showLoadingPage(this.tr("Loading Tutorials...")); osparc.store.Templates.getTutorials() .then(() => { this._resourcesList = []; this.getChildControl("resources-layout"); this.reloadResources(); this.__attachEventHandlers(); - this._hideLoadingPage(); }); }, reloadResources: function(useCache = true) { if (osparc.data.Permissions.getInstance().canDo("studies.templates.read")) { - this.__reloadTutorials(useCache); + this.__reloadTutorials(useCache) + .finally(() => this._hideLoadingPage()); } else { this.__setResourcesToList([]); + this._hideLoadingPage(); } }, @@ -65,8 +67,6 @@ qx.Class.define("osparc.dashboard.TutorialBrowser", { }, __tutorialStateReceived: function(templateId, state, errors) { - osparc.store.Templates.getTutorials() - // OM follow here const idx = this._resourcesList.findIndex(study => study["uuid"] === templateId); if (idx > -1) { this._resourcesList[idx]["state"] = state; @@ -83,9 +83,9 @@ qx.Class.define("osparc.dashboard.TutorialBrowser", { __reloadTutorials: function(useCache) { this.__tasksToCards(); - osparc.store.Templates.getTutorials(useCache) - .then(tutorials => this.__setResourcesToList(tutorials)) - .catch(() => this.__setResourcesToList([])); + return osparc.store.Templates.getTutorials(useCache) + .then(tutorials => this.__setResourcesToList(tutorials)) + .catch(() => this.__setResourcesToList([])); }, _updateTutorialData: function(templateData) { @@ -116,6 +116,8 @@ qx.Class.define("osparc.dashboard.TutorialBrowser", { }); this.__evaluateUpdateAllButton(); osparc.filter.UIFilterController.dispatch("searchBarFilter"); + + this._resourcesContainer.evaluateNoResourcesFoundLabel(cards, this._resourceType); }, __itemClicked: function(card) {