From 4633a3be833b2f8305ad8a39a89b6eaca8fbfd19 Mon Sep 17 00:00:00 2001 From: Odei Maiz Date: Wed, 17 May 2023 16:09:22 +0200 Subject: [PATCH 1/3] refactoring --- .../osparc/component/share/Collaborators.js | 152 +++++++++--------- 1 file changed, 76 insertions(+), 76 deletions(-) diff --git a/services/static-webserver/client/source/class/osparc/component/share/Collaborators.js b/services/static-webserver/client/source/class/osparc/component/share/Collaborators.js index b6e79f06936..8217c2dbe95 100644 --- a/services/static-webserver/client/source/class/osparc/component/share/Collaborators.js +++ b/services/static-webserver/client/source/class/osparc/component/share/Collaborators.js @@ -70,6 +70,80 @@ qx.Class.define("osparc.component.share.Collaborators", { } } return sorted; + }, + + createStudyLinkSection: function(serializedData) { + const vBox = new qx.ui.container.Composite(new qx.ui.layout.VBox(5)); + + const label = new qx.ui.basic.Label().set({ + value: qx.locale.Manager.tr("Any logged-in user with access to the ") + osparc.product.Utils.getStudyAlias() + qx.locale.Manager.tr(" can open it"), + rich: true + }); + vBox.add(label); + + const hBox = new qx.ui.container.Composite(new qx.ui.layout.HBox(10).set({ + alignY: "middle" + })); + vBox.add(hBox, { + flex: 1 + }); + + const link = window.location.href + "#/study/" + serializedData["uuid"]; + const linkField = new qx.ui.form.TextField(link); + hBox.add(linkField, { + flex: 1 + }); + + const copyLinkBtn = new qx.ui.form.Button(qx.locale.Manager.tr("Copy link")); + copyLinkBtn.addListener("execute", () => { + if (osparc.utils.Utils.copyTextToClipboard(link)) { + copyLinkBtn.setIcon("@FontAwesome5Solid/check/12"); + } + }); + hBox.add(copyLinkBtn); + + return vBox; + }, + + createTemplateLinkSection: function(serializedData) { + const vBox = new qx.ui.container.Composite(new qx.ui.layout.VBox(5)); + + if ("permalink" in serializedData) { + const permalink = serializedData["permalink"]; + + const label = new qx.ui.basic.Label().set({ + rich: true + }); + if (permalink["is_public"]) { + label.setValue(qx.locale.Manager.tr("Anyone on the internet with the link can open this ") + osparc.product.Utils.getTemplateAlias()); + } else { + label.setValue(qx.locale.Manager.tr("Any logged-in user with the link can copy and open this ") + osparc.product.Utils.getTemplateAlias()); + } + vBox.add(label); + + const hBox = new qx.ui.container.Composite(new qx.ui.layout.HBox(10).set({ + alignY: "middle" + })); + vBox.add(hBox, { + flex: 1 + }); + + const link = permalink["url"]; + const linkField = new qx.ui.form.TextField(link); + hBox.add(linkField, { + flex: 1 + }); + + const copyLinkBtn = new qx.ui.form.Button(qx.locale.Manager.tr("Copy link")); + copyLinkBtn.addListener("execute", () => { + if (osparc.utils.Utils.copyTextToClipboard(link)) { + copyLinkBtn.setIcon("@FontAwesome5Solid/check/12"); + } + }); + hBox.add(copyLinkBtn); + } + + return vBox; } }, @@ -105,13 +179,13 @@ qx.Class.define("osparc.component.share.Collaborators", { }); break; case "study-link": - control = this.__createStudyLinkSection(); + control = this.self().createStudyLinkSection(this._serializedData); this._add(control); // excluded by default control.exclude(); break; case "template-link": - control = this.__createTemplateLinkSection(); + control = this.self().createTemplateLinkSection(this._serializedData); this._add(control); // excluded by default control.exclude(); @@ -218,80 +292,6 @@ qx.Class.define("osparc.component.share.Collaborators", { return vBox; }, - __createStudyLinkSection: function() { - const vBox = new qx.ui.container.Composite(new qx.ui.layout.VBox(5)); - - const label = new qx.ui.basic.Label().set({ - value: this.tr("Any logged-in user with access to the ") + osparc.product.Utils.getStudyAlias() + this.tr(" can open it"), - rich: true - }); - vBox.add(label); - - const hBox = new qx.ui.container.Composite(new qx.ui.layout.HBox(10).set({ - alignY: "middle" - })); - vBox.add(hBox, { - flex: 1 - }); - - const link = window.location.href + "#/study/" + this._serializedData["uuid"]; - const linkField = new qx.ui.form.TextField(link); - hBox.add(linkField, { - flex: 1 - }); - - const copyLinkBtn = new qx.ui.form.Button(this.tr("Copy link")); - copyLinkBtn.addListener("execute", () => { - if (osparc.utils.Utils.copyTextToClipboard(link)) { - copyLinkBtn.setIcon("@FontAwesome5Solid/check/12"); - } - }, this); - hBox.add(copyLinkBtn); - - return vBox; - }, - - __createTemplateLinkSection: function() { - const vBox = new qx.ui.container.Composite(new qx.ui.layout.VBox(5)); - - if ("permalink" in this._serializedData) { - const permalink = this._serializedData["permalink"]; - - const label = new qx.ui.basic.Label().set({ - rich: true - }); - if (permalink["is_public"]) { - label.setValue(this.tr("Anyone on the internet with the link can open this ") + osparc.product.Utils.getTemplateAlias()); - } else { - label.setValue(this.tr("Any logged-in user with the link can copy and open this ") + osparc.product.Utils.getTemplateAlias()); - } - vBox.add(label); - - const hBox = new qx.ui.container.Composite(new qx.ui.layout.HBox(10).set({ - alignY: "middle" - })); - vBox.add(hBox, { - flex: 1 - }); - - const link = permalink["url"]; - const linkField = new qx.ui.form.TextField(link); - hBox.add(linkField, { - flex: 1 - }); - - const copyLinkBtn = new qx.ui.form.Button(this.tr("Copy link")); - copyLinkBtn.addListener("execute", () => { - if (osparc.utils.Utils.copyTextToClipboard(link)) { - copyLinkBtn.setIcon("@FontAwesome5Solid/check/12"); - } - }, this); - hBox.add(copyLinkBtn); - } - - return vBox; - }, - __getCollaborators: function() { osparc.store.Store.getInstance().getPotentialCollaborators() .then(potentialCollaborators => { From 69d57585d37b24992a85da846c6c0290c9985b78 Mon Sep 17 00:00:00 2001 From: Odei Maiz Date: Thu, 1 Jun 2023 16:29:01 +0200 Subject: [PATCH 2/3] centerTabIcon --- .../source/class/osparc/dashboard/ResourceMoreOptions.js | 7 ++----- .../client/source/class/osparc/utils/Utils.js | 8 ++++++++ 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceMoreOptions.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceMoreOptions.js index 93255ce32c2..90ab1dde35f 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceMoreOptions.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceMoreOptions.js @@ -187,12 +187,9 @@ qx.Class.define("osparc.dashboard.ResourceMoreOptions", { tabPage.getButton().set({ minWidth: 35, - toolTipText: title, - alignY: "middle" - }); - tabPage.getButton().getChildControl("icon").set({ - alignX: "center" + toolTipText: title }); + osparc.utils.Utils.centerTabIcon(tabPage); // Page title tabPage.add(new qx.ui.basic.Label(title).set({ diff --git a/services/static-webserver/client/source/class/osparc/utils/Utils.js b/services/static-webserver/client/source/class/osparc/utils/Utils.js index 9b75bc8dece..04b4ab3dff5 100644 --- a/services/static-webserver/client/source/class/osparc/utils/Utils.js +++ b/services/static-webserver/client/source/class/osparc/utils/Utils.js @@ -765,6 +765,14 @@ qx.Class.define("osparc.utils.Utils", { return typeof v === "object" && v !== null; }, + centerTabIcon: function(tabpage) { + const button = tabpage.getButton(); + // eslint-disable-next-line no-underscore-dangle + const btnLayout = button._getLayout(); + btnLayout.setColumnFlex(0, 1); // icon + btnLayout.setColumnAlign(0, "center", "middle"); // icon + }, + addClass: function(element, className) { if (element) { const currentClass = element.getAttribute("class"); From cc46b8d3d9e7a3bda35ad4014841d6426b032d20 Mon Sep 17 00:00:00 2001 From: Odei Maiz Date: Thu, 1 Jun 2023 16:35:57 +0200 Subject: [PATCH 3/3] dashboard buttons --- .../client/source/class/osparc/dashboard/Dashboard.js | 2 +- .../client/source/class/osparc/utils/Utils.js | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js b/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js index 68ce96e8b1e..56b8fd66727 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/Dashboard.js @@ -143,7 +143,6 @@ qx.Class.define("osparc.dashboard.Dashboard", { }); const tabButton = tabPage.getChildControl("button"); tabButton.set({ - alignX: "center", minWidth: 50 }); tabButton.ttt = label; @@ -153,6 +152,7 @@ qx.Class.define("osparc.dashboard.Dashboard", { tabButton.getChildControl("icon").set({ visibility: "excluded" }); + osparc.utils.Utils.centerTabIcon(tabPage); osparc.utils.Utils.setIdToWidget(tabButton, id); tabPage.setLayout(new qx.ui.layout.Grow()); diff --git a/services/static-webserver/client/source/class/osparc/utils/Utils.js b/services/static-webserver/client/source/class/osparc/utils/Utils.js index 04b4ab3dff5..481078ed300 100644 --- a/services/static-webserver/client/source/class/osparc/utils/Utils.js +++ b/services/static-webserver/client/source/class/osparc/utils/Utils.js @@ -767,6 +767,10 @@ qx.Class.define("osparc.utils.Utils", { centerTabIcon: function(tabpage) { const button = tabpage.getButton(); + button.set({ + alignX: "center", + alignY: "middle" + }); // eslint-disable-next-line no-underscore-dangle const btnLayout = button._getLayout(); btnLayout.setColumnFlex(0, 1); // icon