Skip to content

Commit 95bf48b

Browse files
jsaq007odeimaiz
jsaq007
and
odeimaiz
authored
🎨 Default thumbnails for each product (ITISFoundation#5540)
Co-authored-by: Odei Maiz <[email protected]>
1 parent c90c741 commit 95bf48b

36 files changed

+372
-240
lines changed

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

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -53,12 +53,9 @@ qx.Class.define("osparc.auth.LoginPageS4L", {
5353
__setBackgroundImage: function() {
5454
let backgroundImage = "";
5555

56-
const defaultBG = "url(https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/full/background-images/S4L/Sim4Life-head-default.png)," +
57-
"url(https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/full/background-images/S4L/clouds_11.png)";
58-
const liteBG = "url(https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/full/background-images/S4L/Sim4Life-head-lite.png)," +
59-
"url(https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/full/background-images/S4L/clouds_11.png)";
60-
const academyBG = "url(https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/full/background-images/S4L/Sim4Life-head-academy.png)," +
61-
"url(https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/full/background-images/S4L/clouds_11.png)";
56+
const defaultBG = `url(${osparc.product.Utils.getProductBackgroundUrl("Sim4Life-head-default.png")}), url(${osparc.product.Utils.getProductBackgroundUrl("clouds_11.png")})`;
57+
const liteBG = `url(${osparc.product.Utils.getProductBackgroundUrl("Sim4Life-head-lite.png")}), url(${osparc.product.Utils.getProductBackgroundUrl("clouds_11.png")})`;
58+
const academyBG = `url(${osparc.product.Utils.getProductBackgroundUrl("Sim4Life-head-academy.png")}), url(${osparc.product.Utils.getProductBackgroundUrl("clouds_11.png")})`;
6259

6360
switch (osparc.product.Utils.getProductName()) {
6461
case "s4llite":

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

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -96,15 +96,17 @@ qx.Class.define("osparc.auth.ui.RegistrationView", {
9696

9797
const submitBtn = this.__submitBtn = new osparc.ui.form.FetchButton(this.tr("Submit")).set({
9898
center: true,
99-
appearance: "strong-button"
99+
appearance: "form-button"
100100
});
101101
osparc.utils.Utils.setIdToWidget(submitBtn, "registrationSubmitBtn");
102-
grp.add(submitBtn, {
102+
grp.addAt(submitBtn, 1, {
103103
flex:1
104104
});
105105

106-
const cancelBtn = this.__cancelBtn = new qx.ui.form.Button(this.tr("Cancel"));
107-
grp.add(cancelBtn, {
106+
const cancelBtn = this.__cancelBtn = new qx.ui.form.Button(this.tr("Cancel")).set({
107+
appearance: "form-button-text"
108+
});
109+
grp.addAt(cancelBtn, 0, {
108110
flex:1
109111
});
110112

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

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -223,15 +223,17 @@ qx.Class.define("osparc.auth.ui.RequestAccount", {
223223
const buttons = new qx.ui.container.Composite(new qx.ui.layout.HBox(5));
224224
const submitBtn = this.__requestButton = new qx.ui.form.Button(this.tr("Request")).set({
225225
center: true,
226-
appearance: "strong-button"
226+
appearance: "form-button"
227227
});
228228
osparc.utils.Utils.setIdToWidget(submitBtn, "registrationSubmitBtn");
229-
buttons.add(submitBtn, {
229+
buttons.addAt(submitBtn, 1, {
230230
flex:1
231231
});
232232

233-
const cancelBtn = this.__cancelButton = new qx.ui.form.Button(this.tr("Cancel"));
234-
buttons.add(cancelBtn, {
233+
const cancelBtn = this.__cancelButton = new qx.ui.form.Button(this.tr("Cancel")).set({
234+
appearance: "form-button-text"
235+
});
236+
buttons.addAt(cancelBtn, 0, {
235237
flex:1
236238
});
237239

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

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -57,14 +57,16 @@ qx.Class.define("osparc.auth.ui.ResetPassRequestView", {
5757

5858
const submitBtn = this.__submitBtn = new qx.ui.form.Button(this.tr("Submit")).set({
5959
center: true,
60-
appearance: "strong-button"
60+
appearance: "form-button"
6161
});
62-
grp.add(submitBtn, {
62+
grp.addAt(submitBtn, 1, {
6363
flex:1
6464
});
6565

66-
const cancelBtn = this.__cancelBtn = new qx.ui.form.Button(this.tr("Cancel"));
67-
grp.add(cancelBtn, {
66+
const cancelBtn = this.__cancelBtn = new qx.ui.form.Button(this.tr("Cancel")).set({
67+
appearance: "form-button-text"
68+
});
69+
grp.addAt(cancelBtn, 0, {
6870
flex:1
6971
});
7072

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

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,13 +67,17 @@ qx.Class.define("osparc.auth.ui.ResetPassView", {
6767
// buttons
6868
const grp = new qx.ui.container.Composite(new qx.ui.layout.HBox(10));
6969

70-
const submitBtn = new qx.ui.form.Button(this.tr("Submit"));
71-
grp.add(submitBtn, {
70+
const submitBtn = new qx.ui.form.Button(this.tr("Submit")).set({
71+
appearance: "form-button"
72+
});
73+
grp.addAt(submitBtn, 1, {
7274
flex:1
7375
});
7476

75-
const cancelBtn = new qx.ui.form.Button(this.tr("Cancel"));
76-
grp.add(cancelBtn, {
77+
const cancelBtn = new qx.ui.form.Button(this.tr("Cancel")).set({
78+
appearance: "form-button-text"
79+
});
80+
grp.addAt(cancelBtn, 0, {
7781
flex:1
7882
});
7983

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

Lines changed: 35 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -55,11 +55,12 @@ qx.Class.define("osparc.dashboard.CardBase", {
5555
MODE_APP: "@FontAwesome5Solid/desktop/13",
5656
NEW_ICON: "@FontAwesome5Solid/plus/",
5757
LOADING_ICON: "@FontAwesome5Solid/circle-notch/",
58-
STUDY_ICON: "resource/osparc/Thumbnail_Transparent.png",
59-
TEMPLATE_ICON: "resource/osparc/Thumbnail_Transparent.png",
60-
SERVICE_ICON: "resource/osparc/Thumbnail_Transparent.png",
61-
COMP_SERVICE_ICON: "resource/osparc/Thumbnail_Transparent.png",
62-
DYNAMIC_SERVICE_ICON: "resource/osparc/Thumbnail_Transparent.png",
58+
// Get the default thumbnail for each product else add the image and extension osparc.product.Utils.getProductThumbUrl(Thumbnail-01.png)
59+
STUDY_ICON: osparc.product.Utils.getProductThumbUrl(),
60+
TEMPLATE_ICON: osparc.product.Utils.getProductThumbUrl(),
61+
SERVICE_ICON: osparc.product.Utils.getProductThumbUrl(),
62+
COMP_SERVICE_ICON: osparc.product.Utils.getProductThumbUrl(),
63+
DYNAMIC_SERVICE_ICON: osparc.product.Utils.getProductThumbUrl(),
6364

6465
CARD_PRIORITY: {
6566
NEW: 0,
@@ -522,58 +523,63 @@ qx.Class.define("osparc.dashboard.CardBase", {
522523
_applyProjectState: function(projectStatus) {
523524
const status = projectStatus["value"];
524525
let icon;
525-
let label;
526+
let toolTip;
526527
let border;
527528
switch (status) {
528529
case "STARTED":
529-
icon = "@FontAwesome5Solid/spinner/8";
530-
label = this.tr("Running");
530+
icon = "@FontAwesome5Solid/spinner/10";
531+
toolTip = this.tr("Running");
531532
border = "info";
532533
break;
533534
case "SUCCESS":
534-
icon = "@FontAwesome5Solid/check/8";
535-
label = this.tr("Ran successfully");
535+
icon = "@FontAwesome5Solid/check/10";
536+
toolTip = this.tr("Ran successfully");
536537
border = "success";
537538
break;
538539
case "ABORTED":
539-
icon = "@FontAwesome5Solid/info/8";
540-
label = this.tr("Run aborted");
540+
icon = "@FontAwesome5Solid/exclamation/10";
541+
toolTip = this.tr("Run aborted");
541542
border = "warning";
542543
break;
543544
case "FAILED":
544-
icon = "@FontAwesome5Solid/times/8";
545-
label = this.tr("Ran with error");
545+
icon = "@FontAwesome5Solid/exclamation/10";
546+
toolTip = this.tr("Ran with error");
546547
border = "error";
547548
break;
548549
default:
549550
icon = null;
550-
label = null;
551+
toolTip = null;
551552
border = null;
552553
break;
553554
}
554-
this.__applyProjectLabel(icon, label, border);
555+
this.__applyProjectLabel(icon, toolTip, border);
555556
},
556557

557-
__applyProjectLabel: function(icn, lbl, bdr) {
558-
const projectStatusLabel = this.getChildControl("project-status");
559-
projectStatusLabel.setVisibility(icn && lbl && bdr ? "visible" : "excluded");
558+
__applyProjectLabel: function(icn, toolTipText, bdr) {
560559
const border = new qx.ui.decoration.Decorator().set({
560+
radius: 10,
561561
width: 1,
562562
style: "solid",
563563
color: bdr,
564-
backgroundColor: bdr
564+
backgroundColor: bdr ? bdr + "-bg" : null
565565
});
566-
const icon = this.getChildControl("project-status-icon");
567-
const label = this.getChildControl("project-status-label");
568-
icon.setSource(icn);
569-
icon.set({
570-
decorator: border
566+
const projectStatusLabel = this.getChildControl("project-status");
567+
projectStatusLabel.set({
568+
decorator: border,
569+
textColor: bdr,
570+
alignX: "center",
571+
alignY: "middle",
572+
height: 17,
573+
width: 17,
574+
padding: 3
571575
});
572-
icon.getContentElement().setStyles({
573-
"border-radius": "50%",
574-
"background-clip": "border-box"
576+
577+
projectStatusLabel.set({
578+
visibility: icn && toolTipText && bdr ? "visible" : "excluded",
579+
source: icn,
580+
toolTipIcon: icn,
581+
toolTipText
575582
});
576-
label.setValue(lbl);
577583
},
578584

579585
__showBlockedCardFromStatus: function(lockedStatus) {

0 commit comments

Comments
 (0)