🎨 [Frontend] Restore standalone view (#7242)

odeimaiz · web-flow · commit 135be29c3316 · 2025-02-18T12:31:18.000Z
diff --git a/services/static-webserver/client/source/class/osparc/NewRelease.js b/services/static-webserver/client/source/class/osparc/NewRelease.js
@@ -70,11 +70,11 @@ qx.Class.define("osparc.NewRelease", {
       });
       this._add(introLabel);
 
-      const rData = osparc.store.StaticInfo.getInstance().getReleaseData();
-      const url = rData["url"] || osparc.utils.LibVersions.getVcsRefUrl();
+      const releaseTag = osparc.utils.Utils.getReleaseTag();
+      const releaseLink = osparc.utils.Utils.getReleaseLink();
       const linkLabel = new osparc.ui.basic.LinkLabel().set({
-        value: this.tr("What's new"),
-        url,
+        value: this.tr("What's new in ") + releaseTag,
+        url: releaseLink,
         font: "link-label-14"
       });
       this._add(linkLabel);
diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceFilter.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceFilter.js
@@ -384,6 +384,7 @@ qx.Class.define("osparc.dashboard.ResourceFilter", {
         const button = new qx.ui.form.ToggleButton(null, "@FontAwesome5Solid/tag/16");
         button.id = tag.getTagId();
         tag.bind("name", button, "label");
+        tag.bind("name", button, "toolTipText");
         tag.bind("color", button.getChildControl("icon"), "textColor");
         osparc.utils.Utils.setIdToWidget(button, this.__resourceType + "-tagFilterItem");
         button.set({
diff --git a/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js b/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js
@@ -2203,9 +2203,9 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
       let msg = this.tr("Are you sure you want to delete");
       if (studyNames.length > 1) {
         const studiesText = osparc.product.Utils.getStudyAlias({plural: true});
-        msg += ` ${studyNames.length} ${studiesText} `
+        msg += ` ${studyNames.length} ${studiesText}?`;
       } else {
-        msg += ` '${studyNames[0]}' `;
+        msg += ` '${studyNames[0]}'?`;
       }
       const trashDays = osparc.store.StaticInfo.getInstance().getTrashRetentionDays();
       msg += "<br><br>" + (studyNames.length > 1 ? "They" : "It") + this.tr(` will be permanently deleted after ${trashDays} days.`);
diff --git a/services/static-webserver/client/source/class/osparc/desktop/MainPage.js b/services/static-webserver/client/source/class/osparc/desktop/MainPage.js
@@ -56,7 +56,7 @@ qx.Class.define("osparc.desktop.MainPage", {
     // Some resources request before building the main stack
     osparc.MaintenanceTracker.getInstance().startTracker();
     osparc.CookieExpirationTracker.getInstance().startTracker();
-    osparc.NewUITracker.getInstance().startTracker();
+    // osparc.NewUITracker.getInstance().startTracker();
 
     const store = osparc.store.Store.getInstance();
     const preloadPromises = [];
diff --git a/services/static-webserver/client/source/class/osparc/desktop/StudyEditor.js b/services/static-webserver/client/source/class/osparc/desktop/StudyEditor.js
@@ -719,7 +719,8 @@ qx.Class.define("osparc.desktop.StudyEditor", {
           if (oldUIMode === "standalone") {
             // in this transition, show workbenchUI
             this.__workbenchView.setMaximized(false);
-            this.__workbenchView.showPipeline();
+            // uncomment this when we release the osparc<->s4l integration
+            // this.__workbenchView.showPipeline();
           } else {
             const currentNodeId = this.getStudy().getUi().getCurrentNodeId();
             if (currentNodeId && this.getStudy().getWorkbench().getNode(currentNodeId)) {
diff --git a/services/static-webserver/client/source/class/osparc/desktop/credits/BuyCreditsInput.js b/services/static-webserver/client/source/class/osparc/desktop/credits/BuyCreditsInput.js
@@ -57,17 +57,18 @@ qx.Class.define("osparc.desktop.credits.BuyCreditsInput", {
         paddingRight: 0
       });
       this.__totalInput = totalInput;
-      amountInput.addListener("changeValue", e => {
-        const value = e.getData();
+      const amountChanged = value => {
         totalInput.setValue(value ? 1 * (value * this.__pricePerCredit).toFixed(2) + this.__currencySymbol : "-");
         this.fireDataEvent("input", this.getValues());
-      });
+      }
+      amountInput.getChildControl("textfield").addListener("input", e => amountChanged(e.getData()));
+      amountInput.addListener("changeValue", e => amountChanged(e.getData()));
       this._add(totalContainer);
 
       osparc.store.Store.getInstance().getMinimumAmount()
         .then(minimum => {
           amountInput.set({
-            maximum: 10000,
+            maximum: 100000,
             minimum: Math.ceil(minimum/this.__pricePerCredit),
             value: Math.ceil(minimum/this.__pricePerCredit)
           });
@@ -81,7 +82,7 @@ qx.Class.define("osparc.desktop.credits.BuyCreditsInput", {
       const input = new qx.ui.form.TextField().set({
         appearance: "appmotion-buy-credits-input",
         textAlign: "center",
-        width: 90,
+        width: 100,
         ...inputProps
       });
       const label = new qx.ui.basic.Label(labelText);
@@ -96,7 +97,7 @@ qx.Class.define("osparc.desktop.credits.BuyCreditsInput", {
       }));
       const input = new qx.ui.form.Spinner().set({
         appearance: "appmotion-buy-credits-spinner",
-        width: 100,
+        width: 110,
         ...inputProps
       });
       input.getChildControl("textfield").set({
diff --git a/services/static-webserver/client/source/class/osparc/navigation/NavigationBar.js b/services/static-webserver/client/source/class/osparc/navigation/NavigationBar.js
@@ -304,14 +304,15 @@ qx.Class.define("osparc.navigation.NavigationBar", {
 
       osparc.utils.Utils.setIdToWidget(menu, "helpNavigationMenu");
 
-      // menus
+      // quick starts and manuals
       osparc.store.Support.addQuickStartToMenu(menu);
       osparc.store.Support.addGuidedToursToMenu(menu);
       osparc.store.Support.addManualButtonsToMenu(menu, menuButton);
       menu.addSeparator();
 
       // feedback
       osparc.store.Support.addSupportButtonsToMenu(menu, menuButton);
+      osparc.store.Support.addReleaseNotesToMenu(menu);
 
       osparc.utils.Utils.prettifyMenu(menu);
 
diff --git a/services/static-webserver/client/source/class/osparc/navigation/StudyTitleWOptions.js b/services/static-webserver/client/source/class/osparc/navigation/StudyTitleWOptions.js
@@ -93,6 +93,15 @@ qx.Class.define("osparc.navigation.StudyTitleWOptions", {
             this.getStudy().getUi().setMode("standalone");
           });
           break;
+        case "study-menu-restore":
+          control = new qx.ui.menu.Button().set({
+            label: this.tr("Restore"),
+            icon: osparc.theme.common.Image.URLS["window-restore"] + "/20",
+          });
+          control.addListener("execute", () => {
+            this.getStudy().getUi().setMode("workbench");
+          });
+          break;
         case "study-menu-open-logger":
           control = new qx.ui.menu.Button().set({
             label: this.tr("Platform Logs..."),
@@ -107,6 +116,7 @@ qx.Class.define("osparc.navigation.StudyTitleWOptions", {
           optionsMenu.add(this.getChildControl("study-menu-reload"));
           optionsMenu.add(this.getChildControl("study-menu-convert-to-pipeline"));
           optionsMenu.add(this.getChildControl("study-menu-convert-to-standalone"));
+          optionsMenu.add(this.getChildControl("study-menu-restore"));
           optionsMenu.add(this.getChildControl("study-menu-open-logger"));
           control = new qx.ui.form.MenuButton().set({
             appearance: "fab-button",
@@ -168,6 +178,16 @@ qx.Class.define("osparc.navigation.StudyTitleWOptions", {
           convertToPipelineButton.exclude();
           convertToStandaloneButton.exclude();
         }
+
+        const restoreButton = this.getChildControl("study-menu-restore");
+        study.getUi().bind("mode", restoreButton, "visibility", {
+          converter: mode => mode === "standalone" ? "visible" : "excluded"
+        });
+
+        const loggerButton = this.getChildControl("study-menu-open-logger");
+        study.getUi().bind("mode", loggerButton, "visibility", {
+          converter: mode => mode === "standalone" ? "visible" : "excluded"
+        });
       } else {
         this.exclude();
       }
diff --git a/services/static-webserver/client/source/class/osparc/navigation/UserMenu.js b/services/static-webserver/client/source/class/osparc/navigation/UserMenu.js
@@ -214,16 +214,15 @@ qx.Class.define("osparc.navigation.UserMenu", {
       }
       this.addSeparator();
 
-      // quick starts
+      // quick starts and manuals
       osparc.store.Support.addQuickStartToMenu(this);
       osparc.store.Support.addGuidedToursToMenu(this);
-
-      // manuals
       osparc.store.Support.addManualButtonsToMenu(this);
       this.addSeparator();
 
       // feedbacks
       osparc.store.Support.addSupportButtonsToMenu(this);
+      osparc.store.Support.addReleaseNotesToMenu(this);
       this.addSeparator();
 
       this.getChildControl("theme-switcher");
diff --git a/services/static-webserver/client/source/class/osparc/product/Utils.js b/services/static-webserver/client/source/class/osparc/product/Utils.js
@@ -188,10 +188,8 @@ qx.Class.define("osparc.product.Utils", {
       return "REGISTER";
     },
 
-    // oSPARC only
     hasConvertToPipelineEnabled: function() {
-      const product = this.getProductName();
-      return product === "osparc";
+      return false;
     },
 
     // oSPARC only
@@ -269,7 +267,7 @@ qx.Class.define("osparc.product.Utils", {
     },
 
     getIconUrl: function(asset = "Default.png") {
-      const base = "https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/icons/"
+      const base = "https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/icons"
       let url;
       switch (osparc.product.Utils.getProductName()) {
         case "osparc":
diff --git a/services/static-webserver/client/source/class/osparc/store/LicensedItems.js b/services/static-webserver/client/source/class/osparc/store/LicensedItems.js
@@ -71,7 +71,9 @@ qx.Class.define("osparc.store.LicensedItems", {
     },
 
     licensedResourceNameAndVersion: function(licensedResource) {
-      return `${licensedResource["source"]["features"]["name"]} ${licensedResource["source"]["features"]["version"]}`;
+      const name = licensedResource["source"]["features"]["name"];
+      const version = licensedResource["source"]["features"]["version"];
+      return `${name} ${version}`;
     },
   },
 
diff --git a/services/static-webserver/client/source/class/osparc/store/Support.js b/services/static-webserver/client/source/class/osparc/store/Support.js
@@ -132,6 +132,14 @@ qx.Class.define("osparc.store.Support", {
       });
     },
 
+    addReleaseNotesToMenu: function(menu) {
+      const releaseTag = osparc.utils.Utils.getReleaseTag();
+      const releaseLink = osparc.utils.Utils.getReleaseLink();
+      const releaseBtn = new qx.ui.menu.Button(qx.locale.Manager.tr("Release Notes") + " " + releaseTag, "@FontAwesome5Solid/book/14");
+      releaseBtn.addListener("execute", () => window.open(releaseLink), this);
+      menu.add(releaseBtn);
+    },
+
     mailToLink: function(email, subject, centered = true) {
       const color = qx.theme.manager.Color.getInstance().resolve("text");
       let textLink = `<a href="mailto:${email}?subject=${subject}" style='color: ${color}' target='_blank'>${email}</a>`;
@@ -181,6 +189,6 @@ qx.Class.define("osparc.store.Support", {
       }
       createAccountWindow.center();
       createAccountWindow.open();
-    }
+    },
   }
 });
diff --git a/services/static-webserver/client/source/class/osparc/study/PricingUnitLicense.js b/services/static-webserver/client/source/class/osparc/study/PricingUnitLicense.js
@@ -127,7 +127,12 @@ qx.Class.define("osparc.study.PricingUnitLicense", {
     },
 
     __openLicense: function() {
-      const mdWindow = new osparc.ui.markdown.MarkdownWindow(this.getLicenseUrl()).set({
+      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,
diff --git a/services/static-webserver/client/source/class/osparc/utils/Utils.js b/services/static-webserver/client/source/class/osparc/utils/Utils.js
@@ -545,15 +545,24 @@ qx.Class.define("osparc.utils.Utils", {
       return daysBetween;
     },
 
-    createReleaseNotesLink: function() {
-      const versionLink = new osparc.ui.basic.LinkLabel();
+    getReleaseTag: function() {
       const rData = osparc.store.StaticInfo.getInstance().getReleaseData();
       const platformVersion = osparc.utils.LibVersions.getPlatformVersion();
-      let text = "osparc-simcore ";
-      text += (rData["tag"] && rData["tag"] !== "latest") ? rData["tag"] : platformVersion.version;
+      let text = (rData["tag"] && rData["tag"] !== "latest") ? rData["tag"] : platformVersion.version;
+      return text;
+    },
+
+    getReleaseLink: function() {
+      const rData = osparc.store.StaticInfo.getInstance().getReleaseData();
+      return rData["url"] || osparc.utils.LibVersions.getVcsRefUrl();
+    },
+
+    createReleaseNotesLink: function() {
+      let text = "osparc-simcore " + this.getReleaseTag();
       const platformName = osparc.store.StaticInfo.getInstance().getPlatformName();
       text += platformName.length ? ` (${platformName})` : "";
-      const url = rData["url"] || osparc.utils.LibVersions.getVcsRefUrl();
+      const url = this.self().getReleaseLink();
+      const versionLink = new osparc.ui.basic.LinkLabel();
       versionLink.set({
         value: text,
         url
diff --git a/services/static-webserver/client/source/class/osparc/vipMarket/AnatomicalModelDetails.js b/services/static-webserver/client/source/class/osparc/vipMarket/AnatomicalModelDetails.js
@@ -217,11 +217,12 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
       [
         "Name",
         "Version",
+        "Date",
+        "Species",
         "Sex",
         "Age",
         "Weight",
         "Height",
-        "Date",
         "Ethnicity",
         "Functionality",
       ].forEach(key => {
