Vector input type implemented

2026-02-21 06:05:45 +08:00 · 2022-09-18 15:13:48 +02:00
parent aa54bd0627
commit 4e715568fe
22 changed files with 312 additions and 228 deletions
--- a/js/Configuration.js
+++ b/js/Configuration.js
@@ -45,13 +45,14 @@ export default class Configuration {
    static nodeRadius = 8 // in pixel
    static nodeReflowEventName = "ueb-node-reflow"
    static pinColor = {
+        "/Script/CoreUObject.LinearColor": css`3, 76, 168`, // #034ca8
+        "/Script/CoreUObject.Vector": css`182, 146, 28`, // b6921c
        "bool": css`117, 0, 0`, // #750000
        "default": css`167, 167, 167`, // #a7a7a7
        "exec": css`167, 167, 167`, // #a7a7a7
        "name": css`203, 129, 252`, // #cb81fc
        "real": css`50, 187, 0`, // #32bb00
        "string": css`213, 0, 176`, // #d500b0
-        "/Script/CoreUObject.LinearColor": css`3, 76, 168` // #034ca8
    }
    static selectAllKeyboardKey = "(bCtrl=True,Key=A)"
    static trackingMouseEventName = {
--- a/js/Utility.js
+++ b/js/Utility.js
@@ -224,6 +224,14 @@ export default class Utility {
            .replaceAll(/(?<=[a-z])(?=[A-Z])|_|\s+/g, " ") // Insert a space between a lowercase and uppercase letter, instead of an underscore or multiple spaces
    }

+    /** @param {String} value */
+    static getIdFromReference(value) {
+        return value
+            .replace(/(?:.+\.)?([^\.]+)$/, "$1")
+            .replaceAll(/(?<=[a-z\d])(?=[A-Z])|(?<=[a-zA-Z])(?=\d)|(?<=[A-Z]{2})(?=[A-Z][a-z])/g, "-")
+            .toLocaleLowerCase()
+    }
+
    /** @param {LinearColorEntity} value */
    static printLinearColor(value) {
        return `${Math.round(value.R * 255)}, ${Math.round(value.G * 255)}, ${Math.round(value.B * 255)}`
--- a/js/element/NodeElement.js
+++ b/js/element/NodeElement.js
@@ -40,6 +40,7 @@ export default class NodeElement extends ISelectableDraggableElement {
            type: Boolean,
            converter: Utility.booleanConverter,
            attribute: "data-pure-function",
+            reflect: true,
        }
    }

--- a/js/element/PinElement.js
+++ b/js/element/PinElement.js
@@ -101,9 +101,7 @@ export default class PinElement extends IElement {
        this.requestUpdate("defaultValue", oldValue)
    }

-    /**
-     * @param {PinEntity} entity
-     */
+    /** @param {PinEntity} entity */
    constructor(entity) {
        super(
            entity,
@@ -144,9 +142,7 @@ export default class PinElement extends IElement {
        return this.GetPinId().value
    }

-    /**
-     * @returns {String}
-     */
+    /** @returns {String} */
    getPinName() {
        return this.entity.PinName
    }
@@ -179,9 +175,7 @@ export default class PinElement extends IElement {
        return this.template.getLinkLocation(this)
    }

-    /**
-     * @returns {NodeElement}
-     */
+    /** @returns {NodeElement} */
    getNodeElement() {
        return this.nodeElement
    }
@@ -207,17 +201,13 @@ export default class PinElement extends IElement {
        })
    }

-    /**
-     * @param {PinElement} targetPinElement
-     */
+    /** @param {PinElement} targetPinElement */
    linkTo(targetPinElement) {
        this.entity.linkTo(targetPinElement.getNodeElement().getNodeName(), targetPinElement.entity)
        this.isLinked = this.entity.isLinked()
    }

-    /**
-     * @param {PinElement} targetPinElement
-     */
+    /** @param {PinElement} targetPinElement */
    unlinkFrom(targetPinElement) {
        this.entity.unlinkFrom(targetPinElement.getNodeElement().getNodeName(), targetPinElement.entity)
        this.isLinked = this.entity.isLinked()
--- a/js/entity/PinEntity.js
+++ b/js/entity/PinEntity.js
@@ -5,7 +5,7 @@ import LinearColorEntity from "./LinearColorEntity"
 import LocalizedTextEntity from "./LocalizedTextEntity"
 import ObjectReferenceEntity from "./ObjectReferenceEntity"
 import PinReferenceEntity from "./PinReferenceEntity"
-import SerializedType from "./SerializedType"
+import SimpleSerializationVectorEntity from "./SimpleSerializationVectorEntity"
 import TypeInitialization from "./TypeInitialization"
 import VectorEntity from "./VectorEntity"

@@ -20,8 +20,8 @@ export default class PinEntity extends IEntity {
        "real": Number,
        "string": String,
    }
-    static get typeEntityMap() {
-        return PinEntity.#typeEntityMap
+    static #alternativeTypeEntityMap = {
+        "/Script/CoreUObject.Vector": SimpleSerializationVectorEntity,
    }
    static lookbehind = "Pin"
    static attributes = {
@@ -48,7 +48,7 @@ export default class PinEntity extends IEntity {
            new CalculatedType(
                /** @param {PinEntity} pinEntity */
                pinEntity => new TypeInitialization(
-                    PinEntity.typeEntityMap[pinEntity.getType()] ?? String,
+                    PinEntity.getEntityType(pinEntity.getType(), true) ?? String,
                    false,
                    undefined,
                    true
@@ -65,6 +65,13 @@ export default class PinEntity extends IEntity {
        bOrphanedPin: false,
    }

+    static getEntityType(typeString, alternative = false) {
+        const [entity, alternativeEntity] = [this.#typeEntityMap[typeString], this.#alternativeTypeEntityMap[typeString]]
+        return alternative && alternativeEntity !== undefined
+            ? alternativeEntity
+            : entity
+    }
+
    getType() {
        if (this.PinType.PinCategory == "struct") {
            return this.PinType.PinSubCategoryObject.path
--- a/js/entity/SimpleSerializationVectorEntity.js
+++ b/js/entity/SimpleSerializationVectorEntity.js
@@ -0,0 +1,4 @@
+import VectorEntity from "./VectorEntity";
+
+export default class SimpleSerializationVectorEntity extends VectorEntity {
+}
--- a/js/serialization/Grammar.js
+++ b/js/serialization/Grammar.js
@@ -12,7 +12,7 @@ import Parsimmon from "parsimmon"
 import PathSymbolEntity from "../entity/PathSymbolEntity"
 import PinEntity from "../entity/PinEntity"
 import PinReferenceEntity from "../entity/PinReferenceEntity"
-import SerializedType from "../entity/SerializedType"
+import SimpleSerializationVectorEntity from "../entity/SimpleSerializationVectorEntity"
 import TypeInitialization from "../entity/TypeInitialization"
 import Utility from "../Utility"
 import VectorEntity from "../entity/VectorEntity"
@@ -58,6 +58,8 @@ export default class Grammar {
                return r.PinReference
            case VectorEntity:
                return r.Vector
+            case SimpleSerializationVectorEntity:
+                return r.SimpleSerializationVectorEntity
            case LinearColorEntity:
                return r.LinearColor
            case FunctionReferenceEntity:
@@ -108,7 +110,7 @@ export default class Grammar {
                .sepBy(P.string(",")) // Assignments are separated by comma
                .skip(P.regex(/,?/).then(P.optWhitespace)), // Optional trailing comma and maybe additional space
            P.string(')'),
-            (_, attributes, __) => {
+            (_0, attributes, _2) => {
                let values = {}
                attributes.forEach(attributeSetter => attributeSetter(values))
                return new entityType(values)
@@ -181,25 +183,25 @@ export default class Grammar {
            ]),
        P.seqMap(
            r.Word, // Goes into referenceType
-            P.optWhitespace, // Goes into _ (ignored)
+            P.optWhitespace, // Goes into _1 (ignored)
            P.alt(...[r.ReferencePath].flatMap(referencePath => [
                referencePath.wrap(P.string(`"`), P.string(`"`)),
                referencePath.wrap(P.string(`'"`), P.string(`"'`))
            ])), // Goes into referencePath
-            (referenceType, _, referencePath) => new ObjectReferenceEntity({ type: referenceType, path: referencePath })
+            (referenceType, _1, referencePath) => new ObjectReferenceEntity({ type: referenceType, path: referencePath })
        ),
        r.Word.map(type => new ObjectReferenceEntity({ type: type, path: "" })),
    )

    LocalizedText = r => P.seqMap(
-        P.string(LocalizedTextEntity.lookbehind).skip(P.optWhitespace).skip(P.string("(")), // Goes into _ (ignored)
+        P.string(LocalizedTextEntity.lookbehind).skip(P.optWhitespace).skip(P.string("(")), // Goes into _0 (ignored)
        r.String.trim(P.optWhitespace), // Goes into namespace
-        P.string(","), // Goes into __ (ignored)
+        P.string(","), // Goes into _2 (ignored)
        r.String.trim(P.optWhitespace), // Goes into key
-        P.string(","), // Goes into ___ (ignored)
+        P.string(","), // Goes into _4 (ignored)
        r.String.trim(P.optWhitespace), // Goes into value
-        P.string(")"), // Goes into ____ (ignored)
-        (_, namespace, __, key, ___, value, ____) => new LocalizedTextEntity({
+        P.string(")"), // Goes into _6 (ignored)
+        (_0, namespace, _2, key, _4, value, _6) => new LocalizedTextEntity({
            namespace: namespace,
            key: key,
            value: value
@@ -239,6 +241,19 @@ export default class Grammar {

    Vector = r => Grammar.createEntityGrammar(r, VectorEntity)

+    SimpleSerializationVectorEntity = r => P.seqMap(
+        r.Number,
+        P.string(",").trim(P.optWhitespace),
+        r.Number,
+        P.string(",").trim(P.optWhitespace),
+        r.Number,
+        (x, _1, y, _3, z) => new SimpleSerializationVectorEntity({
+            X: x,
+            Y: y,
+            Z: z,
+        })
+    )
+
    LinearColor = r => Grammar.createEntityGrammar(r, LinearColorEntity)

    FunctionReference = r => Grammar.createEntityGrammar(r, FunctionReferenceEntity)
--- a/js/serialization/initializeSerializerFactory.js
+++ b/js/serialization/initializeSerializerFactory.js
@@ -15,8 +15,10 @@ import PathSymbolEntity from "../entity/PathSymbolEntity"
 import PinEntity from "../entity/PinEntity"
 import PinReferenceEntity from "../entity/PinReferenceEntity"
 import SerializerFactory from "./SerializerFactory"
+import SimpleSerializationVectorEntity from "../entity/SimpleSerializationVectorEntity"
 import ToStringSerializer from "./ToStringSerializer"
 import Utility from "../Utility"
+import VectorEntity from "../entity/VectorEntity"

 export default function initializeSerializerFactory() {

@@ -139,4 +141,18 @@ export default function initializeSerializerFactory() {
            String
        )
    )
+
+    SerializerFactory.registerSerializer(
+        SimpleSerializationVectorEntity,
+        new CustomSerializer(
+            /** @param {SimpleSerializationVectorEntity} value */
+            (value, insideString) => `${value.X}, ${value.Y}, ${value.Z}`,
+            SimpleSerializationVectorEntity
+        )
+    )
+
+    SerializerFactory.registerSerializer(
+        VectorEntity,
+        new GeneralSerializer(bracketsWrapped, VectorEntity)
+    )
 }
--- a/js/template/BlueprintTemplate.js
+++ b/js/template/BlueprintTemplate.js
@@ -12,6 +12,7 @@ import Select from "../input/mouse/Select"
 import SelectorElement from "../element/SelectorElement"
 import Unfocus from "../input/mouse/Unfocus"
 import Zoom from "../input/mouse/Zoom"
+import Utility from "../Utility"

 /**
 * @typedef {import("../Blueprint").default} Blueprint
@@ -32,13 +33,14 @@ export default class BlueprintTemplate extends ITemplate {
        "--ueb-grid-size": `${Configuration.gridSize}px`,
        "--ueb-link-min-width": `${Configuration.linkMinWidth}`,
        "--ueb-node-radius": `${Configuration.nodeRadius}px`,
-        "--ueb-pin-bool-color": `${Configuration.pinColor["bool"]}`,
-        "--ueb-pin-default-color": `${Configuration.pinColor["default"]}`,
-        "--ueb-pin-exec-color": `${Configuration.pinColor["exec"]}`,
-        "--ueb-pin-name-color": `${Configuration.pinColor["name"]}`,
-        "--ueb-pin-real-color": `${Configuration.pinColor["real"]}`,
-        "--ueb-pin-string-color": `${Configuration.pinColor["string"]}`,
-        "--ueb-pin-linear-color": `${Configuration.pinColor["/Script/CoreUObject.LinearColor"]}`,
+        ...Object.entries(Configuration.pinColor)
+            .map(([k, v]) => ({
+                [`--ueb-pin-color-${Utility.getIdFromReference(k)}`]: v.toString()
+            }))
+            .reduce((acc, cur) => ({
+                ...acc,
+                ...cur,
+            }), {}),
    }

    /**
--- a/js/template/IInputPinTemplate.js
+++ b/js/template/IInputPinTemplate.js
@@ -53,9 +53,7 @@ export default class IInputPinTemplate extends PinTemplate {
        }
    }

-    /**
-     * @param {PinElement} pin
-     */
+    /** @param {PinElement} pin */
    cleanup(pin) {
        super.cleanup(pin)
        this.#inputContentElements.forEach(element => {
@@ -64,9 +62,7 @@ export default class IInputPinTemplate extends PinTemplate {
        })
    }

-    /**
-     * @param {PinElement} pin
-     */
+    /** @param {PinElement} pin */
    createInputObjects(pin) {
        return [
            ...super.createInputObjects(pin),
@@ -74,16 +70,12 @@ export default class IInputPinTemplate extends PinTemplate {
        ]
    }

-    /**
-     * @param {PinElement} pin
-     */
+    /** @param {PinElement} pin */
    getInput(pin) {
        return this.getInputs(pin).reduce((acc, cur) => acc + cur, "")
    }

-    /**
-     * @param {PinElement} pin
-     */
+    /** @param {PinElement} pin */
    getInputs(pin) {
        return this.#inputContentElements.map(element =>
            // Faster than innerText which causes reflow
@@ -108,9 +100,7 @@ export default class IInputPinTemplate extends PinTemplate {
        }
    }

-    /**
-     * @param {PinElement} pin
-     */
+    /** @param {PinElement} pin */
    renderInput(pin) {
        if (pin.isInput()) {
            return html`
--- a/js/template/RealPinTemplate.js
+++ b/js/template/RealPinTemplate.js
@@ -12,18 +12,23 @@ export default class RealPinTemplate extends IInputPinTemplate {
     * @param {String[]?} values
     */
    setInputs(pin, values = []) {
-        let num = parseFloat(values.length ? values[0] : this.getInput(pin))
+        if (!values || values.length == 0) {
+            values = this.getInput(pin)
+        }
        let updateDefaultValue = true
-        if (isNaN(num)) {
-            num = parseFloat(pin.entity.DefaultValue != ""
-                ? /** @type {String} */(pin.entity.DefaultValue)
-                : pin.entity.AutogeneratedDefaultValue)
+        for (let i = 0; i < values.length; ++i) {
+            let num = parseFloat(values[i])
+            if (isNaN(num)) {
+                num = parseFloat(pin.entity.DefaultValue != ""
+                    ? /** @type {String} */(pin.entity.DefaultValue)
+                    : pin.entity.AutogeneratedDefaultValue)
+            }
+            if (isNaN(num)) {
+                num = 0
+                updateDefaultValue = false
+            }
+            values[i] = Utility.minDecimals(num)
        }
-        if (isNaN(num)) {
-            num = 0
-            updateDefaultValue = false
-        }
-        values[0] = Utility.minDecimals(num)
        super.setInputs(pin, values, updateDefaultValue)
    }
 }
--- a/js/template/VectorPinTemplate.js
+++ b/js/template/VectorPinTemplate.js
@@ -1,50 +1,35 @@
 import { html } from "lit"
 import IInputPinTemplate from "./IInputPinTemplate"
+import RealPinTemplate from "./RealPinTemplate"

 /**
 * @typedef {import("../element/PinElement").default} PinElement
 * @typedef {import("../entity/LinearColorEntity").default} LinearColorEntity}
 */

-export default class VectorPinTemplate extends IInputPinTemplate {
+export default class VectorPinTemplate extends RealPinTemplate {

-    /** @type {HTMLInputElement} */
-    #input
-
-    /**
-     * @param {PinElement} pin
-     * @param {Map} changedProperties
-     */
-    firstUpdated(pin, changedProperties) {
-        super.firstUpdated(pin, changedProperties)
-        this.#input = pin.querySelector(".ueb-pin-input")
-    }
-
-    /**
-     * @param {PinElement} pin
-     */
-    getInputs(pin) {
-        return [this.#input.dataset.linearColor]
-    }
-
-    /**
-     * @param {PinElement} pin
-     * @param {String[]} value
-     */
-    setInputs(pin, value = []) {
-    }
-
-    /**
-     * @param {PinElement} pin
-     */
+    /** @param {PinElement} pin */
    renderInput(pin) {
        if (pin.isInput()) {
            return html`
+                <span class="ueb-pin-input-label">X</span>
                <div class="ueb-pin-input">
-                    <span class="ueb-pin-input-x" role="textbox" contenteditable="true" .innerText=${pin.unreactiveDefaultValue}></span>
+                    <span class="ueb-pin-input-content ueb-pin-input-x" role="textbox" contenteditable="true"
+                        .innerText="${IInputPinTemplate.stringFromUEToInput(pin.unreactiveDefaultValue.X.toString())}"></span>
+                </div>
+                <span class="ueb-pin-input-label">Y</span>
+                <div class="ueb-pin-input">
+                    <span class="ueb-pin-input-content ueb-pin-input-y" role="textbox" contenteditable="true"
+                        .innerText="${IInputPinTemplate.stringFromUEToInput(pin.unreactiveDefaultValue.Y.toString())}"></span>
+                </div>
+                <span class="ueb-pin-input-label">Z</span>
+                <div class="ueb-pin-input">
+                    <span class="ueb-pin-input-content ueb-pin-input-z" role="textbox" contenteditable="true"
+                        .innerText="${IInputPinTemplate.stringFromUEToInput(pin.unreactiveDefaultValue.Z.toString())}"></span>
                </div>
            `
        }
-        return super.renderInput(pin)
+        return html``
    }
 }