diff --git a/services/static-webserver/client/source/class/osparc/CookiePolicy.js b/services/static-webserver/client/source/class/osparc/CookiePolicy.js index 3d3b6d7d21c9..7a0327c09f6b 100644 --- a/services/static-webserver/client/source/class/osparc/CookiePolicy.js +++ b/services/static-webserver/client/source/class/osparc/CookiePolicy.js @@ -66,7 +66,7 @@ qx.Class.define("osparc.CookiePolicy", { return link; }, - getZMTEULALink: function(linkText = "end users license agreement (EULA)") { + getZMTEULALink: function(linkText = "end-users license agreement (EULA)") { const color = qx.theme.manager.Color.getInstance().resolve("text"); const link = `${linkText}`; return link; diff --git a/services/static-webserver/client/source/class/osparc/auth/ui/RequestAccount.js b/services/static-webserver/client/source/class/osparc/auth/ui/RequestAccount.js index 22035158f767..e47c78d4e532 100644 --- a/services/static-webserver/client/source/class/osparc/auth/ui/RequestAccount.js +++ b/services/static-webserver/client/source/class/osparc/auth/ui/RequestAccount.js @@ -129,7 +129,8 @@ qx.Class.define("osparc.auth.ui.RequestAccount", { rich: true }); country.add(cItem); - }) + }); + // preselect fetch("https://ipapi.co/json") .then(res => res.json()) .then(data => { @@ -137,6 +138,12 @@ qx.Class.define("osparc.auth.ui.RequestAccount", { if (countryFound) { country.setSelection([countryFound]) } + }) + .catch(err => { + console.error(err); + const emptyItem = new qx.ui.form.ListItem("", null, ""); + country.add(emptyItem); + country.setSelection([emptyItem]); }); this._form.add(country, this.tr("Country"), null, "country"); @@ -321,7 +328,7 @@ qx.Class.define("osparc.auth.ui.RequestAccount", { // Eula link if (osparc.product.Utils.getProductName() !== "osparc") { - const eulaLink = osparc.CookiePolicy.getZMTEULALink("end users license agreement (EULA)"); + const eulaLink = osparc.CookiePolicy.getZMTEULALink("end-users license agreement (EULA)"); const eulaText = "I accept the " + eulaLink + " and I will use the product in accordance with it"; const eula = new qx.ui.form.CheckBox().set({ required: true, diff --git a/services/static-webserver/client/source/class/osparc/node/slideshow/BaseNodeView.js b/services/static-webserver/client/source/class/osparc/node/slideshow/BaseNodeView.js index 72006c173fe5..84acc271802a 100644 --- a/services/static-webserver/client/source/class/osparc/node/slideshow/BaseNodeView.js +++ b/services/static-webserver/client/source/class/osparc/node/slideshow/BaseNodeView.js @@ -235,20 +235,20 @@ qx.Class.define("osparc.node.slideshow.BaseNodeView", { } const desc = this.getNode().getSlideshowInstructions(); if (desc) { - const descView = new osparc.ui.markdown.Markdown().set({ + const markdownInstructions = new osparc.ui.markdown.Markdown().set({ value: desc, padding: 3, font: "text-14" }); - const scrollContainer = new qx.ui.container.Scroll(); - scrollContainer.add(descView); const title = this.tr("Instructions") + " - " + this.getNode().getLabel(); - const width = 500; - const height = 500; - const win = this.__instructionsWindow = osparc.ui.window.Window.popUpInWindow(scrollContainer, title, width, height).set({ + const width = 600; + const minHeight = 200; + const win = this.__instructionsWindow = osparc.ui.window.Window.popUpInWindow(markdownInstructions, title, width, minHeight).set({ modal: false, clickAwayClose: false }); + markdownInstructions.addListener("resized", () => win.center()); + win.getContentElement().setStyles({ "border-color": qx.theme.manager.Color.getInstance().resolve("strong-main") }); diff --git a/services/static-webserver/client/source/class/osparc/product/quickStart/tis/Slides.js b/services/static-webserver/client/source/class/osparc/product/quickStart/tis/Slides.js index ece202ab13bb..4324c5afaad9 100644 --- a/services/static-webserver/client/source/class/osparc/product/quickStart/tis/Slides.js +++ b/services/static-webserver/client/source/class/osparc/product/quickStart/tis/Slides.js @@ -26,7 +26,7 @@ qx.Class.define("osparc.product.quickStart.tis.Slides", { footerLinks: function() { const footerLinks = []; - const videoText = osparc.utils.Utils.createHTMLLink("TIP video", "https://youtu.be/-ZE6yOJ3ipw"); + const videoText = osparc.utils.Utils.createHTMLLink("TIP videos", "https://www.youtube.com/playlist?list=PLcJQYcVCSqDu5gXnJj-_vS_spGhZOe-jF"); const videoLabel = new qx.ui.basic.Label(videoText).set({ textAlign: "center", rich : true diff --git a/services/static-webserver/client/source/class/osparc/ui/markdown/Markdown.js b/services/static-webserver/client/source/class/osparc/ui/markdown/Markdown.js index 69faf56e827c..70fffb4c3ac6 100644 --- a/services/static-webserver/client/source/class/osparc/ui/markdown/Markdown.js +++ b/services/static-webserver/client/source/class/osparc/ui/markdown/Markdown.js @@ -71,6 +71,10 @@ qx.Class.define("osparc.ui.markdown.Markdown", { } }, + events: { + "resized": "qx.event.type.Event", + }, + members: { __loadMarked: null, /** @@ -138,7 +142,26 @@ qx.Class.define("osparc.ui.markdown.Markdown", { } else { this.setMinHeight(elemHeight); } + + const elemMaxWidth = this.__getChildrenElementMaxWidth(domElement.children); + if (this.getMaxWidth() && elemMaxWidth > this.getMaxWidth()) { + this.setWidth(elemMaxWidth); + } else { + this.setMinWidth(elemMaxWidth); + } } + this.fireEvent("resized"); + }, + + __getDomElement: function() { + if (!this.getContentElement || this.getContentElement() === null) { + return null; + } + const domElement = this.getContentElement().getDomElement(); + if (domElement) { + return domElement; + } + return null; }, __getChildrenElementHeight: function(children) { @@ -155,23 +178,37 @@ qx.Class.define("osparc.ui.markdown.Markdown", { if (this.getNoMargin()) { element.style.marginTop = 0; element.style.marginBottom = 0; - const size = qx.bom.element.Dimension.getSize(element); + const size = this.__getElementSize(element); return size.height; } - const size = qx.bom.element.Dimension.getSize(element); + const size = this.__getElementSize(element); // add padding - return size.height + 15; + return size.height + 20; }, - __getDomElement: function() { - if (!this.getContentElement || this.getContentElement() === null) { - return null; + __getChildrenElementMaxWidth: function(children) { + let maxWidth = 0; + for (let i=0; i < children.length; i++) { + maxWidth = Math.max(this.__getElementWidth(children[i]), maxWidth); } - const domElement = this.getContentElement().getDomElement(); - if (domElement) { - return domElement; + return maxWidth; + }, + + __getElementWidth: function(element) { + const size = this.__getElementSize(element); + return size.width; + }, + + __getElementSize: function(element) { + if ( + element && + element.children && + element.children.length && + element.children[0].localName === "img" + ) { + return qx.bom.element.Dimension.getSize(element.children[0]); } - return null; - } + return qx.bom.element.Dimension.getSize(element); + }, } });