🎨 Feature: Tour de S4L (#4737)

ITISFoundation · Sep 27, 2023 · d1da92e · d1da92e
1 parent 7015005
commit d1da92e
Show file tree

Hide file tree

Showing 49 changed files with 924 additions and 621 deletions.
diff --git a/services/static-webserver/client/source/class/osparc/Application.js b/services/static-webserver/client/source/class/osparc/Application.js
@@ -478,7 +478,6 @@ qx.Class.define("osparc.Application", {
       if (this.__mainPage) {
         this.__mainPage.closeEditor();
       }
-      osparc.panddy.Panddy.getInstance().stop();
       osparc.utils.Utils.closeHangingWindows();
       osparc.store.Store.getInstance().dispose();
       this.__restart();

diff --git a/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js b/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js
@@ -38,18 +38,9 @@ qx.Class.define("osparc.dashboard.Dashboard", {
   construct: function() {
     this.base(arguments);
 
+    osparc.utils.Utils.setIdToWidget(this.getChildControl("bar"), "dashboardTabs");
     osparc.utils.Utils.setIdToWidget(this, "dashboard");
 
-    if (osparc.product.panddy.Utils.hasPanddy()) {
-      const panddy = osparc.panddy.Panddy.getInstance();
-      const root = qx.core.Init.getApplication().getRoot();
-      root.add(panddy, {
-        bottom: 10,
-        right: 10
-      });
-      setTimeout(() => panddy.start(), 2000);
-    }
-
     this.set({
       contentPaddingTop: 15,
       contentPaddingLeft: 0,

diff --git a/services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js b/services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js
@@ -65,6 +65,7 @@ qx.Class.define("osparc.dashboard.GridButtonItem", {
             visibility: "excluded",
             alignY: "bottom"
           });
+          osparc.utils.Utils.setIdToWidget(control, "updateStudyBtn");
           this._mainLayout.add(control, osparc.dashboard.GridButtonBase.POS.UPDATES);
           break;
         case "hits-service":
@@ -221,6 +222,7 @@ qx.Class.define("osparc.dashboard.GridButtonItem", {
       const menuButton = this.getChildControl("menu-button");
       if (value) {
         menuButton.setMenu(value);
+        osparc.utils.Utils.setIdToWidget(value, "studyItemMenuMenu");
       }
       menuButton.setVisibility(value ? "visible" : "excluded");
     }

diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ListButtonItem.js b/services/static-webserver/client/source/class/osparc/dashboard/ListButtonItem.js
@@ -133,6 +133,7 @@ qx.Class.define("osparc.dashboard.ListButtonItem", {
             source: "@MaterialIcons/update/18",
             visibility: "excluded"
           });
+          osparc.utils.Utils.setIdToWidget(control, "updateStudyBtn");
           this._add(control, {
             row: 0,
             column: osparc.dashboard.ListButtonBase.POS.UPDATES
@@ -251,6 +252,7 @@ qx.Class.define("osparc.dashboard.ListButtonItem", {
       const menuButton = this.getChildControl("menu-button");
       if (value) {
         menuButton.setMenu(value);
+        osparc.utils.Utils.setIdToWidget(value, "studyItemMenuMenu");
       }
       menuButton.setVisibility(value ? "visible" : "excluded");
     }

diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceMoreOptions.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceMoreOptions.js
@@ -109,7 +109,7 @@ qx.Class.define("osparc.dashboard.ResourceMoreOptions", {
       const title = new qx.ui.basic.Label(resourceData.name).set({
         font: "text-16",
         alignY: "middle",
-        maxWidth: 300,
+        maxWidth: this.self().WIDTH-100,
         rich: true,
         wrap: true
       });

diff --git a/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js b/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js
@@ -212,14 +212,14 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
           }
 
           // Show Quick Start if studies.length === 0
-          const tutorial = osparc.product.tutorial.Utils.getTutorial();
-          if (tutorial) {
-            const dontShow = osparc.utils.Utils.localCache.getLocalStorageItem(tutorial.localStorageStr);
+          const quickStart = osparc.product.quickStart.Utils.getQuickStart();
+          if (quickStart) {
+            const dontShow = osparc.utils.Utils.localCache.getLocalStorageItem(quickStart.localStorageStr);
             if (dontShow === "true") {
               return;
             }
             if (nStudies === 0) {
-              const tutorialWindow = tutorial.tutorial();
+              const tutorialWindow = quickStart.tutorial();
               tutorialWindow.center();
               tutorialWindow.open();
             }

diff --git a/services/static-webserver/client/source/class/osparc/desktop/MainPage.js b/services/static-webserver/client/source/class/osparc/desktop/MainPage.js
@@ -61,11 +61,10 @@ qx.Class.define("osparc.desktop.MainPage", {
           osparc.desktop.credits.Utils.areWalletsEnabled()
             .then(walletsEnabled => {
               if (walletsEnabled) {
-                const creditsWindow = osparc.desktop.credits.CreditsWindow.openWindow(true);
+                const creditsWindow = osparc.desktop.credits.UserCenterWindow.openWindow(walletsEnabled);
                 creditsWindow.openOverview();
               }
             });
-          // setTimeout(() => osparc.desktop.MainPageHandler.getInstance().showUserCenter(), 1000);
         }
         const preferenceSettings = osparc.Preferences.getInstance();
         const preferenceWalletId = preferenceSettings.getPreferredWalletId();
@@ -98,7 +97,6 @@ qx.Class.define("osparc.desktop.MainPage", {
     __navBar: null,
     __dashboard: null,
     __dashboardLayout: null,
-    __userCenter: null,
     __loadingPage: null,
     __studyEditor: null,
 
@@ -203,9 +201,6 @@ qx.Class.define("osparc.desktop.MainPage", {
       const dashboardLayout = this.__dashboardLayout = this.__createDashboardStack();
       mainPageHandler.addDashboard(dashboardLayout);
 
-      const userCenterLayout = this.__createUserCenter();
-      mainPageHandler.addUserCenter(userCenterLayout);
-
       const loadingPage = this.__loadingPage = new osparc.ui.message.Loading();
       mainPageHandler.addLoadingPage(loadingPage);
 
@@ -249,20 +244,6 @@ qx.Class.define("osparc.desktop.MainPage", {
       return dashboardLayout;
     },
 
-    __createUserCenter: function() {
-      const userCenter = this.__userCenter = new osparc.desktop.credits.UserCenter(true);
-
-      const userCenterLayout = new qx.ui.container.Composite(new qx.ui.layout.HBox(5));
-      userCenterLayout.add(new qx.ui.core.Widget(), {
-        flex: 1
-      });
-      userCenterLayout.add(userCenter);
-      userCenterLayout.add(new qx.ui.core.Widget(), {
-        flex: 1
-      });
-      return userCenterLayout;
-    },
-
     __attachHandlers: function() {
       const studyBrowser = this.__dashboard.getStudyBrowser();
       studyBrowser.addListener("publishTemplate", e => this.__publishTemplate(e.getData()));

diff --git a/services/static-webserver/client/source/class/osparc/desktop/MainPageHandler.js b/services/static-webserver/client/source/class/osparc/desktop/MainPageHandler.js
@@ -27,7 +27,6 @@ qx.Class.define("osparc.desktop.MainPageHandler", {
     __stack: null,
     __loadingPage: null,
     __dashboard: null,
-    __userCenter: null,
     __studyEditor: null,
 
     setStack: function(stack) {
@@ -44,11 +43,6 @@ qx.Class.define("osparc.desktop.MainPageHandler", {
       this.__stack.add(dashboard);
     },
 
-    addUserCenter: function(userCenter) {
-      this.__userCenter = userCenter;
-      this.__stack.add(userCenter);
-    },
-
     addStudyEditor: function(studyEditor) {
       this.__studyEditor = studyEditor;
       this.__stack.add(studyEditor);
@@ -62,10 +56,6 @@ qx.Class.define("osparc.desktop.MainPageHandler", {
       this.__stack.setSelection([this.__dashboard]);
     },
 
-    showUserCenter: function() {
-      this.__stack.setSelection([this.__userCenter]);
-    },
-
     showStudyEditor: function() {
       this.__stack.setSelection([this.__studyEditor]);
     },

diff --git a/services/static-webserver/client/source/class/osparc/desktop/credits/CreditsIndicator.js b/services/static-webserver/client/source/class/osparc/desktop/credits/CreditsIndicator.js
@@ -52,7 +52,7 @@ qx.Class.define("osparc.desktop.credits.CreditsIndicator", {
       this.addListener("tap", () => {
         osparc.desktop.credits.Utils.areWalletsEnabled()
           .then(walletsEnabled => {
-            const creditsWindow = osparc.desktop.credits.CreditsWindow.openWindow(walletsEnabled);
+            const creditsWindow = osparc.desktop.credits.UserCenterWindow.openWindow(walletsEnabled);
             creditsWindow.openWallets();
           });
       }, this);

diff --git a/...s/osparc/desktop/credits/CreditsWindow.js → ...sparc/desktop/credits/UserCenterWindow.js b/...s/osparc/desktop/credits/CreditsWindow.js → ...sparc/desktop/credits/UserCenterWindow.js
@@ -15,7 +15,7 @@
 
 ************************************************************************ */
 
-qx.Class.define("osparc.desktop.credits.CreditsWindow", {
+qx.Class.define("osparc.desktop.credits.UserCenterWindow", {
   extend: osparc.ui.window.SingletonWindow,
 
   construct: function(walletsEnabled = false) {
@@ -41,7 +41,7 @@ qx.Class.define("osparc.desktop.credits.CreditsWindow", {
 
   statics: {
     openWindow: function(walletsEnabled = false) {
-      const accountWindow = new osparc.desktop.credits.CreditsWindow(walletsEnabled);
+      const accountWindow = new osparc.desktop.credits.UserCenterWindow(walletsEnabled);
       accountWindow.center();
       accountWindow.open();
       return accountWindow;

diff --git a/services/static-webserver/client/source/class/osparc/desktop/credits/WalletsMiniViewer.js b/services/static-webserver/client/source/class/osparc/desktop/credits/WalletsMiniViewer.js
@@ -23,6 +23,8 @@ qx.Class.define("osparc.desktop.credits.WalletsMiniViewer", {
 
     this._setLayout(new qx.ui.layout.VBox(3));
 
+    osparc.utils.Utils.setIdToWidget(this, "walletsMiniViewer");
+
     this.set({
       cursor: "pointer",
       padding: 5,
@@ -36,7 +38,7 @@ qx.Class.define("osparc.desktop.credits.WalletsMiniViewer", {
     this.addListener("tap", () => {
       osparc.desktop.credits.Utils.areWalletsEnabled()
         .then(walletsEnabled => {
-          const creditsWindow = osparc.desktop.credits.CreditsWindow.openWindow(walletsEnabled);
+          const creditsWindow = osparc.desktop.credits.UserCenterWindow.openWindow(walletsEnabled);
           creditsWindow.openOverview();
         });
     }, this);
@@ -101,7 +103,7 @@ qx.Class.define("osparc.desktop.credits.WalletsMiniViewer", {
       walletsButton.addListener("tap", () => {
         osparc.desktop.credits.Utils.areWalletsEnabled()
           .then(walletsEnabled => {
-            const creditsWindow = osparc.desktop.credits.CreditsWindow.openWindow(walletsEnabled);
+            const creditsWindow = osparc.desktop.credits.UserCenterWindow.openWindow(walletsEnabled);
             creditsWindow.openWallets();
           });
       }, this);

diff --git a/services/static-webserver/client/source/class/osparc/info/StudyLarge.js b/services/static-webserver/client/source/class/osparc/info/StudyLarge.js
@@ -70,7 +70,8 @@ qx.Class.define("osparc.info.StudyLarge", {
       const vBox = new qx.ui.container.Composite(new qx.ui.layout.VBox(15));
 
       const title = osparc.info.StudyUtils.createTitle(this.getStudy()).set({
-        font: "text-14"
+        font: "text-14",
+        maxWidth: 400
       });
       const titleLayout = this.__createViewWithEdit(title, this.__openTitleEditor);
       let text = osparc.product.Utils.getStudyAlias({firstUpperCase: true}) + " Id";

diff --git a/services/static-webserver/client/source/class/osparc/navigation/NavigationBar.js b/services/static-webserver/client/source/class/osparc/navigation/NavigationBar.js
@@ -204,6 +204,7 @@ qx.Class.define("osparc.navigation.NavigationBar", {
             paddingLeft: 10,
             font: "text-14"
           });
+          osparc.utils.Utils.setIdToWidget(control, "dashboardLabel");
           this.getChildControl("left-items").add(control);
           break;
         case "study-menu-info":
@@ -397,8 +398,10 @@ qx.Class.define("osparc.navigation.NavigationBar", {
         backgroundColor: "transparent"
       });
       osparc.store.Support.addQuickStartToMenu(menu);
-      osparc.store.Support.addPanddyToMenu(menu);
+      osparc.store.Support.addGuidedToursToMenu(menu);
       osparc.store.Support.addManualButtonsToMenu(menu, menuButton);
+      osparc.utils.Utils.setIdToWidget(menuButton, "manualsButton");
+      osparc.utils.Utils.setIdToWidget(menu, "manualsMenu");
       return menuButton;
     },
 
@@ -411,6 +414,8 @@ qx.Class.define("osparc.navigation.NavigationBar", {
         backgroundColor: "transparent"
       });
       osparc.store.Support.addSupportButtonsToMenu(menu, menuButton);
+      osparc.utils.Utils.setIdToWidget(menuButton, "feedbackButton");
+      osparc.utils.Utils.setIdToWidget(menu, "feedbackMenu");
       return menuButton;
     },
 

diff --git a/services/static-webserver/client/source/class/osparc/navigation/UserMenuButton.js b/services/static-webserver/client/source/class/osparc/navigation/UserMenuButton.js
@@ -92,10 +92,9 @@ qx.Class.define("osparc.navigation.UserMenuButton", {
           control.addListener("execute", () => {
             osparc.desktop.credits.Utils.areWalletsEnabled()
               .then(walletsEnabled => {
-                const creditsWindow = osparc.desktop.credits.CreditsWindow.openWindow(walletsEnabled);
+                const creditsWindow = osparc.desktop.credits.UserCenterWindow.openWindow(walletsEnabled);
                 creditsWindow.openOverview();
               });
-            // osparc.desktop.MainPageHandler.getInstance().showUserCenter();
           }, this);
           this.getMenu().add(control);
           break;
@@ -171,11 +170,11 @@ qx.Class.define("osparc.navigation.UserMenuButton", {
         this.getChildControl("organizations");
         this.getChildControl("clusters");
       }
-      if (osparc.product.tutorial.Utils.getTutorial()) {
+      if (osparc.product.quickStart.Utils.getQuickStart()) {
         this.getMenu().addSeparator();
         osparc.store.Support.addQuickStartToMenu(this.getMenu());
-        osparc.store.Support.addPanddyToMenu(this.getMenu());
       }
+      osparc.store.Support.addGuidedToursToMenu(this.getMenu());
       this.getMenu().addSeparator();
       const announcementUIFactory = osparc.announcement.AnnouncementUIFactory.getInstance();
       if (announcementUIFactory.hasUserMenuAnnouncement()) {
@@ -231,7 +230,7 @@ qx.Class.define("osparc.navigation.UserMenuButton", {
     __addQuickStartToMenu: function() {
       const menu = this.getMenu();
       osparc.store.Support.addQuickStartToMenu(menu);
-      osparc.store.Support.addPanddyToMenu(menu);
+      osparc.store.Support.addGuidedToursToMenu(menu);
     },
 
     __addManualsToMenu: async function() {

diff --git a/services/static-webserver/client/source/class/osparc/notification/NotificationsButton.js b/services/static-webserver/client/source/class/osparc/notification/NotificationsButton.js
@@ -23,6 +23,8 @@ qx.Class.define("osparc.notification.NotificationsButton", {
 
     this._setLayout(new qx.ui.layout.Canvas());
 
+    osparc.utils.Utils.setIdToWidget(this, "notificationsButton");
+
     this.set({
       width: 30,
       alignX: "center",