Ma/ueblueprint
1
0
Fork 0
mirror of https://github.com/barsdeveloper/ueblueprint.git synced 2026-03-12 11:07:40 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Small fix for knot creation

Browse Source
This commit is contained in:
barsdeveloper
2022-11-15 16:30:30 +01:00
parent f2c09faedb
commit 900245d69e
11 changed files with 405 additions and 374 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
js/template/KnotNodeTemplate.js
View File

@@ -1,15 +1,14 @@
import { html } from "lit"
import ElementFactory from "../element/ElementFactory"
import ISelectableDraggableTemplate from "./ISelectableDraggableTemplate"
import KnotPinTemplate from "./KnotPinTemplate"
import NodeTemplate from "./NodeTemplate"
/**
* @typedef {import("../element/NodeElement").default} NodeElement
* @typedef {import("../element/PinElement").default} PinElement
*/
/** @extends {ISelectableDraggableTemplate<NodeElement>} */
export default class KnotNodeTemplate extends ISelectableDraggableTemplate {
export default class KnotNodeTemplate extends NodeTemplate {
/** @type {PinElement} */
#inputPin
@@ -29,12 +28,10 @@ export default class KnotNodeTemplate extends ISelectableDraggableTemplate {
`
}
/** @param {Map} changedProperties */
firstUpdated(changedProperties) {
super.firstUpdated(changedProperties)
const content = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-border"))
Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.dispatchReflowEvent())
this.element.getPinElements().forEach(p => content.appendChild(p))
setupPins() {
this.element.getPinElements().forEach(
p => /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-border")).appendChild(p)
)
}
/**

1
js/template/KnotPinTemplate.js
View File

@@ -13,7 +13,6 @@ export default class KnotPinTemplate extends PinTemplate {
getLinkLocation() {
const rect = (
this.element.isInput()
// @ts-expect-error
? /** @type {KnotNodeTemplate} */ (this.element.nodeElement.template).outputPin.template
: this
)

11
js/template/LinkTemplate.js
View File

@@ -64,7 +64,10 @@ export default class LinkTemplate extends IFromToPositionedTemplate {
#createKnot =
/** @param {Number[]} location */
location => {
const knot = /** @type {NodeElement} */(new (ElementFactory.getConstructor("ueb-node"))(new KnotEntity()))
const knotEntity = new KnotEntity({
})
const knot = /** @type {NodeElement} */(new (ElementFactory.getConstructor("ueb-node"))(knotEntity))
knot.setLocation(this.element.blueprint.snapToGrid(location))
const link = new (ElementFactory.getConstructor("ueb-link"))(
/** @type {KnotNodeTemplate} */(knot.template).outputPin,
@@ -98,19 +101,15 @@ export default class LinkTemplate extends IFromToPositionedTemplate {
const isDestinationAKnot = destinationPin?.nodeElement.getType() == Configuration.knotNodeTypeName
if (isSourceAKnot && (!destinationPin || isDestinationAKnot)) {
if (sourcePin?.isInput() && this.element.toX > this.element.fromX + Configuration.distanceThreshold) {
// @ts-expect-error
this.element.sourcePin = /** @type {KnotNodeTemplate} */(sourcePin.nodeElement.template).outputPin
} else if (sourcePin?.isOutput() && this.element.toX < this.element.fromX - Configuration.distanceThreshold) {
// @ts-expect-error
this.element.sourcePin = /** @type {KnotNodeTemplate} */(sourcePin.nodeElement.template).inputPin
}
}
if (isDestinationAKnot && (!isSourceAKnot || isSourceAKnot)) {
if (isDestinationAKnot && (!sourcePin || isSourceAKnot)) {
if (destinationPin?.isInput() && this.element.toX < this.element.fromX + Configuration.distanceThreshold) {
// @ts-expect-error
this.element.destinationPin = /** @type {KnotNodeTemplate} */(destinationPin.nodeElement.template).outputPin
} else if (destinationPin?.isOutput() && this.element.toX > this.element.fromX - Configuration.distanceThreshold) {
// @ts-expect-error
this.element.destinationPin = /** @type {KnotNodeTemplate} */(destinationPin.nodeElement.template).inputPin
}
}

20
js/template/NodeTemplate.js
View File

@@ -10,9 +10,15 @@ import ISelectableDraggableTemplate from "./ISelectableDraggableTemplate"
/** @extends {ISelectableDraggableTemplate<NodeElement>} */
export default class NodeTemplate extends ISelectableDraggableTemplate {
toggleAdvancedDisplayHandler = _ => {
this.element.toggleShowAdvancedPinDisplay()
this.element.addNextUpdatedCallbacks(() => this.element.dispatchReflowEvent(), true)
/** @param {NodeElement} element */
constructed(element) {
super.constructed(element)
if (this.element.advancedPinDisplay) {
this.toggleAdvancedDisplayHandler = () => {
this.element.toggleShowAdvancedPinDisplay()
this.element.addNextUpdatedCallbacks(() => this.element.dispatchReflowEvent(), true)
}
}
}
render() {
@@ -59,9 +65,14 @@ export default class NodeTemplate extends ISelectableDraggableTemplate {
/** @param {Map} changedProperties */
firstUpdated(changedProperties) {
super.firstUpdated(changedProperties)
this.setupPins()
Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.dispatchReflowEvent())
}
setupPins() {
const inputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-inputs"))
const outputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-outputs"))
Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.dispatchReflowEvent())
this.element.nodeNameElement = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-name-text"))
this.element.getPinElements().forEach(p => {
if (p.isInput()) {
inputContainer.appendChild(p)
@@ -69,7 +80,6 @@ export default class NodeTemplate extends ISelectableDraggableTemplate {
outputContainer.appendChild(p)
}
})
this.element.nodeNameElement = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-name-text"))
}
/**

6
js/template/PinTemplate.js
View File

@@ -22,12 +22,6 @@ export default class PinTemplate extends ITemplate {
return this.#iconElement
}
/** @param {PinElement<T>} element */
constructed(element) {
super.constructed(element)
this.element.dataset.id = this.element.getPinId().toString()
}
connectedCallback() {
super.connectedCallback()
this.element.nodeElement = this.element.closest("ueb-node")