Started work on serialization, refactoring

js/ETypesNames.js

@@ -0,0 +1,17 @@
+export default class ETypesNames {
+
+    constructor(type) {
+        switch (type) {
+            case 'Class':
+            case 'None':
+                this.value = type
+                break
+            default:
+                throw new Error('Unexpected type name')
+        }
+    }
+
+    toString() {
+        return this.value
+    }
+}

js/FGuid.js

@@ -0,0 +1,20 @@
+export default class FGuid {
+    constructor(guid) {
+        if (guid?.constructor?.name === 'String') {
+            this.value = guid
+        } else if (guid?.constructor?.name === 'FGuid') {
+            this.value = guid.value
+        } else {
+            let random = new Uint32Array(4);
+            crypto.getRandomValues(random)
+            this.value = ""
+            random.forEach(n => {
+                this.value += ('00000000' + n.toString(16).toUpperCase()).slice(-8)
+            })
+        }
+    }
+
+    toString() {
+        return this.value
+    }
+}

js/UEBlueprintObject.js

@@ -84,10 +84,6 @@ export default class UEBlueprintObject extends USelectableDraggable {
         }
         this.style.setProperty('--ueb-position-x', this.location[0])
         this.style.setProperty('--ueb-position-y', this.location[1])
-
-        let aDiv = document.createElement('div')
-        aDiv.innerHTML = this.render()
-        this.appendChild(aDiv.firstElementChild)
     }
 }
 

js/UGraphEntity.js

@@ -0,0 +1,22 @@
+/**
+ * A Graph Entity is an element that can stay directly (as a first child) on the blueprint grid. Those entities are either nodes or links
+ */
+export default class UGraphEntity extends HTMLElement {
+    constructor() {
+        super()
+        /** @type {import("./UEBlueprint").default}" */
+        this.blueprint = null
+    }
+
+    connectedCallback() {
+        this.blueprint = this.closest('u-blueprint')
+        let aDiv = document.createElement('div')
+        aDiv.innerHTML = this.render()
+        this.appendChild(aDiv.firstElementChild)
+    }
+
+    // Subclasses want to rewrite this
+    render() {
+        return ""
+    }
+}

js/UGraphPin.js

@@ -0,0 +1,70 @@
+import FGuid from "./FGuid";
+
+export default class UGraphPin {
+    constructor(Options) {
+        this.PinId = new FGuid(Options?.PinId)
+        this.PinName = Options?.PinName ?? ""
+        this.PinToolTip = Options?.PinToolTip ?? ""
+        this.PinType = {
+            PinCategory: Options?.PinType?.PinCategory ?? "object",
+            PinSubCategory: Options?.PinType?.PinSubCategory ?? "",
+            PinSubCategoryMemberReference: Options?.PinType?.PinSubCategoryMemberReference ?? "",
+            PinValueType: Options?.PinType?.PinValueType ?? "",
+            PinValueType: Options?.PinType?.ContainerType ?? "None",
+            bIsReference: Options?.PinType?.bIsReference ?? false,
+            bIsConst: Options?.PinType?.bIsConst ?? false,
+            bIsWeakPointer: Options?.PinType?.bIsWeakPointer ?? false,
+            bIsUObjectWrapper: Options?.PinType?.bIsUObjectWrapper ?? false
+        }
+        this.LinkedTo = Options?.LinkedTo ?? null
+        this.DefaultValue = Options?.DefaultValue ?? true
+        this.AutogeneratedDefaultValue = Options?.AutogeneratedDefaultValue ?? false
+        this.PersistentGuid = Options?.PersistentGuid ?? null
+        this.bHidden = Options?.bHidden ?? false
+        this.bNotConnectable = Options?.bNotConnectable ?? false
+        this.bDefaultValueIsReadOnly = Options?.bDefaultValueIsReadOnly ?? false
+        this.bDefaultValueIsIgnored = Options?.bDefaultValueIsIgnored ?? false
+        this.bAdvancedView = Options?.bAdvancedView ?? false
+        this.bOrphanedPin = Options?.bOrphanedPin ?? false
+    }
+
+    static serializeValue(value) {
+        // No quotes
+        if (value === null) {
+            return '()'
+        }
+        if (value?.constructor?.name === 'Boolean') {
+            return value ? 'True' : 'False'
+        }
+        if (value?.constructor?.name === 'ETypesNames' || value?.constructor?.name === 'FGuid') {
+            return value.toString()
+        }
+        // Quotes
+        if (value?.constructor?.name === 'String') {
+            return `"${value}"`
+        }
+    }
+
+    static subSerialize(prefix, object) {
+        let result = ""
+        prefix += prefix != "" ? "." : ""
+        for (const property in object) {
+            if (object[property]?.constructor?.name === 'Object') {
+                result += UGraphPin.subSerialize(prefix + property, object[property])
+            } else {
+                result += `${prefix + property}=${UGraphPin.serializeValue(object[property])},`
+            }
+        }
+        return result
+    }
+
+    serialize() {
+        let result = `CustomProperties Pin (${this.constructor.subSerialize('', this)})`
+        return result
+    }
+
+    toString() {
+        return this.serialize()
+    }
+
+}

js/ULink.js

@@ -0,0 +1,29 @@
+import UBlueprintEntity from "./UBlueprintEntity"
+
+export default class ULink extends UBlueprintEntity {
+
+    /**
+     * 
+     * @typedef {{
+     *      node: String,
+     *      pin: String
+     * }} PinReference
+     * @param {?PinReference} source 
+     * @param {?PinReference} destination 
+     */
+    constructor(source, destination) {
+        super()
+        this.source = source
+        this.destination = destination
+    }
+
+    render() {
+        return `
+            <svg viewBox="0 0 100 100">
+                <line x1="0" y1="80" x2="100" y2="20" stroke="black" />
+            </svg>
+`
+    }
+}
+
+customElements.define('u-link', ULink)

js/USelectableDraggable.js

@@ -1,11 +1,10 @@
 import UDrag from "./input/UDrag"
+import UGraphEntity from "./UGraphEntity"
 
-export default class USelectableDraggable extends HTMLElement {
+export default class USelectableDraggable extends UGraphEntity {
 
     constructor() {
         super()
-        /** @type {import("./UEBlueprint").default}" */
-        this.blueprint = null
         this.dragObject = null
         this.location = [0, 0]
         this.selected = false
@@ -17,7 +16,7 @@ export default class USelectableDraggable extends HTMLElement {
     }
 
     connectedCallback() {
-        this.blueprint = this.closest('u-blueprint')
+        super.connectedCallback()
         this.dragObject = new UDrag(this, null, { // UDrag doesn't need blueprint
             looseTarget: true
         })

js/exporting.js

@@ -1,4 +1,5 @@
 import UEBlueprint from "./UEBlueprint"
 import UEBlueprintObject from "./UEBlueprintObject"
+import UGraphPin from "./UGraphPin"
 
-export { UEBlueprint, UEBlueprintObject }
+export { UEBlueprint, UEBlueprintObject, UGraphPin }

ueblueprint.html

@@ -14,13 +14,15 @@
 <body>
     <div>Hello</div>
     <script type="module">
-        import { UEBlueprint, UEBlueprintObject } from "./ueblueprint.js"
+        import { UEBlueprint, UEBlueprintObject, UGraphPin } from "./ueblueprint.js"
         let blueprint = new UEBlueprint()
 
         let node0 = new UEBlueprintObject(); node0.setLocation([985, 393]); let node1 = new UEBlueprintObject(); node1.setLocation([999, 114]); let node2 = new UEBlueprintObject(); node2.setLocation([811, 253]); let node3 = new UEBlueprintObject(); node3.setLocation([802, 146]); let node4 = new UEBlueprintObject(); node4.setLocation([597, 105]); let node5 = new UEBlueprintObject(); node5.setLocation([789, 233]); let node6 = new UEBlueprintObject(); node6.setLocation([549, 289]); let node7 = new UEBlueprintObject(); node7.setLocation([678, 193]); let node8 = new UEBlueprintObject(); node8.setLocation([1078, 244]); let node9 = new UEBlueprintObject(); node9.setLocation([751, 151]); let node10 = new UEBlueprintObject(); node10.setLocation([1046, -14]); let node11 = new UEBlueprintObject(); node11.setLocation([714, 267]); let node12 = new UEBlueprintObject(); node12.setLocation([767, 36]); let node13 = new UEBlueprintObject(); node13.setLocation([807, 219]); let node14 = new UEBlueprintObject(); node14.setLocation([1031, 70]); let node15 = new UEBlueprintObject(); node15.setLocation([906, 389]); let node16 = new UEBlueprintObject(); node16.setLocation([936, 131]); let node17 = new UEBlueprintObject(); node17.setLocation([689, 249]); let node18 = new UEBlueprintObject(); node18.setLocation([1153, 343]); let node19 = new UEBlueprintObject(); node19.setLocation([626, 209]); blueprint.addNode(node0, node1, node2, node3, node4, node5, node6, node7, node8, node9, node10, node11, node12, node13, node14, node15, node16, node17, node18, node19);
 
         document.querySelector('body').appendChild(blueprint)
-        let a = 123
+        let Pin = new UGraphPin()
+        let a = Pin.serialize()
+        let c = "ciao"
     </script>
     <script type="module">
         /*

ueblueprint.js

@@ -925,12 +925,30 @@ class UDrag extends UMouseClickDrag {
     }
 }
 
-class USelectableDraggable extends HTMLElement {
-
+class UGraphEntity extends HTMLElement {
     constructor() {
         super();
         /** @type {import("./UEBlueprint").default}" */
         this.blueprint = null;
+    }
+
+    connectedCallback() {
+        this.blueprint = this.closest('u-blueprint');
+        let aDiv = document.createElement('div');
+        aDiv.innerHTML = this.render();
+        this.appendChild(aDiv.firstElementChild);
+    }
+
+    // Subclasses want to rewrite this
+    render() {
+        return ""
+    }
+}
+
+class USelectableDraggable extends UGraphEntity {
+
+    constructor() {
+        super();
         this.dragObject = null;
         this.location = [0, 0];
         this.selected = false;
@@ -942,7 +960,7 @@ class USelectableDraggable extends HTMLElement {
     }
 
     connectedCallback() {
-        this.blueprint = this.closest('u-blueprint');
+        super.connectedCallback();
         this.dragObject = new UDrag(this, null, { // UDrag doesn't need blueprint
             looseTarget: true
         });
@@ -1079,13 +1097,103 @@ class UEBlueprintObject extends USelectableDraggable {
         }
         this.style.setProperty('--ueb-position-x', this.location[0]);
         this.style.setProperty('--ueb-position-y', this.location[1]);
-
-        let aDiv = document.createElement('div');
-        aDiv.innerHTML = this.render();
-        this.appendChild(aDiv.firstElementChild);
     }
 }
 
 customElements.define('u-object', UEBlueprintObject);
 
-export { UEBlueprint, UEBlueprintObject };
+class FGuid {
+    constructor(guid) {
+        if (guid?.constructor?.name === 'String') {
+            this.value = guid;
+        } else if (guid?.constructor?.name === 'FGuid') {
+            this.value = guid.value;
+        } else {
+            let random = new Uint32Array(4);
+            crypto.getRandomValues(random);
+            this.value = "";
+            random.forEach(n => {
+                this.value += ('00000000' + n.toString(16).toUpperCase()).slice(-8);
+            });
+        }
+    }
+
+    toString() {
+        return this.value
+    }
+}
+
+class UGraphPin {
+    constructor(Options) {
+        this.PinId = new FGuid(Options?.PinId);
+        this.PinName = Options?.PinName ?? "";
+        this.PinToolTip = Options?.PinToolTip ?? "";
+        this.PinType = {
+            PinCategory: Options?.PinType?.PinCategory ?? "object",
+            PinSubCategory: Options?.PinType?.PinSubCategory ?? "",
+            PinSubCategoryMemberReference: Options?.PinType?.PinSubCategoryMemberReference ?? "",
+            PinValueType: Options?.PinType?.PinValueType ?? "",
+            PinValueType: Options?.PinType?.ContainerType ?? "None",
+            bIsReference: Options?.PinType?.bIsReference ?? false,
+            bIsConst: Options?.PinType?.bIsConst ?? false,
+            bIsWeakPointer: Options?.PinType?.bIsWeakPointer ?? false,
+            bIsUObjectWrapper: Options?.PinType?.bIsUObjectWrapper ?? false,
+            alpha: Object.assign({}, {
+                ciao: 1,
+                arrivederci: "2",
+                beta: {
+                    autunno: "autunno",
+                    inverno: "inverno"
+                }
+            })
+        };
+        this.LinkedTo = Options?.LinkedTo ?? null;
+        this.DefaultValue = Options?.DefaultValue ?? true;
+        this.AutogeneratedDefaultValue = Options?.AutogeneratedDefaultValue ?? false;
+        this.PersistentGuid = Options?.PersistentGuid ?? null;
+        this.bHidden = Options?.bHidden ?? false;
+        this.bNotConnectable = Options?.bNotConnectable ?? false;
+        this.bDefaultValueIsReadOnly = Options?.bDefaultValueIsReadOnly ?? false;
+        this.bDefaultValueIsIgnored = Options?.bDefaultValueIsIgnored ?? false;
+        this.bAdvancedView = Options?.bAdvancedView ?? false;
+        this.bOrphanedPin = Options?.bOrphanedPin ?? false;
+    }
+
+    static serializeValue(value) {
+        // No quotes
+        if (value === null) {
+            return '()'
+        }
+        if (value?.constructor?.name === 'Boolean') {
+            return value ? 'True' : 'False'
+        }
+        if (value?.constructor?.name === 'ETypesNames' || value?.constructor?.name === 'FGuid') {
+            return value.toString()
+        }
+        // Quotes
+        if (value?.constructor?.name === 'String') {
+            return `"${value}"`
+        }
+    }
+
+    static subSerialize(prefix, object) {
+        let result = "";
+        prefix += prefix != "" ? "." : "";
+        for (const property in object) {
+            if (object[property]?.constructor?.name === 'Object') {
+                result += UGraphPin.subSerialize(prefix + property, object[property]);
+            } else {
+                result += `${prefix + property}=${UGraphPin.serializeValue(object[property])},`;
+            }
+        }
+        return result
+    }
+
+    serialize() {
+        let result = `Pin (${this.constructor.subSerialize('', this)})`;
+        return result
+    }
+
+}
+
+export { UEBlueprint, UEBlueprintObject, UGraphPin };