Skip to content

Commit 9d7e144

Browse files
odeimaizodeimaiz
authored
🎨 [Frontend] TIP v3 Feedback (#5980)
1 parent ad25d00 commit 9d7e144

File tree

14 files changed

+375
-174
lines changed

14 files changed

+375
-174
lines changed

‎services/static-webserver/client/Manifest.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
"requires": {
4242
"@qooxdoo/compiler": "^1.0.0-beta",
4343
"@qooxdoo/framework": "^6.0.0-beta",
44-
"ITISFoundation/qx-iconfont-fontawesome5": "^0.2.0",
44+
"ITISFoundation/qx-iconfont-fontawesome5": "^1.0.0",
4545
"ITISFoundation/qx-osparc-theme": "^0.5.6",
4646
"qooxdoo/qxl.testtapper": "^0.4.3",
4747
"qooxdoo/qxl.apiviewer": "^1.0.0-beta",

‎services/static-webserver/client/qx-lock.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@
22
"libraries": [
33
{
44
"library_name": "qx-iconfont-fontawesome5",
5-
"library_version": "0.2.0",
6-
"path": "qx_packages/ITISFoundation_qx-iconfont-fontawesome5_v0_2_0",
5+
"library_version": "1.0.0",
6+
"path": "qx_packages/ITISFoundation_qx-iconfont-fontawesome5_v1_0_0",
77
"uri": "ITISFoundation/qx-iconfont-fontawesome5",
88
"repo_name": "ITISFoundation/qx-iconfont-fontawesome5",
9-
"repo_tag": "v0.2.0"
9+
"repo_tag": "v1.0.0"
1010
},
1111
{
1212
"library_name": "qx-osparc-theme",

‎services/static-webserver/client/source/class/osparc/auth/ui/LoginView.js

+22
Original file line numberDiff line numberDiff line change
@@ -132,6 +132,28 @@ qx.Class.define("osparc.auth.ui.LoginView", {
132132
`;
133133
const disclaimer = osparc.announcement.AnnouncementUIFactory.createLoginAnnouncement(this.tr("Disclaimer"), text);
134134
this.add(disclaimer);
135+
136+
this.add(new qx.ui.core.Spacer(), {
137+
flex: 1
138+
});
139+
140+
const poweredByLayout = new qx.ui.container.Composite(new qx.ui.layout.VBox()).set({
141+
alignX: "center",
142+
allowGrowX: false,
143+
cursor: "pointer"
144+
});
145+
poweredByLayout.addListener("tap", () => window.open("https://sim4life.swiss/"));
146+
const label = new qx.ui.basic.Label(this.tr("powered by"));
147+
poweredByLayout.add(label);
148+
const s4lLogo = new qx.ui.basic.Image("osparc/Sim4Life_full_logo_white.svg");
149+
s4lLogo.set({
150+
width: osparc.auth.LoginPage.LOGO_WIDTH/2,
151+
height: osparc.auth.LoginPage.LOGO_HEIGHT/2,
152+
scale: true,
153+
alignX: "center"
154+
});
155+
poweredByLayout.add(s4lLogo);
156+
this.add(poweredByLayout);
135157
}
136158
},
137159

‎services/static-webserver/client/source/class/osparc/auth/ui/RequestAccount.js

+87-68
Original file line numberDiff line numberDiff line change
@@ -52,40 +52,48 @@ qx.Class.define("osparc.auth.ui.RequestAccount", {
5252
});
5353
this._form.add(lastName, this.tr("Last Name"), null, "lastName");
5454

55+
5556
const email = new qx.ui.form.TextField().set({
5657
required: true
5758
});
58-
if (
59-
osparc.product.Utils.isProduct("s4lacad") ||
60-
osparc.product.Utils.isProduct("s4ldesktopacad")
61-
) {
62-
this._form.add(email, this.tr("University Email"), qx.util.Validate.email(), "email");
63-
} else {
64-
this._form.add(email, this.tr("Email"), qx.util.Validate.email(), "email");
59+
switch (osparc.product.Utils.getProductName()) {
60+
case "s4l":
61+
case "tis":
62+
this._form.add(email, this.tr("Email"), qx.util.Validate.email(), "email");
63+
break;
64+
case "s4lacad":
65+
case "s4ldesktopacad":
66+
this._form.add(email, this.tr("University Email"), qx.util.Validate.email(), "email");
67+
break;
6568
}
6669

6770
const phone = new qx.ui.form.TextField();
6871
this._form.add(phone, this.tr("Phone Number"), null, "phone");
6972

70-
if (
71-
osparc.product.Utils.isProduct("s4lacad") ||
72-
osparc.product.Utils.isProduct("s4ldesktopacad")
73-
) {
74-
const university = new qx.ui.form.TextField();
75-
doubleSpaced.push(university);
76-
this._form.add(university, this.tr("University"), null, "university");
77-
} else {
78-
const company = new qx.ui.form.TextField();
79-
doubleSpaced.push(company);
80-
this._form.add(company, this.tr("Company Name"), null, "company");
73+
74+
const organization = new qx.ui.form.TextField();
75+
doubleSpaced.push(organization);
76+
switch (osparc.product.Utils.getProductName()) {
77+
case "s4l":
78+
this._form.add(organization, this.tr("Company Name"), null, "company");
79+
break;
80+
case "s4lacad":
81+
case "s4ldesktopacad":
82+
this._form.add(organization, this.tr("University"), null, "university");
83+
break;
84+
case "tis":
85+
this._form.add(organization, this.tr("Organization"), null, "organization");
86+
break;
8187
}
8288

89+
8390
const address = new qx.ui.form.TextField().set({
8491
required: true
8592
});
8693
doubleSpaced.push(address);
8794
this._form.add(address, this.tr("Address"), null, "address");
8895

96+
8997
const city = new qx.ui.form.TextField().set({
9098
required: true
9199
});
@@ -96,6 +104,7 @@ qx.Class.define("osparc.auth.ui.RequestAccount", {
96104
});
97105
this._form.add(postalCode, this.tr("Postal code"), null, "postalCode");
98106

107+
99108
const country = new qx.ui.form.SelectBox().set({
100109
required: true
101110
});
@@ -117,58 +126,67 @@ qx.Class.define("osparc.auth.ui.RequestAccount", {
117126
});
118127
this._form.add(country, this.tr("Country"), null, "country");
119128

120-
const application = new qx.ui.form.SelectBox();
121-
[{
122-
id: "Antenna_Design_for_Wireless_Communication",
123-
label: "Antenna Design for Wireless Communication"
124-
}, {
125-
id: "Bioelectronics,_Electroceuticals_and_Neuroprosthetics",
126-
label: "Bioelectronics, Electroceuticals & Neuroprosthetics"
127-
}, {
128-
id: "Safety_and_Efficacy_Assessment",
129-
label: "Safety & Efficacy Assessment"
130-
}, {
131-
id: "Exposure_and_Compliance",
132-
label: "Exposure & Compliance"
133-
}, {
134-
id: "Focused_Ultrasound",
135-
label: "Focused Ultrasound"
136-
}, {
137-
id: "In_Silico_Trials",
138-
label: "In <i>Silico</i> Trials"
139-
}, {
140-
id: "Implant_Design",
141-
label: "Implant Design"
142-
}, {
143-
id: "Magnetic_Resonance_Imaging",
144-
label: "Magnetic Resonance Imaging"
145-
}, {
146-
id: "Neurostimulation",
147-
label: "Neurostimulation"
148-
}, {
149-
id: "Personalized_Medicine",
150-
label: "Personalized Medicine"
151-
}, {
152-
id: "Thermal_Therapies",
153-
label: "Thermal Therapies"
154-
}, {
155-
id: "Wireless_Power_Transfer_Systems",
156-
label: "Wireless Power Transfer Systems"
157-
}, {
158-
id: "Vascular_Flow_and_Perfusion",
159-
label: "Vascular Flow & Perfusion"
160-
}].forEach(appData => {
161-
const lItem = new qx.ui.form.ListItem(appData.label, null, appData.id).set({
162-
rich: true
129+
130+
if (
131+
osparc.product.Utils.isProduct("s4l") ||
132+
osparc.product.Utils.isProduct("s4lacad") ||
133+
osparc.product.Utils.isProduct("s4ldesktopacad")
134+
) {
135+
const application = new qx.ui.form.SelectBox();
136+
[{
137+
id: "Antenna_Design_for_Wireless_Communication",
138+
label: "Antenna Design for Wireless Communication"
139+
}, {
140+
id: "Bioelectronics,_Electroceuticals_and_Neuroprosthetics",
141+
label: "Bioelectronics, Electroceuticals & Neuroprosthetics"
142+
}, {
143+
id: "Safety_and_Efficacy_Assessment",
144+
label: "Safety & Efficacy Assessment"
145+
}, {
146+
id: "Exposure_and_Compliance",
147+
label: "Exposure & Compliance"
148+
}, {
149+
id: "Focused_Ultrasound",
150+
label: "Focused Ultrasound"
151+
}, {
152+
id: "In_Silico_Trials",
153+
label: "In <i>Silico</i> Trials"
154+
}, {
155+
id: "Implant_Design",
156+
label: "Implant Design"
157+
}, {
158+
id: "Magnetic_Resonance_Imaging",
159+
label: "Magnetic Resonance Imaging"
160+
}, {
161+
id: "Neurostimulation",
162+
label: "Neurostimulation"
163+
}, {
164+
id: "Personalized_Medicine",
165+
label: "Personalized Medicine"
166+
}, {
167+
id: "Thermal_Therapies",
168+
label: "Thermal Therapies"
169+
}, {
170+
id: "Wireless_Power_Transfer_Systems",
171+
label: "Wireless Power Transfer Systems"
172+
}, {
173+
id: "Vascular_Flow_and_Perfusion",
174+
label: "Vascular Flow & Perfusion"
175+
}].forEach(appData => {
176+
const lItem = new qx.ui.form.ListItem(appData.label, null, appData.id).set({
177+
rich: true
178+
});
179+
application.add(lItem);
163180
});
164-
application.add(lItem);
165-
});
166-
doubleSpaced.push(application);
167-
this._form.add(application, this.tr("Application"), null, "application");
181+
doubleSpaced.push(application);
182+
this._form.add(application, this.tr("Application"), null, "application");
183+
184+
185+
const description = new qx.ui.form.TextField();
186+
doubleSpaced.push(description);
187+
this._form.add(description, this.tr("Description"), null, "description");
188+
}
168189

169-
const description = new qx.ui.form.TextField();
170-
doubleSpaced.push(description);
171-
this._form.add(description, this.tr("Description"), null, "description");
172190

173191
const hear = new qx.ui.form.SelectBox();
174192
[{
@@ -193,6 +211,7 @@ qx.Class.define("osparc.auth.ui.RequestAccount", {
193211
doubleSpaced.push(hear);
194212
this._form.add(hear, this.tr("How did you hear about us?"), null, "hear");
195213

214+
196215
// accept links
197216
// Privacy Policy link
198217
let ppLink = osparc.CookiePolicy.getS4LPrivacyPolicyLink("our privacy policy");

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

+2-1
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {
4848
SPACING: 15,
4949
// TITLE_MAX_HEIGHT: 34, // two lines in Roboto
5050
TITLE_MAX_HEIGHT: 40, // two lines in Manrope
51+
ICON_SIZE: 50,
5152
POS: {
5253
TITLE: {
5354
row: 0,
@@ -287,7 +288,7 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {
287288
// overridden
288289
_applyIcon: function(value, old) {
289290
if (value.includes("@FontAwesome5Solid/")) {
290-
value += "50";
291+
value += this.self().ICON_SIZE;
291292
const image = this.getChildControl("icon").getChildControl("image");
292293
image.set({
293294
source: value

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

+30-1
Original file line numberDiff line numberDiff line change
@@ -140,12 +140,41 @@ qx.Class.define("osparc.dashboard.NewStudies", {
140140
},
141141

142142
__createCard: function(templateInfo) {
143+
const newStudyClicked = () => this.fireDataEvent("newStudyClicked", templateInfo);
144+
143145
const title = templateInfo.title;
144146
const desc = templateInfo.description;
145147
const newPlanButton = new osparc.dashboard.GridButtonNew(title, desc);
146148
newPlanButton.setCardKey(templateInfo.idToWidget);
147149
osparc.utils.Utils.setIdToWidget(newPlanButton, templateInfo.idToWidget);
148-
newPlanButton.addListener("execute", () => this.fireDataEvent("newStudyClicked", templateInfo))
150+
if (templateInfo.billable) {
151+
osparc.desktop.credits.Utils.setCreditsIconToButton(newPlanButton);
152+
newPlanButton.addListener("execute", () => {
153+
const store = osparc.store.Store.getInstance();
154+
const credits = store.getContextWallet().getCreditsAvailable()
155+
const preferencesSettings = osparc.Preferences.getInstance();
156+
const warningThreshold = preferencesSettings.getCreditsWarningThreshold();
157+
if (credits <= warningThreshold) {
158+
const msg = this.tr("This Plan requires Credits to run Sim4Life powered simulations. You can top up in the Billing Center.");
159+
const win = new osparc.ui.window.Confirmation(msg).set({
160+
caption: this.tr("Credits required"),
161+
confirmText: this.tr("Start, I'll get them later"),
162+
confirmAction: "create"
163+
});
164+
win.center();
165+
win.open();
166+
win.addListener("close", () => {
167+
if (win.getConfirmed()) {
168+
this.fireDataEvent("newStudyClicked", templateInfo);
169+
}
170+
});
171+
} else {
172+
newStudyClicked();
173+
}
174+
});
175+
} else {
176+
newPlanButton.addListener("execute", () => newStudyClicked());
177+
}
149178
return newPlanButton;
150179
},
151180

0 commit comments

Comments
 (0)