added deserialization of node port and frame port names

nodeEditor/src/diagram/nodePort.ts

@@ -131,7 +131,7 @@ export class NodePort {
         if (!displayManager || displayManager.shouldDisplayPortLabels(block)) {
             let portLabel = root.ownerDocument!.createElement("div");
             portLabel.classList.add("port-label");
-            portLabel.innerHTML = connectionPoint.name;        
+            portLabel.innerHTML = connectionPoint.displayName || connectionPoint.name;        
             portContainer.appendChild(portLabel);
         }
     

src/Materials/Node/nodeMaterialBlock.ts

@@ -656,11 +656,16 @@ export class NodeMaterialBlock {
         serializationObject.comments = this.comments;
 
         serializationObject.inputs = [];
+        serializationObject.outputs = [];
 
         for (var input of this.inputs) {
             serializationObject.inputs.push(input.serialize());
         }
 
+        for (var output of this.outputs) {
+            serializationObject.outputs.push(output.serialize());
+        }
+
         return serializationObject;
     }
 
@@ -668,6 +673,26 @@ export class NodeMaterialBlock {
     public _deserialize(serializationObject: any, scene: Scene, rootUrl: string) {
         this.name = serializationObject.name;
         this.comments = serializationObject.comments;
+        this._deserializePortDisplayNames(serializationObject);
+    }
+
+    public _deserializePortDisplayNames(serializationObject: any) {
+        const serializedInputs = serializationObject.inputs;
+        const serializedOutputs = serializationObject.outputs;
+        if (serializedInputs) {
+            serializedInputs.forEach((port: any, i: number) => {
+                if(port.displayName) {
+                    this.inputs[i].displayName = port.displayName;
+                }
+            })
+        } 
+        if (serializedOutputs) {
+            serializedOutputs.forEach((port: any, i: number) => {
+                if(port.displayName) {
+                    this.outputs[i].displayName = port.displayName;
+                }
+            })
+        } 
     }
 
     /**

src/Materials/Node/nodeMaterialBlockConnectionPoint.ts

@@ -437,10 +437,10 @@ export class NodeMaterialConnectionPoint {
         let serializationObject: any = {};
 
         serializationObject.name = this.name;
+        serializationObject.displayName = this.displayName;
 
         if (this.connectedPoint) {
             serializationObject.inputName = this.name;
-            serializationObject.displayName = this.displayName;
             serializationObject.targetBlockId = this.connectedPoint.ownerBlock.uniqueId;
             serializationObject.targetConnectionName = this.connectedPoint.name;
         }
@@ -448,6 +448,19 @@ export class NodeMaterialConnectionPoint {
         return serializationObject;
     }
 
+    // /**
+    //  * Parses JSON representation into a new NodeMaterialConnectionPoint
+    //  * @returns the serialized point object
+    //  */
+    // public parse(serializationData: any ): NodeMaterialConnectionPoint {
+    //     const newConnectionPoint  = new NodeMaterialConnectionPoint(serializationData.name, serializationData.ownerBlock, serializationData.direction);
+
+    //     newConnectionPoint.
+
+
+    //     return newConnectionPoint;
+    // }
+
     /**
      * Release resources
      */