support markers

Author: odeimaiz

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

@@ -525,7 +525,7 @@ qx.Class.define("osparc.data.model.Node", {
         this.setPosition(nodeUIData.position);
       }
       if ("marker" in nodeUIData) {
-        this.__addMarker(nodeUIData.marker);
+        this.addMarker(nodeUIData.marker);
       }
     },
 
@@ -683,11 +683,11 @@ qx.Class.define("osparc.data.model.Node", {
       if (this.getMarker()) {
         this.__removeMarker();
       } else {
-        this.__addMarker();
+        this.addMarker();
       }
     },
 
-    __addMarker: function(marker) {
+    addMarker: function(marker) {
       if (marker === undefined) {
         marker = {
           color: osparc.utils.Utils.getRandomColor()

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

@@ -162,24 +162,50 @@ qx.Class.define("osparc.data.model.StudyUI", {
         if (currentStudy) {
           Object.keys(uiDiff["workbench"]).forEach(nodeId => {
             const node = currentStudy.getWorkbench().getNode(nodeId);
-            if (node) {
-              if ("position" in uiDiff["workbench"][nodeId]) {
-                const position = uiDiff["workbench"][nodeId]["position"];
-                const newPos = node.getPosition();
-                if ("x" in position) {
-                  newPos.x = position["x"][1];
-                }
-                if ("y" in position) {
-                  newPos.y = position["y"][1];
-                }
-                node.setPosition(newPos);
-              }
+            if ("position" in uiDiff["workbench"][nodeId]) {
+              const positionDiff = uiDiff["workbench"][nodeId]["position"];
+              this.__updatePositionFromDiff(node, positionDiff);
+            }
+            if ("marker" in uiDiff["workbench"][nodeId]) {
+              const markerDiff = uiDiff["workbench"][nodeId]["marker"];
+              this.__updateMarkerFromDiff(node, markerDiff);
             }
           });
         }
       }
     },
 
+    __updatePositionFromDiff: function(node, positionDiff) {
+      if (node) {
+        const newPos = node.getPosition();
+        if ("x" in positionDiff) {
+          newPos.x = positionDiff["x"][1];
+        }
+        if ("y" in positionDiff) {
+          newPos.y = positionDiff["y"][1];
+        }
+        node.setPosition(newPos);
+      }
+    },
+
+    __updateMarkerFromDiff: function(node, markerDiff) {
+      if (node) {
+        if (markerDiff instanceof Array) {
+          if (markerDiff.length === 1) {
+            // it was added
+            node.addMarker(markerDiff[0]);
+          } else if (markerDiff.length === 2 && markerDiff[1] === null) {
+            // it was removed
+            node.setMarker(null);
+          }
+        } else if ("color" in markerDiff && markerDiff["color"] instanceof Array) {
+          // it was updated
+          const newColor = markerDiff["color"][1];
+          node.getMarker().setColor(newColor);
+        }
+      }
+    },
+
     listenToChanges: function() {
       const propertyKeys = Object.keys(qx.util.PropertyUtil.getProperties(osparc.data.model.StudyUI));
       this.self().ListenChangesProps.forEach(key => {