Term and Conditions in features

Author: odeimaiz

services/static-webserver/client/source/class/osparc/study/PricingUnitLicense.js

@@ -29,13 +29,6 @@ qx.Class.define("osparc.study.PricingUnitLicense", {
       nullable: true,
       event: "changeShowRentButton"
     },
-
-    licenseUrl: {
-      check: "String",
-      init: false,
-      nullable: true,
-      event: "changeLicenseUrl"
-    },
   },
 
   statics: {
@@ -97,47 +90,18 @@ qx.Class.define("osparc.study.PricingUnitLicense", {
       let msg = this.getUnitData().getName() + this.tr(" will be available until ") + osparc.utils.Utils.formatDate(expirationDate);
       msg += "<br>";
       msg += `The rental will cost ${nCredits} credits`;
+      msg += `I hereby accept the Terms and Conditions`;
       const confirmationWin = new osparc.ui.window.Confirmation(msg).set({
         caption: this.tr("Rent"),
         confirmText: this.tr("Rent"),
       });
 
-      if (this.getLicenseUrl()) {
-        const useCacheCB = new qx.ui.form.CheckBox().set({
-          value: false,
-          label: this.tr("Accept <u>Terms and Conditions</u>"),
-          rich: true,
-        });
-        useCacheCB.getChildControl("label").set({
-          anonymous: false,
-          cursor: "pointer",
-        });
-        useCacheCB.getChildControl("label").addListener("tap", () => this.__openLicense());
-        confirmationWin.addWidget(useCacheCB);
-        confirmationWin.getExtraWidgetsLayout().setPaddingTop(0); // reset paddingTop
-        useCacheCB.bind("value", confirmationWin.getConfirmButton(), "enabled");
-      }
-
       confirmationWin.open();
       confirmationWin.addListener("close", () => {
         if (confirmationWin.getConfirmed()) {
           this.fireEvent("rentPricingUnit");
         }
       }, this);
     },
-
-    __openLicense: function() {
-      let rawLink = this.getLicenseUrl() || "";
-      if (rawLink.includes("github")) {
-        // make sure the raw version of the link is shown
-        rawLink += "?raw=true";
-      }
-      const mdWindow = new osparc.ui.markdown.MarkdownWindow(rawLink).set({
-        caption: this.tr("Terms and Conditions"),
-        width: 800,
-        height: 600,
-      });
-      mdWindow.open();
-    },
   }
 });

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

@@ -139,7 +139,6 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
       topGrid.setColumnFlex(0, 1);
       const headerLayout = new qx.ui.container.Composite(topGrid);
       const anatomicalModel = licensedItemBundleData["licensedResources"][selectedIdx]["source"];
-      const anatomicalModel = anatomicalModelsData["licensedResources"][selectedIdx]["source"];
       let description = anatomicalModel["description"] || "";
       description = description.replace(/SPEAG/g, " "); // remove SPEAG substring
       const delimiter = " - ";
@@ -257,7 +256,7 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
           value: "DOI",
           font: "text-14",
           alignX: "right",
-          marginTop: 16,
+          marginTop: 10,
         });
         featuresLayout.add(doiTitle, {
           column: 0,
@@ -268,7 +267,7 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
           const doiLabel = new osparc.ui.basic.LinkLabel("-").set({
             font: "text-14",
             alignX: "left",
-            marginTop: 16,
+            marginTop: 10,
           });
           if (doi) {
             doiLabel.set({
@@ -283,6 +282,23 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
           column: 1,
           row: idx,
         });
+        idx++;
+      }
+
+      if (licensedItemBundleData["termsOfUseUrl"] || anatomicalModel["termsOfUseUrl"]) { // remove the first one when this info goes down to the model
+        const tAndC = new qx.ui.basic.Label().set({
+          font: "text-14",
+          value: this.tr("<u>Terms and Conditions</u>"),
+          rich: true,
+          anonymous: false,
+          cursor: "pointer",
+        });
+        tAndC.addListener("tap", () => this.__openLicense(licensedItemBundleData["termsOfUseUrl"] || anatomicalModel["termsOfUseUrl"]));
+        featuresLayout.add(tAndC, {
+          column: 1,
+          row: idx,
+        });
+        idx++;
       }
 
       middleLayout.add(featuresLayout);
@@ -293,6 +309,19 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
       this.__selectedModelLayout.add(importSection);
     },
 
+    __openLicense: function(rawLink) {
+      if (rawLink.includes("github")) {
+        // make sure the raw version of the link is shown
+        rawLink += "?raw=true";
+      }
+      const mdWindow = new osparc.ui.markdown.MarkdownWindow(rawLink).set({
+        caption: this.tr("Terms and Conditions"),
+        width: 800,
+        height: 600,
+      });
+      mdWindow.open();
+    },
+
     __createImportSection: function(anatomicalModelsData, selectedIdx) {
       const importSection = new qx.ui.container.Composite(new qx.ui.layout.VBox().set({
         alignX: "center"
@@ -359,7 +388,6 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
               });
               const pUnit = new osparc.study.PricingUnitLicense(pricingUnit).set({
                 showRentButton: true,
-                licenseUrl: licensedItemData["termsOfUseUrl"],
               });
               pUnit.addListener("rentPricingUnit", () => {
                 this.fireDataEvent("modelPurchaseRequested", {

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

@@ -23,7 +23,7 @@ qx.Class.define("osparc.vipMarket.MarketWindow", {
 
     osparc.utils.Utils.setIdToWidget(this, "storeWindow");
 
-    const width = 1080;
+    const width = Math.min(1100, window.innerWidth); // since we go over the supported minimum, take the min
     const height = 700;
     this.set({
       width,