make NodeOutputs persistent

Author: odeimaiz

services/static-webserver/client/source/class/osparc/data/model/Node.js

@@ -136,7 +136,8 @@ qx.Class.define("osparc.data.model.Node", {
     outputs: {
       check: "Object",
       nullable: false,
-      event: "changeOutputs"
+      event: "changeOutputs",
+      apply: "__applyOutputs",
     },
 
     status: {
@@ -166,6 +167,12 @@ qx.Class.define("osparc.data.model.Node", {
       apply: "__applyPropsForm"
     },
 
+    outputsForm: {
+      check: "osparc.widget.NodeOutputs",
+      init: null,
+      nullable: true
+    },
+
     marker: {
       check: "qx.core.Object",
       init: null,
@@ -612,6 +619,13 @@ qx.Class.define("osparc.data.model.Node", {
       }, this);
     },
 
+    __applyOutputs: function() {
+      if (!this.isPropertyInitialized("outputsForm") || !this.getOutputsForm()) {
+        const nodeOutputs = new osparc.widget.NodeOutputs(this, this.getMetaData().outputs);
+        this.setOutputsForm(nodeOutputs);
+      }
+    },
+
     removeNodePortConnections: function(inputNodeId) {
       let inputs = this.__getInputData();
       for (const portId in inputs) {

services/static-webserver/client/source/class/osparc/desktop/WorkbenchView.js

@@ -1032,11 +1032,12 @@ qx.Class.define("osparc.desktop.WorkbenchView", {
 
       // OUTPUTS
       const outputsBox = new qx.ui.container.Composite(new qx.ui.layout.VBox(spacing));
-      if (node.hasOutputs()) {
-        const nodeOutputs = new osparc.widget.NodeOutputs(node, node.getMetaData().outputs).set({
+      const outputsForm = node.getOutputsForm();
+      if (node.hasOutputs() && outputsForm) {
+        outputsForm.set({
           offerProbes: true
         });
-        outputsBox.add(nodeOutputs);
+        outputsBox.add(outputsForm);
       }
 
       const nodeFilesBtn = new qx.ui.form.Button(this.tr("Service data"), "@FontAwesome5Solid/folder-open/14").set({

services/static-webserver/client/source/class/osparc/node/slideshow/NodeView.js

@@ -92,9 +92,12 @@ qx.Class.define("osparc.node.slideshow.NodeView", {
     _addOutputs: function() {
       this._outputsLayout.removeAll();
 
-      const nodeOutputs = new osparc.widget.NodeOutputs(this.getNode(), this.getNode().getMetaData().outputs);
-      this._mainView.bind("backgroundColor", nodeOutputs, "backgroundColor");
-      this._outputsLayout.add(nodeOutputs);
+      const node = this.getNode();
+      const outputsForm = node.getOutputsForm();
+      if (node.hasOutputs() && outputsForm) {
+        this._mainView.bind("backgroundColor", outputsForm, "backgroundColor");
+        this._outputsLayout.add(outputsForm);
+      }
 
       this._outputsBtn.set({
         value: false,