Skip to content

Commit eaeddc5

Browse files
odeimaizodeimaiz
committed
FunctionLarge
1 parent 71ab85d commit eaeddc5

File tree

4 files changed

+210
-5
lines changed

4 files changed

+210
-5
lines changed

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

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -166,6 +166,10 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
166166
__addToolbarButtons: function(page) {
167167
const resourceData = this.__resourceData;
168168

169+
if (this.__resourceData["resourceType"] === "function") {
170+
return; // no toolbar buttons for functions
171+
}
172+
169173
const toolbar = this.self().createToolbar();
170174
page.addToHeader(toolbar);
171175

@@ -386,7 +390,7 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
386390
return;
387391
} else if (this.__resourceData["resourceType"] === "function") {
388392
this.__addInfoPage();
389-
this.__addPreviewPage();
393+
// this.__addPreviewPage();
390394
this.fireEvent("pagesAdded");
391395
return;
392396
}
@@ -462,6 +466,13 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
462466
const updatedData = e.getData();
463467
this.__fireUpdateEvent(resourceData, updatedData);
464468
});
469+
} else if (osparc.utils.Resources.isFunction(resourceData)) {
470+
infoCard = new osparc.info.FunctionLarge(resourceModel);
471+
infoCard.addListener("updateFunction", e => {
472+
const updatedData = e.getData();
473+
this.__fireUpdateEvent(resourceData, updatedData);
474+
});
475+
infoCard.addListener("openTags", () => this.openTags());
465476
} else {
466477
infoCard = new osparc.info.StudyLarge(resourceModel, false);
467478
infoCard.addListener("updateStudy", e => {

‎services/static-webserver/client/source/class/osparc/info/FunctionLarge.js‎

Lines changed: 194 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,194 @@
1+
/* ************************************************************************
2+
3+
osparc - the simcore frontend
4+
5+
https://osparc.io
6+
7+
Copyright:
8+
2025 IT'IS Foundation, https://itis.swiss
9+
10+
License:
11+
MIT: https://opensource.org/licenses/MIT
12+
13+
Authors:
14+
* Odei Maiz (odeimaiz)
15+
16+
************************************************************************ */
17+
18+
19+
qx.Class.define("osparc.info.FunctionLarge", {
20+
extend: osparc.info.CardLarge,
21+
22+
/**
23+
* @param func {osparc.data.model.Function} Function model
24+
*/
25+
construct: function(func) {
26+
this.base(arguments);
27+
28+
this.setFunction(func);
29+
30+
this.setOpenOptions(false);
31+
32+
this._attachHandlers();
33+
},
34+
35+
events: {
36+
"updateFunction": "qx.event.type.Data",
37+
},
38+
39+
properties: {
40+
function: {
41+
check: "osparc.data.model.Function",
42+
init: null,
43+
nullable: false
44+
}
45+
},
46+
47+
members: {
48+
__canIWrite: function() {
49+
// return osparc.data.model.Function.canIWrite(this.getFunction().getAccessRights());
50+
return true;
51+
},
52+
53+
_rebuildLayout: function() {
54+
this._removeAll();
55+
56+
const vBox = new qx.ui.container.Composite(new qx.ui.layout.VBox(10));
57+
58+
const infoElements = this.__infoElements();
59+
const isStudy = true;
60+
const infoLayout = osparc.info.Utils.infoElementsToLayout(infoElements, isStudy);
61+
vBox.add(infoLayout);
62+
63+
// Copy Id button
64+
const text = "Function Id";
65+
const copyIdButton = new qx.ui.form.Button(null, "@FontAwesome5Solid/copy/12").set({
66+
label: text,
67+
toolTipText: "Copy " + text,
68+
marginTop: 15,
69+
allowGrowX: false
70+
});
71+
copyIdButton.addListener("execute", () => osparc.utils.Utils.copyTextToClipboard(this.getFunction().getUuid()));
72+
vBox.add(copyIdButton);
73+
74+
// All in a scroll container
75+
const scrollContainer = new qx.ui.container.Scroll();
76+
scrollContainer.add(vBox);
77+
78+
this._add(scrollContainer, {
79+
flex: 1
80+
});
81+
},
82+
83+
__infoElements: function() {
84+
const canIWrite = this.__canIWrite();
85+
86+
const infoLayout = {
87+
"TITLE": {
88+
view: osparc.info.StudyUtils.createTitle(this.getFunction()),
89+
action: {
90+
button: osparc.utils.Utils.getEditButton(canIWrite),
91+
callback: canIWrite ? this.__openTitleEditor : null,
92+
ctx: this
93+
}
94+
},
95+
"THUMBNAIL": {
96+
view: this.__createThumbnail(),
97+
action: null
98+
},
99+
"DESCRIPTION": {
100+
view: osparc.info.StudyUtils.createDescription(this.getFunction()),
101+
action: {
102+
button: osparc.utils.Utils.getEditButton(canIWrite),
103+
callback: canIWrite ? this.__openDescriptionEditor : null,
104+
ctx: this
105+
}
106+
},
107+
/*
108+
"AUTHOR": {
109+
label: this.tr("Author"),
110+
view: osparc.info.StudyUtils.createOwner(this.getFunction()),
111+
action: null
112+
},
113+
*/
114+
"ACCESS_RIGHTS": {
115+
label: this.tr("Access"),
116+
view: osparc.info.StudyUtils.createAccessRights(this.getFunction()),
117+
action: {
118+
button: osparc.utils.Utils.getLinkButton(canIWrite),
119+
callback: this.isOpenOptions() ? this.__openAccessRights : "openAccessRights",
120+
ctx: this
121+
}
122+
},
123+
"CREATED": {
124+
label: this.tr("Created"),
125+
view: osparc.info.StudyUtils.createCreationDate(this.getFunction()),
126+
action: null
127+
},
128+
"MODIFIED": {
129+
label: this.tr("Modified"),
130+
view: osparc.info.StudyUtils.createLastChangeDate(this.getFunction()),
131+
action: null
132+
},
133+
};
134+
return infoLayout;
135+
},
136+
137+
__createThumbnail: function() {
138+
const maxWidth = 190;
139+
const maxHeight = 220;
140+
const thumb = osparc.info.StudyUtils.createThumbnail(this.getFunction(), maxWidth, maxHeight);
141+
thumb.set({
142+
maxWidth: 120,
143+
maxHeight: 139
144+
});
145+
thumb.getChildControl("image").set({
146+
width: 120,
147+
height: 139,
148+
scale: true,
149+
});
150+
151+
return thumb;
152+
},
153+
154+
__openTitleEditor: function() {
155+
const title = this.tr("Edit Title");
156+
const titleEditor = new osparc.widget.Renamer(this.getFunction().getName(), null, title);
157+
titleEditor.addListener("labelChanged", e => {
158+
titleEditor.close();
159+
const newLabel = e.getData()["newLabel"];
160+
this.__patchFunction("name", newLabel);
161+
}, this);
162+
titleEditor.center();
163+
titleEditor.open();
164+
},
165+
166+
__openDescriptionEditor: function() {
167+
const title = this.tr("Edit Description");
168+
const textEditor = new osparc.editor.MarkdownEditor(this.getStudy().getDescription());
169+
textEditor.setMaxHeight(570);
170+
const win = osparc.ui.window.Window.popUpInWindow(textEditor, title, 400, 300);
171+
textEditor.addListener("textChanged", e => {
172+
win.close();
173+
const newDescription = e.getData();
174+
this.__patchFunction("description", newDescription);
175+
}, this);
176+
textEditor.addListener("cancel", () => {
177+
win.close();
178+
}, this);
179+
},
180+
181+
__patchFunction: function(fieldKey, value) {
182+
this.getStudy().patchStudy({[fieldKey]: value})
183+
.then(studyData => {
184+
studyData["resourceType"] = this.getStudy().getTemplateType() ? "template" : "study";
185+
this.fireDataEvent("updateStudy", studyData);
186+
qx.event.message.Bus.getInstance().dispatchByName("updateStudy", studyData);
187+
})
188+
.catch(err => {
189+
const msg = this.tr("An issue occurred while updating the information.");
190+
osparc.FlashMessenger.logError(err, msg);
191+
});
192+
}
193+
}
194+
});

‎services/static-webserver/client/source/class/osparc/info/StudyLarge.js‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -236,10 +236,6 @@ qx.Class.define("osparc.info.StudyLarge", {
236236
return infoLayout;
237237
},
238238

239-
__createStudyId: function() {
240-
return osparc.info.StudyUtils.createUuid(this.getStudy());
241-
},
242-
243239
__createThumbnail: function() {
244240
const maxWidth = 190;
245241
const maxHeight = 220;

‎services/static-webserver/client/source/class/osparc/utils/Resources.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,10 @@ qx.Class.define("osparc.utils.Resources", {
3939
return ((hypertoolData["resourceType"] === "hypertool") && ("uuid" in hypertoolData));
4040
},
4141

42+
isFunction: function(functionData) {
43+
return ((functionData["resourceType"] === "function") && ("uuid" in functionData));
44+
},
45+
4246
isService: function(serviceData) {
4347
return ((serviceData["resourceType"] === "service") && ("key" in serviceData) && ("version" in serviceData));
4448
},

0 commit comments

Comments
 (0)