diff --git a/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js b/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js index 6d5932f0007..11a68a7bfce 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/CardBase.js @@ -313,7 +313,7 @@ qx.Class.define("osparc.dashboard.CardBase", { }, workbench: { - check: "Object", + check: "osparc.data.model.Workbench", nullable: true, apply: "__applyWorkbench" }, @@ -403,49 +403,70 @@ qx.Class.define("osparc.dashboard.CardBase", { dragover : true }, + __resourceModel: null, + isResourceType: function(resourceType) { return this.getResourceType() === resourceType; }, __applyResourceData: function(resourceData) { - let uuid = null; - let owner = null; - let workbench = null; - let defaultHits = null; - switch (resourceData["resourceType"]) { - case "study": - uuid = resourceData.uuid ? resourceData.uuid : null; - owner = resourceData.prjOwner ? resourceData.prjOwner : ""; - workbench = resourceData.workbench ? resourceData.workbench : {}; - break; - case "template": - uuid = resourceData.uuid ? resourceData.uuid : null; - owner = resourceData.prjOwner ? resourceData.prjOwner : ""; - workbench = resourceData.workbench ? resourceData.workbench : {}; - break; - case "service": - uuid = resourceData.key ? resourceData.key : null; - owner = resourceData.owner ? resourceData.owner : ""; - defaultHits = 0; - break; + if (resourceData["resourceType"]) { + this.set({ + resourceType: resourceData.resourceType + }); + + let model = null; + switch (resourceData["resourceType"]) { + case "study": + case "template": + model = new osparc.data.model.Study(resourceData); + model["resourceType"] = resourceData["resourceType"]; + break; + case "service": + model = new osparc.data.model.Service(resourceData); + model["resourceType"] = resourceData["resourceType"]; + break; + } + if (model) { + this.__bindModelToCard(model); + } } + }, - this.set({ - resourceType: resourceData.resourceType, - uuid, - title: resourceData.name, - description: resourceData.description, - owner, - accessRights: resourceData.accessRights ? resourceData.accessRights : {}, - lastChangeDate: resourceData.lastChangeDate ? new Date(resourceData.lastChangeDate) : null, - icon: resourceData.thumbnail || this.self().PRODUCT_ICON, - state: resourceData.state ? resourceData.state : {}, - classifiers: resourceData.classifiers && resourceData.classifiers ? resourceData.classifiers : [], - quality: resourceData.quality ? resourceData.quality : null, - uiMode: resourceData.ui && resourceData.ui.mode ? resourceData.ui.mode : null, - hits: resourceData.hits ? resourceData.hits : defaultHits, - workbench - }); + getResourceModel: function() { + return this.__resourceModel; + }, + + __bindModelToCard: function(model) { + this.__resourceModel = model; + if (model instanceof osparc.data.model.Study) { + model.bind("uuid", this, "uuid"); + model.bind("name", this, "title"); + model.bind("description", this, "description"); + model.bind("workbench", this, "workbench"); + model.bind("prjOwner", this, "owner"); + model.bind("accessRights", this, "accessRights"); + model.bind("lastChangeDate", this, "lastChangeDate"); + model.bind("thumbnail", this, "icon", { + converter: t => t || this.self().PRODUCT_ICON + }); + model.bind("state", this, "state"); + model.bind("classifiers", this, "classifiers"); + model.bind("quality", this, "quality"); + model.getUi().bind("mode", this, "uiMode"); + } else if (model instanceof osparc.data.model.Service) { + model.bind("key", this, "uuid"); + model.bind("name", this, "title"); + model.bind("description", this, "description"); + model.bind("owner", this, "owner"); + model.bind("accessRights", this, "accessRights"); + model.bind("thumbnail", this, "icon", { + converter: t => t || this.self().PRODUCT_ICON + }); + model.bind("classifiers", this, "classifiers"); + model.bind("quality", this, "quality"); + model.bind("hits", this, "hits"); + } }, __applyUuid: function(value, old) { @@ -533,14 +554,15 @@ qx.Class.define("osparc.dashboard.CardBase", { return; } + const workbenchData = workbench.serialize(); if (this.isResourceType("study") || this.isResourceType("template")) { - this.setEmptyWorkbench(Object.keys(workbench).length === 0); + this.setEmptyWorkbench(Object.keys(workbenchData).length === 0); } // Updatable study - if (osparc.study.Utils.isWorkbenchRetired(workbench)) { + if (osparc.study.Utils.isWorkbenchRetired(workbenchData)) { this.setUpdatable("retired"); - } else if (osparc.study.Utils.isWorkbenchDeprecated(workbench)) { + } else if (osparc.study.Utils.isWorkbenchDeprecated(workbenchData)) { this.setUpdatable("deprecated"); } else { const updatable = osparc.study.Utils.isWorkbenchUpdatable(workbench) @@ -786,7 +808,7 @@ qx.Class.define("osparc.dashboard.CardBase", { }, __openMoreOptions: function() { - const resourceData = this.getResourceData(); + const resourceData = this.__resourceModel.serialize(); const resourceDetails = new osparc.dashboard.ResourceDetails(resourceData); const win = osparc.dashboard.ResourceDetails.popUpInWindow(resourceDetails); [ diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js index d1219cec8e8..65ba4195195 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js @@ -396,6 +396,16 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { return isLogged; }, + _updateCard: function(resourceData) { + const cards = this._resourcesContainer.getCards(); + const found = cards.filter(c => osparc.dashboard.ResourceBrowserBase.isCardButtonItem(c) && c.getUuid() === resourceData["uuid"]); + found.forEach(f => { + // since we are passing and object, the property change won't be triggered. reset the value first + f.setResourceData({}); + f.setResourceData(resourceData); + }); + }, + _removeResourceCards: function() { const cards = this._resourcesContainer.getCards(); for (let i=cards.length-1; i>=0; i--) { @@ -481,8 +491,8 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { return openButton; }, - _openResourceDetails: function(resourceData) { - const resourceDetails = new osparc.dashboard.ResourceDetails(resourceData); + _openResourceDetails: function(resourceData, resourceModel) { + const resourceDetails = new osparc.dashboard.ResourceDetails(resourceData, resourceModel); const win = osparc.dashboard.ResourceDetails.popUpInWindow(resourceDetails); resourceDetails.addListener("updateStudy", e => this._updateStudyData(e.getData())); resourceDetails.addListener("updateTemplate", e => this._updateTemplateData(e.getData())); diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceDetails.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceDetails.js index 2d645c68451..b29d27197bb 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceDetails.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceDetails.js @@ -18,10 +18,11 @@ qx.Class.define("osparc.dashboard.ResourceDetails", { extend: osparc.ui.window.TabbedView, - construct: function(resourceData) { + construct: function(resourceData, resourceModel) { this.base(arguments); this.__resourceData = resourceData; + this.__resourceModel = resourceModel; this.__resourceModel = null; switch (resourceData["resourceType"]) { @@ -136,6 +137,7 @@ qx.Class.define("osparc.dashboard.ResourceDetails", { this.__openResource(); return; } + this.__openButton.setFetching(true); const params = { url: { @@ -344,6 +346,7 @@ qx.Class.define("osparc.dashboard.ResourceDetails", { infoCard.addListener("openAccessRights", () => this.openAccessRights()); infoCard.addListener("openClassifiers", () => this.openClassifiers()); infoCard.addListener("openQuality", () => this.openQuality()); + page.addToContent(infoCard); } page.addListenerOnce("appear", lazyLoadContent, this); 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 a5904fda2a6..47c1ea15294 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js @@ -448,7 +448,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { if (!item.isMultiSelectionMode()) { const studyData = this.__getStudyData(item.getUuid(), false); - this._openResourceDetails(studyData); + this._openResourceDetails(studyData, item.getResourceModel()); this.resetSelection(); } }, @@ -996,7 +996,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { } else { studies[index] = studyData; } - this._reloadCards(); + this._updateCard(studyData); }, __removeFromStudyList: function(studyId) { diff --git a/services/static-webserver/client/source/class/osparc/dashboard/TemplateBrowser.js b/services/static-webserver/client/source/class/osparc/dashboard/TemplateBrowser.js index 8b7c62000de..24b1ded60c8 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/TemplateBrowser.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/TemplateBrowser.js @@ -127,7 +127,7 @@ qx.Class.define("osparc.dashboard.TemplateBrowser", { if (!card.isLocked()) { card.setValue(false); const templateData = this.__getTemplateData(card.getUuid()); - this._openResourceDetails(templateData); + this._openResourceDetails(templateData, card.getResourceModel()); } this.resetSelection(); },