Skip to content

Commit 9b06506

Browse files
authored
✨ [Frontend] Functions Browser (ITISFoundation#8116)
1 parent f976a56 commit 9b06506

File tree

23 files changed

+866
-168
lines changed

23 files changed

+866
-168
lines changed

services/static-webserver/client/source/class/osparc/dashboard/CardBase.js

Lines changed: 32 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ qx.Class.define("osparc.dashboard.CardBase", {
4949
"updateStudy": "qx.event.type.Data",
5050
"updateTemplate": "qx.event.type.Data",
5151
"updateTutorial": "qx.event.type.Data",
52+
"updateFunction": "qx.event.type.Data",
5253
"updateService": "qx.event.type.Data",
5354
"updateHypertool": "qx.event.type.Data",
5455
"publishTemplate": "qx.event.type.Data",
@@ -334,6 +335,7 @@ qx.Class.define("osparc.dashboard.CardBase", {
334335
check: [
335336
"study",
336337
"template",
338+
"function",
337339
"tutorial",
338340
"hypertool",
339341
"service",
@@ -535,6 +537,11 @@ qx.Class.define("osparc.dashboard.CardBase", {
535537
owner = resourceData.prjOwner ? resourceData.prjOwner : "";
536538
workbench = resourceData.workbench ? resourceData.workbench : {};
537539
break;
540+
case "function":
541+
uuid = resourceData.uuid ? resourceData.uuid : null;
542+
owner = "";
543+
workbench = resourceData.workbench ? resourceData.workbench : {};
544+
break;
538545
case "service":
539546
uuid = resourceData.key ? resourceData.key : null;
540547
owner = resourceData.owner ? resourceData.owner : resourceData.contact;
@@ -563,26 +570,31 @@ qx.Class.define("osparc.dashboard.CardBase", {
563570
workbench
564571
});
565572

566-
if ([
567-
"study",
568-
"template",
569-
"tutorial",
570-
"hypertool"
571-
].includes(resourceData["resourceType"])) {
572-
osparc.store.Services.getStudyServices(resourceData.uuid)
573-
.then(resp => {
574-
const services = resp["services"];
575-
resourceData["services"] = services;
576-
this.setServices(services);
577-
})
578-
.catch(err => {
579-
resourceData["services"] = null;
580-
this.setServices(null);
581-
console.error(err);
582-
});
573+
switch (resourceData["resourceType"]) {
574+
case "study":
575+
case "template":
576+
case "tutorial":
577+
case "hypertool": {
578+
osparc.store.Services.getStudyServices(resourceData.uuid)
579+
.then(resp => {
580+
const services = resp["services"];
581+
resourceData["services"] = services;
582+
this.setServices(services);
583+
})
584+
.catch(err => {
585+
resourceData["services"] = null;
586+
this.setServices(null);
587+
console.error(err);
588+
});
589+
590+
osparc.study.Utils.guessIcon(resourceData)
591+
.then(iconSource => this.setIcon(iconSource));
583592

584-
osparc.study.Utils.guessIcon(resourceData)
585-
.then(iconSource => this.setIcon(iconSource));
593+
break;
594+
}
595+
case "function":
596+
this.setIcon(osparc.data.model.StudyUI.PIPELINE_ICON);
597+
break;
586598
}
587599
},
588600

@@ -1081,6 +1093,7 @@ qx.Class.define("osparc.dashboard.CardBase", {
10811093
"updateStudy",
10821094
"updateTemplate",
10831095
"updateTutorial",
1096+
"updateFunction",
10841097
"updateService",
10851098
"updateHypertool",
10861099
].forEach(ev => {

services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -204,6 +204,7 @@ qx.Class.define("osparc.dashboard.GridButtonItem", {
204204
"template",
205205
"tutorial",
206206
"hypertool",
207+
"function",
207208
].includes(this.getResourceType())) {
208209
const dateBy = this.getChildControl("date-by");
209210
dateBy.set({

services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -282,6 +282,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
282282
resourcesContainer.addListener("updateStudy", e => this._updateStudyData(e.getData()));
283283
resourcesContainer.addListener("updateTemplate", e => this._updateTemplateData(e.getData()));
284284
resourcesContainer.addListener("updateTutorial", e => this._updateTutorialData(e.getData()));
285+
resourcesContainer.addListener("updateFunction", e => this._updateFunctionData(e.getData()));
285286
resourcesContainer.addListener("updateService", e => this._updateServiceData(e.getData()));
286287
resourcesContainer.addListener("updateHypertool", e => this._updateHypertoolData(e.getData()));
287288
resourcesContainer.addListener("publishTemplate", e => this.fireDataEvent("publishTemplate", e.getData()));
@@ -692,7 +693,11 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
692693
}
693694
},
694695

695-
updateTutorialData: function(tutorialData) {
696+
_updateTutorialData: function(tutorialData) {
697+
throw new Error("Abstract method called!");
698+
},
699+
700+
_updateFunctionData: function(functionData) {
696701
throw new Error("Abstract method called!");
697702
},
698703

@@ -926,6 +931,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
926931
resourceDetails.addListener("updateStudy", e => this._updateStudyData(e.getData()));
927932
resourceDetails.addListener("updateTemplate", e => this._updateTemplateData(e.getData()));
928933
resourceDetails.addListener("updateTutorial", e => this._updateTutorialData(e.getData()));
934+
resourceDetails.addListener("updateFunction", e => this._updateFunctionData(e.getData()));
929935
resourceDetails.addListener("updateService", e => this._updateServiceData(e.getData()));
930936
resourceDetails.addListener("updateHypertool", e => this._updateHypertoolData(e.getData()));
931937
resourceDetails.addListener("publishTemplate", e => {

services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserFilter.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserFilter", {
3636
events: {
3737
"templatesContext": "qx.event.type.Event",
3838
"publicTemplatesContext": "qx.event.type.Event",
39+
"functionsContext": "qx.event.type.Event",
3940
"trashContext": "qx.event.type.Event",
4041
"changeTab": "qx.event.type.Data",
4142
"trashStudyRequested": "qx.event.type.Data",
@@ -50,6 +51,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserFilter", {
5051
__workspacesAndFoldersTree: null,
5152
__templatesButton: null,
5253
__publicProjectsButton: null,
54+
__functionsButton: null,
5355
__trashButton: null,
5456
__sharedWithButtons: null,
5557
__tagButtons: null,
@@ -66,6 +68,9 @@ qx.Class.define("osparc.dashboard.ResourceBrowserFilter", {
6668
if (osparc.product.Utils.showPublicProjects()) {
6769
this._add(this.__createPublicProjects());
6870
}
71+
if (osparc.product.Utils.showFunctions()) {
72+
this._add(this.__createFunctions());
73+
}
6974
this._add(this.__createTrashBin());
7075
this._add(filtersSpacer);
7176
const scrollView = new qx.ui.container.Scroll();
@@ -102,6 +107,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserFilter", {
102107

103108
this.__templatesButton.setValue(context === osparc.dashboard.StudyBrowser.CONTEXT.TEMPLATES);
104109
this.__publicProjectsButton.setValue(context === osparc.dashboard.StudyBrowser.CONTEXT.PUBLIC_TEMPLATES);
110+
this.__functionsButton.setValue(context === osparc.dashboard.StudyBrowser.CONTEXT.FUNCTIONS);
105111
this.__trashButton.setValue(context === osparc.dashboard.StudyBrowser.CONTEXT.TRASH);
106112
},
107113

@@ -164,6 +170,24 @@ qx.Class.define("osparc.dashboard.ResourceBrowserFilter", {
164170
return publicProjectsButton;
165171
},
166172

173+
__createFunctions: function() {
174+
const functionsButton = this.__functionsButton = new qx.ui.toolbar.RadioButton().set({
175+
value: false,
176+
appearance: "filter-toggle-button",
177+
label: this.tr("Functions"),
178+
icon: "@MaterialIcons/functions/20",
179+
paddingLeft: 10, // align it with the context
180+
});
181+
osparc.utils.Utils.setIdToWidget(functionsButton, "functionsFilterItem");
182+
functionsButton.addListener("changeValue", e => {
183+
const functionsEnabled = e.getData();
184+
if (functionsEnabled) {
185+
this.fireEvent("functionsContext");
186+
}
187+
});
188+
return functionsButton;
189+
},
190+
167191
/* TRASH BIN */
168192
__createTrashBin: function() {
169193
const trashButton = this.__trashButton = new qx.ui.toolbar.RadioButton().set({

services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,7 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", {
7676
"updateStudy": "qx.event.type.Data",
7777
"updateTemplate": "qx.event.type.Data",
7878
"updateTutorial": "qx.event.type.Data",
79+
"updateFunction": "qx.event.type.Data",
7980
"updateService": "qx.event.type.Data",
8081
"updateHypertool": "qx.event.type.Data",
8182
"publishTemplate": "qx.event.type.Data",
@@ -161,6 +162,9 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", {
161162
case osparc.dashboard.StudyBrowser.CONTEXT.SEARCH_PUBLIC_TEMPLATES:
162163
text = this.tr("No Public Projects found");
163164
break;
165+
case osparc.dashboard.StudyBrowser.CONTEXT.FUNCTIONS:
166+
text = this.tr("No Functions found");
167+
break;
164168
}
165169
break;
166170
}
@@ -297,6 +301,7 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", {
297301
"updateStudy",
298302
"updateTemplate",
299303
"updateTutorial",
304+
"updateFunction",
300305
"updateService",
301306
"updateHypertool",
302307
"publishTemplate",

services/static-webserver/client/source/class/osparc/dashboard/ResourceDetails.js

Lines changed: 39 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,10 +33,13 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
3333
latestPromise = osparc.store.Study.getInstance().getOne(resourceData["uuid"]);
3434
break;
3535
}
36-
case "function": {
36+
case "functionedTemplate": {
3737
latestPromise = osparc.store.Templates.fetchTemplate(resourceData["uuid"]);
3838
break;
3939
}
40+
case "function":
41+
latestPromise = osparc.store.Functions.fetchFunction(resourceData["uuid"]);
42+
break;
4043
case "service": {
4144
latestPromise = osparc.store.Services.getService(resourceData["key"], resourceData["version"]);
4245
break;
@@ -57,7 +60,7 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
5760
case "template":
5861
case "tutorial":
5962
case "hypertool":
60-
case "function":
63+
case "functionedTemplate":
6164
// when getting the latest study data, the debt information was lost
6265
if (osparc.study.Utils.isInDebt(this.__resourceData)) {
6366
const studyStore = osparc.store.Study.getInstance();
@@ -69,8 +72,20 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
6972
this.__resourceModel["resourceType"] = resourceData["resourceType"];
7073
this.__resourceData["services"] = resourceData["services"];
7174
this.__addPages();
72-
})
75+
});
7376
break;
77+
case "function": {
78+
// use function's underlying template info to fetch services metadata
79+
// osparc.store.Templates.fetchTemplate(resourceData["uuid"]);
80+
osparc.store.Services.getStudyServicesMetadata(latestResourceData)
81+
.finally(() => {
82+
this.__resourceModel = new osparc.data.model.Function(latestResourceData);
83+
this.__resourceModel["resourceType"] = resourceData["resourceType"];
84+
this.__resourceData["services"] = resourceData["services"];
85+
this.__addPages();
86+
});
87+
break;
88+
}
7489
case "service": {
7590
this.__resourceModel = new osparc.data.model.Service(latestResourceData);
7691
this.__resourceModel["resourceType"] = resourceData["resourceType"];
@@ -92,6 +107,7 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
92107
"updateStudy": "qx.event.type.Data",
93108
"updateTemplate": "qx.event.type.Data",
94109
"updateTutorial": "qx.event.type.Data",
110+
"updateFunction": "qx.event.type.Data",
95111
"updateService": "qx.event.type.Data",
96112
"updateHypertool": "qx.event.type.Data",
97113
"publishTemplate": "qx.event.type.Data",
@@ -157,6 +173,10 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
157173
__addToolbarButtons: function(page) {
158174
const resourceData = this.__resourceData;
159175

176+
if (this.__resourceData["resourceType"] === "function") {
177+
return; // no toolbar buttons for functions
178+
}
179+
160180
const toolbar = this.self().createToolbar();
161181
page.addToHeader(toolbar);
162182

@@ -370,11 +390,17 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
370390
// removeAll
371391
osparc.utils.Utils.removeAllChildren(tabsView);
372392

373-
if (this.__resourceData["resourceType"] === "function") {
393+
if (this.__resourceData["resourceType"] === "functionedTemplate") {
374394
// for now, we only want the preview page
375395
this.__addPreviewPage();
376396
this.fireEvent("pagesAdded");
377397
return;
398+
} else if (this.__resourceData["resourceType"] === "function") {
399+
this.__addInfoPage();
400+
// to build the preview page we need the underlying template data
401+
// this.__addPreviewPage();
402+
this.fireEvent("pagesAdded");
403+
return;
378404
}
379405

380406
this.__addInfoPage();
@@ -417,6 +443,9 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
417443
case "tutorial":
418444
this.fireDataEvent("updateTutorial", updatedData);
419445
break;
446+
case "function":
447+
this.fireDataEvent("updateFunction", updatedData);
448+
break;
420449
case "hypertool":
421450
this.fireDataEvent("updateHypertool", updatedData);
422451
break;
@@ -448,6 +477,12 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
448477
const updatedData = e.getData();
449478
this.__fireUpdateEvent(resourceData, updatedData);
450479
});
480+
} else if (osparc.utils.Resources.isFunction(resourceData)) {
481+
infoCard = new osparc.info.FunctionLarge(resourceModel);
482+
infoCard.addListener("updateFunction", e => {
483+
const updatedData = e.getData();
484+
this.__fireUpdateEvent(resourceData, updatedData);
485+
});
451486
} else {
452487
infoCard = new osparc.info.StudyLarge(resourceModel, false);
453488
infoCard.addListener("updateStudy", e => {

0 commit comments

Comments
 (0)