Skip to content

Commit 3f764f1

Browse files
odeimaizodeimaiz
authored
Parameters in frontend (#2434)
- Parameters Editor - Parameters Ease assignment - Specific NodeUI for Parameters - Instead of "in"/"out" ports, a small open circle for unconnected nodes or dot-filled circle for connected ones - Show full node name with cursor hover if the name is too long - Turn into FilePicker UI improved
1 parent 96fdddd commit 3f764f1

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+1171
-645
lines changed

‎services/director-v2/tests/unit/test_db_comp_tasks.py‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,7 @@ def test_only_filepicker_service_gets_some_service_details(
5959
EXCLUDE = [
6060
"simcore/services/frontend/nodes-group/macros/", # FIXME: PC->OM: This front-end service needs to be re-defined
6161
"simcore/services/frontend/nodes-group",
62+
"simcore/services/frontend/parameter/",
6263
]
6364
for frontend_service_key in all_frontend_services:
6465
if frontend_service_key in EXCLUDE:

‎services/web/client/source/class/osparc/auth/LoginPage.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ qx.Class.define("osparc.auth.LoginPage", {
4343
// Layout guarantees it gets centered in parent's page
4444
const layout = new qx.ui.layout.Grid(20, 20);
4545
layout.setRowFlex(1, 1);
46+
layout.setColumnFlex(0, 1);
4647
this._setLayout(layout);
4748

4849
const image = this._getLogoWPlatform();

‎services/web/client/source/class/osparc/component/form/Auto.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -511,6 +511,7 @@ qx.Class.define("osparc.component.form.Auto", {
511511
}
512512
control.key = key;
513513
control.description = s.description;
514+
control.type = s.type;
514515
control.widgetType = s.widget.type;
515516
control.unitShort = s.unitShort;
516517
control.unitLong = s.unitLong;

‎services/web/client/source/class/osparc/component/form/renderer/PropForm.js‎

Lines changed: 33 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
3434
events: {
3535
"linkFieldModified": "qx.event.type.Data",
3636
"filePickerRequested": "qx.event.type.Data",
37+
"parameterNodeRequested": "qx.event.type.Data",
3738
"changeChildVisibility": "qx.event.type.Event"
3839
},
3940

@@ -55,6 +56,15 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
5556
gridPos: {
5657
...osparc.component.form.renderer.PropFormBase.gridPos,
5758
retrieveStatus: Object.keys(osparc.component.form.renderer.PropFormBase.gridPos).length
59+
},
60+
61+
isFieldParametrizable: function(field) {
62+
const supportedTypes = [];
63+
const paramsMD = osparc.utils.Services.getParametersMetadata();
64+
paramsMD.forEach(paramMD => {
65+
supportedTypes.push(osparc.component.node.ParameterEditor.getParameterOutputTypeFromMD(paramMD));
66+
});
67+
return supportedTypes.includes(field.type);
5868
}
5969
},
6070

@@ -74,7 +84,7 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
7484
if (["FileButton"].includes(field.widgetType)) {
7585
return this.__getSelectFileButton(field.key);
7686
}
77-
if (["Number", "Spinner"].includes(field.widgetType)) {
87+
if (this.self().isFieldParametrizable(field)) {
7888
const paramsMenuBtn = this.__getParamsMenuButton(field.key).set({
7989
visibility: "excluded"
8090
});
@@ -104,14 +114,14 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
104114

105115
const newParamBtn = new qx.ui.menu.Button(this.tr("Set new parameter"));
106116
newParamBtn.addListener("execute", () => {
107-
this.__createNewParameter(portId);
117+
this.fireDataEvent("parameterNodeRequested", portId);
108118
}, this);
109119
paramsMenu.add(newParamBtn);
110120

111121
const existingParamMenu = new qx.ui.menu.Menu();
112122
this.__populateExistingParamsMenu(portId, existingParamMenu);
113123
const study = osparc.store.Store.getInstance().getCurrentStudy();
114-
study.getSweeper().addListener("changeParameters", () => {
124+
study.addListener("changeParameters", () => {
115125
this.__populateExistingParamsMenu(portId, existingParamMenu);
116126
}, this);
117127

@@ -128,35 +138,22 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
128138
return menuBtn;
129139
},
130140

131-
__createNewParameter: function(fieldKey) {
132-
const title = this.tr("Create new parameter");
133-
const newParamName = new osparc.component.widget.Renamer(null, null, title);
134-
newParamName.addListener("labelChanged", e => {
135-
const study = osparc.store.Store.getInstance().getCurrentStudy();
136-
let newParameterLabel = e.getData()["newLabel"];
137-
newParameterLabel = newParameterLabel.replace(/ /g, "_").replace(/"/g, "'");
138-
if (study.getSweeper().parameterLabelExists(newParameterLabel)) {
139-
const msg = this.tr("Parameter name already exists");
140-
osparc.component.message.FlashMessenger.getInstance().logAs(msg, "ERROR");
141-
} else {
142-
const param = study.getSweeper().addNewParameter(newParameterLabel);
143-
this.addParameter(fieldKey, param);
144-
newParamName.close();
145-
}
146-
}, this);
147-
newParamName.center();
148-
newParamName.open();
149-
},
150-
151141
__populateExistingParamsMenu: function(fieldKey, existingParamMenu) {
152142
existingParamMenu.removeAll();
153143
const study = osparc.store.Store.getInstance().getCurrentStudy();
154-
study.getSweeper().getParameters().forEach(param => {
155-
const paramButton = new qx.ui.menu.Button(param.label);
156-
paramButton.addListener("execute", () => {
157-
this.addParameter(fieldKey, param);
158-
}, this);
159-
existingParamMenu.add(paramButton);
144+
study.getParameters().forEach(paramNode => {
145+
osparc.utils.Ports.arePortsCompatible(paramNode, "out_1", this.getNode(), fieldKey)
146+
.then(compatible => {
147+
if (compatible) {
148+
const paramButton = new qx.ui.menu.Button();
149+
paramNode.bind("label", paramButton, "label");
150+
paramButton.addListener("execute", () => {
151+
this.getNode().addInputNode(paramNode.getNodeId());
152+
this.getNode().addPortLink(fieldKey, paramNode.getNodeId(), "out_1");
153+
}, this);
154+
existingParamMenu.add(paramButton);
155+
}
156+
});
160157
});
161158
},
162159

@@ -509,7 +506,7 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
509506

510507
const unlinkBtn = new qx.ui.form.Button(this.tr("Unlink"), "@FontAwesome5Solid/unlink/14");
511508
unlinkBtn.addListener("execute", function() {
512-
this.removeLink(portId);
509+
this.removePortLink(portId);
513510
}, this);
514511
hBox.add(unlinkBtn);
515512

@@ -530,7 +527,7 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
530527
}
531528
},
532529

533-
__linkRemoved: function(portId) {
530+
__portLinkRemoved: function(portId) {
534531
if (this.__resetCtrlField(portId)) {
535532
// enable fieldOpts button
536533
const fieldOpts = this._getFieldOptsChild(portId);
@@ -564,7 +561,7 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
564561
return links;
565562
},
566563

567-
addLink: function(toPortId, fromNodeId, fromPortId) {
564+
addPortLink: function(toPortId, fromNodeId, fromPortId) {
568565
if (!this.__isPortAvailable(toPortId)) {
569566
return false;
570567
}
@@ -588,21 +585,21 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
588585
return true;
589586
},
590587

591-
addLinks: function(data) {
588+
addPortLinks: function(data) {
592589
for (let key in data) {
593590
if (osparc.utils.Ports.isDataALink(data[key])) {
594-
this.addLink(key, data[key].nodeUuid, data[key].output);
591+
this.addPortLink(key, data[key].nodeUuid, data[key].output);
595592
}
596593
}
597594
},
598595

599-
removeLink: function(toPortId) {
596+
removePortLink: function(toPortId) {
600597
this.getControlLink(toPortId).setEnabled(false);
601598
if ("link" in this._form.getControl(toPortId)) {
602599
delete this._form.getControl(toPortId)["link"];
603600
}
604601

605-
this.__linkRemoved(toPortId);
602+
this.__portLinkRemoved(toPortId);
606603
},
607604
/* /LINKS */
608605

@@ -654,36 +651,6 @@ qx.Class.define("osparc.component.form.renderer.PropForm", {
654651
this.__resetCtrlField(portId);
655652
},
656653

657-
// overridden
658-
addParameter: function(portId, parameter) {
659-
if (!this.__isPortAvailable(portId)) {
660-
return false;
661-
}
662-
if (!parameter) {
663-
return false;
664-
}
665-
666-
this.getControlParam(portId).setEnabled(false);
667-
this._form.getControl(portId).parameter = parameter;
668-
// ToDo: Binding missing
669-
this.getControlParam(portId).setValue(this.tr("Parameter: ") + parameter.label);
670-
this.__parameterAdded(portId);
671-
return true;
672-
},
673-
674-
addParameters: function(data) {
675-
for (let key in data) {
676-
if (osparc.utils.Ports.isDataAParameter(data[key])) {
677-
const parameterId = data[key].replace("{{", "").replace("}}", "");
678-
const study = osparc.store.Store.getInstance().getCurrentStudy();
679-
const parameter = study.getSweeper().getParameter(parameterId);
680-
if (parameter) {
681-
this.addParameter(key, parameter);
682-
}
683-
}
684-
}
685-
},
686-
687654
removeParameter: function(portId) {
688655
this.getControlParam(portId).setEnabled(false);
689656
let ctrlField = this._form.getControl(portId);

‎services/web/client/source/class/osparc/component/form/renderer/PropFormBase.js‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -189,13 +189,6 @@ qx.Class.define("osparc.component.form.renderer.PropFormBase", {
189189
throw new Error("Abstract method called!");
190190
},
191191

192-
/**
193-
* @abstract
194-
*/
195-
addParameter: function() {
196-
throw new Error("Abstract method called!");
197-
},
198-
199192
_createInfoWHint: function(hint) {
200193
const infoWHint = new osparc.ui.hint.InfoHint(hint);
201194
return infoWHint;

‎services/web/client/source/class/osparc/component/form/tag/TagManager.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,7 @@ qx.Class.define("osparc.component.form.tag.TagManager", {
149149
const params = {
150150
url: {
151151
tagId,
152-
studyUuid: this.__resourceId
152+
studyId: this.__resourceId
153153
}
154154
};
155155
return osparc.data.Resources.fetch("studies", "addTag", params);
@@ -159,7 +159,7 @@ qx.Class.define("osparc.component.form.tag.TagManager", {
159159
const params = {
160160
url: {
161161
tagId,
162-
studyUuid: this.__resourceId
162+
studyId: this.__resourceId
163163
}
164164
};
165165
return osparc.data.Resources.fetch("studies", "removeTag", params);

‎services/web/client/source/class/osparc/component/metadata/ClassifiersEditor.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -148,7 +148,7 @@ qx.Class.define("osparc.component.metadata.ClassifiersEditor", {
148148
this.__studyData["classifiers"] = this.__classifiersTree.getCheckedClassifierIDs();
149149
const params = {
150150
url: {
151-
"projectId": this.__studyData["uuid"]
151+
"studyId": this.__studyData["uuid"]
152152
},
153153
data: this.__studyData
154154
};

‎services/web/client/source/class/osparc/component/metadata/QualityEditor.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -666,7 +666,7 @@ qx.Class.define("osparc.component.metadata.QualityEditor", {
666666
const isTemplate = osparc.utils.Resources.isTemplate(this.__copyResourceData);
667667
const params = {
668668
url: {
669-
projectId: this.__copyResourceData["uuid"]
669+
"studyId": this.__copyResourceData["uuid"]
670670
},
671671
data: this.__copyResourceData
672672
};

‎services/web/client/source/class/osparc/component/metadata/ServicesInStudy.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@ qx.Class.define("osparc.component.metadata.ServicesInStudy", {
7575

7676
const params = {
7777
url: {
78-
"projectId": this.__studyData["uuid"]
78+
"studyId": this.__studyData["uuid"]
7979
},
8080
data: this.__studyData
8181
};

0 commit comments

Comments
 (0)