TI Landing page (ITISFoundation#3136)

Author: odeimaiz

services/web/client/source/class/osparc/Application.js

@@ -324,6 +324,10 @@ qx.Class.define("osparc.Application", {
           view = new osparc.auth.LoginPageS4L();
           this.__loadView(view);
           break;
+        case "tis":
+          view = new osparc.auth.LoginPageTI();
+          this.__loadView(view);
+          break;
         default:
           view = new osparc.auth.LoginPage();
           this.__loadView(view, {

services/web/client/source/class/osparc/auth/LoginPageTI.js

@@ -0,0 +1,81 @@
+/* ************************************************************************
+
+   osparc - the simcore frontend
+
+   https://osparc.io
+
+   Copyright:
+     2022 IT'IS Foundation, https://itis.swiss
+
+   License:
+     MIT: https://opensource.org/licenses/MIT
+
+   Authors:
+     * Odei Maiz (odeimaiz)
+
+************************************************************************ */
+
+/**
+ *  Main Authentication Page:
+ *    A multi-page view that fills all page
+ */
+
+qx.Class.define("osparc.auth.LoginPageTI", {
+  extend: osparc.auth.LoginPage,
+
+  /*
+  *****************************************************************************
+     CONSTRUCTOR
+  *****************************************************************************
+  */
+  construct: function() {
+    this.base(arguments);
+  },
+
+  events: {
+    "done": "qx.event.type.Data"
+  },
+
+  members: {
+    // overridden
+    _buildLayout: function() {
+      const layout = new qx.ui.layout.HBox();
+      this._setLayout(layout);
+
+      this.getContentElement().setStyles({
+        "background-image": "url(resource/osparc/ti_splitimage.png)",
+        "background-repeat": "no-repeat",
+        "background-size": "auto 100%"
+      });
+
+      this._add(new qx.ui.core.Spacer(), {
+        width: "50%"
+      });
+
+      const loginLayout = new qx.ui.container.Composite(new qx.ui.layout.VBox(10)).set({
+        alignX: "center",
+        alignY: "middle"
+      });
+      this._add(loginLayout, {
+        width: "50%"
+      });
+
+      loginLayout.add(new qx.ui.core.Spacer(), {
+        flex: 1
+      });
+
+      const image = this._getLogoWPlatform();
+      loginLayout.add(image);
+
+      const pages = this._getLoginStack();
+      loginLayout.add(pages);
+
+      const versionLink = this._getVersionLink();
+      loginLayout.add(versionLink);
+
+      loginLayout.add(new qx.ui.core.Spacer(), {
+        flex: 1
+      });
+    }
+  }
+});