Skip to content

Commit a8a8046

Browse files
odeimaizodeimaiz
authored
♻️ [Frontend] ViP Market: adapt to latest model (#7164)
On behalf of @odeimaiz
1 parent 50b017d commit a8a8046

File tree

5 files changed

+86
-64
lines changed

5 files changed

+86
-64
lines changed

‎services/static-webserver/client/source/class/osparc/store/LicensedItems.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,20 @@ qx.Class.define("osparc.store.LicensedItems", {
2525
this.__licensedItems = null;
2626
},
2727

28+
statics: {
29+
purchasesToNSeats: function(purchases) {
30+
let nSeats = 0;
31+
purchases.forEach(purchase => {
32+
if ("numberOfSeats" in purchase) {
33+
nSeats += purchase["numberOfSeats"];
34+
} else if ("getNumberOfSeats" in purchase) {
35+
nSeats += purchase.getNumberOfSeats();
36+
}
37+
});
38+
return nSeats;
39+
},
40+
},
41+
2842
members: {
2943
__licensedItems: null,
3044

‎services/static-webserver/client/source/class/osparc/vipMarket/AnatomicalModelDetails.js‎

Lines changed: 20 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,8 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
5353
this._removeAll();
5454

5555
const anatomicalModelsData = this.getAnatomicalModelsData();
56-
if (anatomicalModelsData) {
57-
const modelInfo = this.__createModelInfo(anatomicalModelsData["licensedResourceData"]);
56+
if (anatomicalModelsData && anatomicalModelsData["licensedResourceData"]) {
57+
const modelInfo = this.__createModelInfo(anatomicalModelsData["licensedResourceData"]["source"]);
5858
const pricingUnits = this.__createPricingUnits(anatomicalModelsData);
5959
const importButton = this.__createImportSection(anatomicalModelsData);
6060
this._add(modelInfo);
@@ -161,13 +161,22 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
161161
row: idx,
162162
});
163163

164-
const doiValue = new qx.ui.basic.Label().set({
165-
value: anatomicalModelsData["doi"] ? anatomicalModelsData["doi"] : "-",
166-
font: "text-14",
167-
alignX: "left",
168-
marginTop: 16,
169-
});
170-
featuresLayout.add(doiValue, {
164+
const doiToLink = doi => {
165+
const doiLabel = new osparc.ui.basic.LinkLabel("-").set({
166+
font: "text-14",
167+
alignX: "left",
168+
marginTop: 16,
169+
});
170+
if (doi) {
171+
doiLabel.set({
172+
value: doi,
173+
url: "https://doi.org/" + doi,
174+
font: "link-label-14",
175+
});
176+
}
177+
return doiLabel;
178+
};
179+
featuresLayout.add(doiToLink(anatomicalModelsData["doi"]), {
171180
column: 1,
172181
row: idx,
173182
});
@@ -196,7 +205,7 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
196205
});
197206
pUnit.addListener("rentPricingUnit", () => {
198207
this.fireDataEvent("modelPurchaseRequested", {
199-
modelId: anatomicalModelsData["modelId"],
208+
modelId: anatomicalModelsData["licensedResourceData"]["source"]["id"],
200209
licensedItemId: anatomicalModelsData["licensedItemId"],
201210
pricingPlanId: anatomicalModelsData["pricingPlanId"],
202211
pricingUnitId: pricingUnit.getPricingUnitId(),
@@ -236,7 +245,7 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
236245
});
237246
importButton.addListener("execute", () => {
238247
this.fireDataEvent("modelImportRequested", {
239-
modelId: anatomicalModelsData["modelId"]
248+
modelId: anatomicalModelsData["licensedResourceData"]["source"]["id"]
240249
});
241250
}, this);
242251
if (anatomicalModelsData["purchases"].length) {

‎services/static-webserver/client/source/class/osparc/vipMarket/AnatomicalModelListItem.js‎

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -24,11 +24,12 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelListItem", {
2424
this.base(arguments);
2525

2626
const layout = new qx.ui.layout.Grid(5, 5);
27-
layout.setColumnWidth(0, 64);
2827
layout.setRowFlex(0, 1);
29-
layout.setColumnFlex(1, 1);
28+
layout.setColumnFlex(1, 1); // flex display name
29+
layout.setColumnWidth(0, 48);
3030
layout.setColumnAlign(0, "center", "middle");
3131
layout.setColumnAlign(1, "left", "middle");
32+
layout.setColumnAlign(2, "center", "middle");
3233
this._setLayout(layout);
3334

3435
this.set({
@@ -145,6 +146,16 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelListItem", {
145146
column: 1
146147
});
147148
break;
149+
case "n-seats":
150+
control = new qx.ui.basic.Label().set({
151+
font: "text-14",
152+
alignY: "middle",
153+
});
154+
this._add(control, {
155+
row: 0,
156+
column: 2
157+
});
158+
break;
148159
}
149160
control.set({
150161
anonymous: true, // pass the tap action over
@@ -162,11 +173,12 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelListItem", {
162173
},
163174

164175
__applyPurchases: function(purchases) {
165-
if (purchases.length) {
166-
this.set({
167-
textColor: "default-button-text",
168-
backgroundColor: "strong-main",
169-
})
176+
const nSeatsLabel = this.getChildControl("n-seats");
177+
const nSeats = osparc.store.LicensedItems.purchasesToNSeats(purchases);
178+
if (nSeats) {
179+
nSeatsLabel.setValue(`(${nSeats})`);
180+
} else {
181+
nSeatsLabel.resetValue();
170182
}
171183
},
172184

@@ -189,7 +201,7 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelListItem", {
189201
_shouldApplyFilter: function(data) {
190202
if (data.text) {
191203
const checks = [
192-
this.getName(),
204+
this.getDisplayName(),
193205
];
194206
if (checks.filter(check => check && check.toLowerCase().trim().includes(data.text)).length == 0) {
195207
return true;

‎services/static-webserver/client/source/class/osparc/vipMarket/Market.js‎

Lines changed: 19 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -41,40 +41,30 @@ qx.Class.define("osparc.vipMarket.Market", {
4141
])
4242
.then(values => {
4343
const licensedItems = values[0];
44-
const categories = {};
44+
const categories = [];
4545
licensedItems.forEach(licensedItem => {
46-
if (licensedItem["licensedResourceData"] && licensedItem["licensedResourceData"]["category"]) {
47-
const category = licensedItem["licensedResourceData"]["category"];
48-
if (!(category in categories)) {
49-
categories[category] = [];
46+
if (licensedItem["licensedResourceData"] && licensedItem["licensedResourceData"]["categoryId"]) {
47+
const categoryId = licensedItem["licensedResourceData"]["categoryId"];
48+
let category = categories.find(cat => cat["categoryId"] === categoryId);
49+
if (!category) {
50+
category = {
51+
categoryId,
52+
label: licensedItem["licensedResourceData"]["categoryDisplay"] || "Category",
53+
icon: licensedItem["licensedResourceData"]["categoryIcon"] || "@FontAwesome5Solid/users/20",
54+
items: [],
55+
};
56+
categories.push(category);
5057
}
51-
categories[category].push(licensedItem);
58+
category["items"].push(licensedItem);
5259
}
5360
});
5461

55-
const expectedCategories = [{
56-
category: "HumanWholeBody",
57-
label: "Humans",
58-
icon: "@FontAwesome5Solid/users/20",
59-
}, {
60-
category: "HumanBodyRegion",
61-
label: "Humans (Region)",
62-
icon: "@FontAwesome5Solid/users/20",
63-
}, {
64-
category: "AnimalWholeBody",
65-
label: "Animals",
66-
icon: "@FontAwesome5Solid/users/20",
67-
}, {
68-
category: "ComputationalPhantom",
69-
label: "Phantoms",
70-
icon: "@FontAwesome5Solid/users/20",
71-
}]
72-
expectedCategories.forEach(expectedCategory => {
73-
this.__buildViPMarketPage(expectedCategory, categories[expectedCategory["category"]]);
62+
categories.forEach(category => {
63+
this.__buildViPMarketPage(category, category["items"]);
7464
});
7565

7666
if (openCategory) {
77-
this.openCategory(openCategory);
67+
this.__openCategory(openCategory);
7868
}
7969
});
8070
},
@@ -96,16 +86,16 @@ qx.Class.define("osparc.vipMarket.Market", {
9686
__buildViPMarketPage: function(marketTabInfo, licensedItems = []) {
9787
const vipMarketView = new osparc.vipMarket.VipMarket(licensedItems);
9888
vipMarketView.set({
99-
category: marketTabInfo["category"],
89+
category: marketTabInfo["categoryId"],
10090
});
10191
this.bind("openBy", vipMarketView, "openBy");
10292
vipMarketView.addListener("importMessageSent", () => this.fireEvent("importMessageSent"));
10393
const page = this.addTab(marketTabInfo["label"], marketTabInfo["icon"], vipMarketView);
104-
page.category = marketTabInfo["category"];
94+
page.category = marketTabInfo["categoryId"];
10595
return page;
10696
},
10797

108-
openCategory: function(category) {
98+
__openCategory: function(category) {
10999
const viewFound = this.getChildControl("tabs-view").getChildren().find(view => view.category === category);
110100
if (viewFound) {
111101
this._openPage(viewFound);

‎services/static-webserver/client/source/class/osparc/vipMarket/VipMarket.js‎

Lines changed: 13 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ qx.Class.define("osparc.vipMarket.VipMarket", {
4343
},
4444

4545
category: {
46-
check: ["HumanWholeBody", "HumanBodyRegion", "AnimalWholeBody", "ComputationalPhantom"],
46+
check: "String",
4747
init: null,
4848
nullable: true,
4949
},
@@ -182,21 +182,16 @@ qx.Class.define("osparc.vipMarket.VipMarket", {
182182
this.__anatomicalModels = [];
183183
licensedItems.forEach(licensedItem => {
184184
const anatomicalModel = osparc.utils.Utils.deepCloneObject(licensedItem);
185-
anatomicalModel["modelId"] = licensedItem["licensedItemId"];
185+
anatomicalModel["modelId"] = anatomicalModel["licensedResourceData"]["source"]["id"];
186186
anatomicalModel["thumbnail"] = "";
187187
anatomicalModel["date"] = null;
188-
if (anatomicalModel["licensedResourceData"]) {
189-
if (anatomicalModel["licensedResourceData"]["id"]) {
190-
anatomicalModel["modelId"] = anatomicalModel["licensedResourceData"]["id"];
191-
}
192-
if (anatomicalModel["licensedResourceData"]["thumbnail"]) {
193-
anatomicalModel["thumbnail"] = anatomicalModel["licensedResourceData"]["thumbnail"];
188+
if (anatomicalModel["licensedResourceData"] && anatomicalModel["licensedResourceData"]["source"]) {
189+
const anatomicalModelSource = anatomicalModel["licensedResourceData"]["source"];
190+
if (anatomicalModelSource["thumbnail"]) {
191+
anatomicalModel["thumbnail"] = anatomicalModelSource["thumbnail"];
194192
}
195-
if (
196-
anatomicalModel["licensedResourceData"]["features"] &&
197-
anatomicalModel["licensedResourceData"]["features"]["date"]
198-
) {
199-
anatomicalModel["date"] = new Date(anatomicalModel["licensedResourceData"]["features"]["date"]);
193+
if (anatomicalModelSource["features"] && anatomicalModelSource["features"]["date"]) {
194+
anatomicalModel["date"] = new Date(anatomicalModelSource["features"]["date"]);
200195
}
201196
}
202197
// attach license data
@@ -277,9 +272,11 @@ qx.Class.define("osparc.vipMarket.VipMarket", {
277272
const sortModel = sortBy => {
278273
models.sort((a, b) => {
279274
// first criteria
280-
if (b["purchases"].length !== a["purchases"].length) {
281-
// leased first
282-
return b["purchases"].length - a["purchases"].length;
275+
const nASeats = osparc.store.LicensedItems.purchasesToNSeats(a["purchases"]);
276+
const nBSeats = osparc.store.LicensedItems.purchasesToNSeats(b["purchases"]);
277+
if (nBSeats !== nASeats) {
278+
// nSeats first
279+
return nBSeats - nASeats;
283280
}
284281
// second criteria
285282
if (sortBy) {

0 commit comments

Comments
 (0)