Ma/ueblueprint
1
0
Fork 0
mirror of https://github.com/barsdeveloper/ueblueprint.git synced 2026-02-03 23:55:04 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

New keys for object, refactoring.

Browse Source
This commit is contained in:
barsdeveloper
2021-12-05 20:49:07 +01:00
parent 07afb4bcb9
commit 76ae9ed3c0
26 changed files with 165 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files

161
dist/ueblueprint.js vendored
View File

@@ -34,7 +34,7 @@ class Template {
* @returns The rendered elements
*/
getElements(entity) {
let aDiv = document.createElement('div');
let aDiv = document.createElement("div");
aDiv.innerHTML = this.render(entity);
return aDiv.childNodes
}
@@ -148,7 +148,7 @@ class Utility {
}
static getScale(element) {
return getComputedStyle(element).getPropertyValue('--ueb-scale')
return getComputedStyle(element).getPropertyValue("--ueb-scale")
}
/**
@@ -270,8 +270,8 @@ class MouseClickDrag extends Pointing {
e.stopPropagation();
self.started = false;
// Attach the listeners
movementListenedElement.addEventListener('mousemove', self.mouseStartedMovingHandler);
document.addEventListener('mouseup', self.mouseUpHandler);
movementListenedElement.addEventListener("mousemove", self.mouseStartedMovingHandler);
document.addEventListener("mouseup", self.mouseUpHandler);
self.clickedPosition = self.getLocation(e);
self.clicked(self.clickedPosition);
}
@@ -289,8 +289,8 @@ class MouseClickDrag extends Pointing {
e.stopPropagation();
// Delegate from now on to self.mouseMoveHandler
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler);
movementListenedElement.addEventListener('mousemove', self.mouseMoveHandler);
movementListenedElement.removeEventListener("mousemove", self.mouseStartedMovingHandler);
movementListenedElement.addEventListener("mousemove", self.mouseMoveHandler);
// Do actual actions
self.startDrag();
@@ -308,16 +308,16 @@ class MouseClickDrag extends Pointing {
this.mouseUpHandler = e => {
if (!self.exitAnyButton || e.button == self.clickButton) {
// Remove the handlers of "mousemove" and "mouseup"
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler);
movementListenedElement.removeEventListener('mousemove', self.mouseMoveHandler);
document.removeEventListener('mouseup', self.mouseUpHandler);
movementListenedElement.removeEventListener("mousemove", self.mouseStartedMovingHandler);
movementListenedElement.removeEventListener("mousemove", self.mouseMoveHandler);
document.removeEventListener("mouseup", self.mouseUpHandler);
self.endDrag();
}
};
this.target.addEventListener('mousedown', this.mouseDownHandler);
this.target.addEventListener("mousedown", this.mouseDownHandler);
if (this.clickButton == 2) {
this.target.addEventListener('contextmenu', this.preventDefault);
this.target.addEventListener("contextmenu", this.preventDefault);
}
}
@@ -327,9 +327,9 @@ class MouseClickDrag extends Pointing {
unlistenDOMElement() {
super.unlistenDOMElement();
this.target.removeEventListener('mousedown', this.mouseDownHandler);
this.target.removeEventListener("mousedown", this.mouseDownHandler);
if (this.clickButton == 2) {
this.target.removeEventListener('contextmenu', this.preventDefault);
this.target.removeEventListener("contextmenu", this.preventDefault);
} blueprintunfocusHandler;
}
@@ -369,7 +369,7 @@ class GraphElement extends HTMLElement {
}
connectedCallback() {
this.blueprint = this.closest('u-blueprint');
this.blueprint = this.closest("u-blueprint");
this.append(...this.template.getElements(this.entity));
}
}
@@ -703,7 +703,7 @@ class GraphSelector extends GraphElement {
connectedCallback() {
super.connectedCallback();
this.classList.add('ueb-selector');
this.classList.add("ueb-selector");
this.dataset.selecting = "false";
}
@@ -714,11 +714,11 @@ class GraphSelector extends GraphElement {
startSelecting(initialPosition) {
initialPosition = this.blueprint.compensateTranslation(initialPosition);
// Set initial position
this.style.setProperty('--ueb-select-from-x', initialPosition[0]);
this.style.setProperty('--ueb-select-from-y', initialPosition[1]);
this.style.setProperty("--ueb-select-from-x", initialPosition[0]);
this.style.setProperty("--ueb-select-from-y", initialPosition[1]);
// Final position coincide with the initial position, at the beginning of selection
this.style.setProperty('--ueb-select-to-x', initialPosition[0]);
this.style.setProperty('--ueb-select-to-y', initialPosition[1]);
this.style.setProperty("--ueb-select-to-x", initialPosition[0]);
this.style.setProperty("--ueb-select-to-y", initialPosition[1]);
this.dataset.selecting = "true";
this.selectionModel = new FastSelectionModel(initialPosition, this.blueprint.getNodes(), this.blueprint.nodeBoundariesSupplier, this.blueprint.nodeSelectToggleFunction);
}
@@ -729,8 +729,8 @@ class GraphSelector extends GraphElement {
*/
doSelecting(finalPosition) {
finalPosition = this.blueprint.compensateTranslation(finalPosition);
this.style.setProperty('--ueb-select-to-x', finalPosition[0]);
this.style.setProperty('--ueb-select-to-y', finalPosition[1]);
this.style.setProperty("--ueb-select-to-x", finalPosition[0]);
this.style.setProperty("--ueb-select-to-y", finalPosition[1]);
this.selectionModel.selectTo(finalPosition);
}
@@ -740,7 +740,7 @@ class GraphSelector extends GraphElement {
}
}
customElements.define('u-selector', GraphSelector);
customElements.define("u-selector", GraphSelector);
class MouseTracking extends Pointing {
@@ -993,7 +993,7 @@ class NodeTemplate extends Template {
${output.getPinDisplayName()}
<span class="ueb-node-value-icon ${outputs[index].connected ? 'ueb-node-value-fill' : ''}"></span>
</div>
`).join("") ?? ''}
`).join('') ?? ''}
</div>
</div>
`
@@ -1028,6 +1028,30 @@ class FunctionReferenceEntity extends Entity {
}
}
class IntegerEntity extends Entity {
static attributes = {
value: Number
}
getAttributes() {
return IntegerEntity.attributes
}
constructor(options = { value: 0 }) {
options.value = Math.round(options.value);
super(options);
}
valueOf() {
return this.value
}
toString() {
return this.value.toString()
}
}
class VariableReferenceEntity extends Entity {
static attributes = {
@@ -1049,10 +1073,13 @@ class ObjectEntity extends Entity {
bIsPureFunc: new TypeInitialization(Boolean, false, false),
VariableReference: new TypeInitialization(VariableReferenceEntity, false, null),
FunctionReference: new TypeInitialization(FunctionReferenceEntity, false, null,),
EventReference: new TypeInitialization(FunctionReferenceEntity, false, null,),
TargetType: new TypeInitialization(ObjectReferenceEntity, false, null),
NodePosX: 0,
NodePosY: 0,
NodePosX: IntegerEntity,
NodePosY: IntegerEntity,
NodeGuid: GuidEntity,
ErrorType: new TypeInitialization(IntegerEntity, false),
ErrorMsg: new TypeInitialization(String, false, ""),
CustomProperties: [PinEntity]
}
@@ -1086,7 +1113,7 @@ class Drag extends MouseClickDrag {
startDrag() {
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = parseInt(getComputedStyle(this.target).getPropertyValue('--ueb-grid-snap'));
this.stepSize = parseInt(getComputedStyle(this.target).getPropertyValue("--ueb-grid-snap"));
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = 1;
}
@@ -1137,8 +1164,8 @@ class SelectableDraggable extends GraphElement {
setLocation(value = [0, 0]) {
this.location = value;
this.style.setProperty('--ueb-position-x', this.location[0]);
this.style.setProperty('--ueb-position-y', this.location[1]);
this.style.setProperty("--ueb-position-x", this.location[0]);
this.style.setProperty("--ueb-position-y", this.location[1]);
}
addLocation(value) {
@@ -1150,7 +1177,7 @@ class SelectableDraggable extends GraphElement {
this.blueprint.unselectAll();
this.setSelected(true);
}
let dragEvent = new CustomEvent('uDragSelected', {
let dragEvent = new CustomEvent("uDragSelected", {
detail: {
instigator: this,
value: value
@@ -1168,11 +1195,11 @@ class SelectableDraggable extends GraphElement {
}
this.selected = value;
if (this.selected) {
this.classList.add('ueb-selected');
this.blueprint.addEventListener('uDragSelected', this.dragHandler);
this.classList.add("ueb-selected");
this.blueprint.addEventListener("uDragSelected", this.dragHandler);
} else {
this.classList.remove('ueb-selected');
this.blueprint.removeEventListener('uDragSelected', this.dragHandler);
this.classList.remove("ueb-selected");
this.blueprint.removeEventListener("uDragSelected", this.dragHandler);
}
}
}
@@ -1255,27 +1282,7 @@ class GraphNode extends SelectableDraggable {
}
}
customElements.define('u-node', GraphNode);
class IntegerEntity extends Entity {
static attributes = {
value: Number
}
getAttributes() {
return IntegerEntity.attributes
}
constructor(options = {}) {
super(options);
this.value = Math.round(value);
}
toString() {
return this.value.toString()
}
}
customElements.define("u-node", GraphNode);
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -1301,9 +1308,9 @@ class Grammar {
Null = r => P.seq(P.string("("), r.InlineOptWhitespace, P.string(")")).map(_ => null).desc("null: ()")
None = _ => P.string("None").map(_ => new ObjectReferenceEntity({ type: "None", path: "" })).desc("none")
Boolean = _ => P.alt(P.string("True"), P.string("False")).map(v => v === "True" ? true : false).desc("either True or False")
Number = _ => P.regex(/[0-9]+(?:\.[0-9]+)?/).map(Number).desc("a number")
Integer = _ => P.regex(/[0-9]+/).map(v => new IntegerEntity({ value: v })).desc("an integer")
String = _ => P.regex(/(?:[^"\\]|\\")*/).wrap(P.string('"'), P.string('"')).desc('string (with possibility to escape the quote using \")')
Number = _ => P.regex(/[\-\+]?[0-9]+(?:\.[0-9]+)?/).map(Number).desc("a number")
Integer = _ => P.regex(/[\-\+]?[0-9]+/).map(v => new IntegerEntity({ value: v })).desc("an integer")
String = _ => P.regex(/(?:[^"\\]|\\.)*/).wrap(P.string('"'), P.string('"')).desc('string (with possibility to escape the quote using \")')
Word = _ => P.regex(/[a-zA-Z]+/).desc("a word")
Guid = _ => P.regex(/[0-9a-zA-Z]{32}/).map(v => new GuidEntity({ value: v })).desc("32 digit hexadecimal (accepts all the letters for safety) value")
PathSymbolEntity = _ => P.regex(/[0-9a-zA-Z_]+/).map(v => new PathSymbolEntity({ value: v }))
@@ -1619,15 +1626,19 @@ class Paste extends Context {
left = Math.min(left, node.location[0]);
return node
});
if (nodes.length > 0) {
this.blueprint.unselectAll();
}
let mousePosition = this.blueprint.entity.mousePosition;
this.blueprint.addNode(...nodes);
nodes.forEach(node => {
const locationOffset = [
mousePosition[0] - left,
mousePosition[1] - top
];
node.addLocation(locationOffset);
node.setSelected(true);
});
this.blueprint.addNode(...nodes);
}
}
@@ -1711,18 +1722,18 @@ class MouseWheel extends Pointing {
this.mouseParentWheelHandler = e => e.preventDefault();
if (this.blueprint.focused) {
this.movementSpace.addEventListener('wheel', this.mouseWheelHandler, false);
this.movementSpace.addEventListener("wheel", this.mouseWheelHandler, false);
}
}
blueprintFocused() {
this.movementSpace.addEventListener('wheel', this.mouseWheelHandler, false);
this.movementSpace.parentElement?.addEventListener('wheel', this.mouseParentWheelHandler);
this.movementSpace.addEventListener("wheel", this.mouseWheelHandler, false);
this.movementSpace.parentElement?.addEventListener("wheel", this.mouseParentWheelHandler);
}
blueprintUnfocused() {
this.movementSpace.removeEventListener('wheel', this.mouseWheelHandler, false);
this.movementSpace.parentElement?.removeEventListener('wheel', this.mouseParentWheelHandler);
this.movementSpace.removeEventListener("wheel", this.mouseWheelHandler, false);
this.movementSpace.parentElement?.removeEventListener("wheel", this.mouseParentWheelHandler);
}
/* Subclasses will override the following method */
@@ -1806,7 +1817,7 @@ class Blueprint extends GraphElement {
connectedCallback() {
super.connectedCallback();
this.classList.add('ueb', `ueb-zoom-${this.zoom}`);
this.classList.add("ueb", `ueb-zoom-${this.zoom}`);
this.headerElement = this.querySelector('.ueb-viewport-header');
console.assert(this.headerElement, "Header element not provided by the template.");
@@ -1814,13 +1825,13 @@ class Blueprint extends GraphElement {
console.assert(this.overlayElement, "Overlay element not provided by the template.");
this.viewportElement = this.querySelector('.ueb-viewport-body');
console.assert(this.viewportElement, "Viewport element not provided by the template.");
this.gridElement = this.viewportElement.querySelector('.ueb-grid');
this.gridElement = this.viewportElement.querySelector(".ueb-grid");
console.assert(this.gridElement, "Grid element not provided by the template.");
this.selectorElement = new GraphSelector();
this.nodesContainerElement = this.querySelector('[data-nodes]');
this.nodesContainerElement = this.querySelector("[data-nodes]");
console.assert(this.nodesContainerElement, "Nodes container element not provided by the template.");
this.nodesContainerElement.append(this.selectorElement);
this.querySelector('[data-nodes]').append(...this.entity.nodes);
this.querySelector("[data-nodes]").append(...this.entity.nodes);
this.copyObject = new Copy(this.getGridDOMElement(), this);
@@ -1870,7 +1881,7 @@ class Blueprint extends GraphElement {
this.viewportElement.scroll({
left: value[0],
top: value[1],
behavior: 'smooth'
behavior: "smooth"
});
}
}
@@ -1957,8 +1968,8 @@ class Blueprint extends GraphElement {
y = Math.round(Math.abs(y));
this.entity.additional = [this.entity.additional[0] + x, this.entity.additional[1] + y];
if (this.gridElement) {
this.gridElement.style.setProperty('--ueb-additional-x', this.entity.additional[0]);
this.gridElement.style.setProperty('--ueb-additional-y', this.entity.additional[1]);
this.gridElement.style.setProperty("--ueb-additional-x", this.entity.additional[0]);
this.gridElement.style.setProperty("--ueb-additional-y", this.entity.additional[1]);
}
}
@@ -1972,8 +1983,8 @@ class Blueprint extends GraphElement {
y = Math.round(y);
this.entity.translateValue = [this.entity.translateValue[0] + x, this.entity.translateValue[1] + y];
if (this.gridElement) {
this.gridElement.style.setProperty('--ueb-translate-x', this.entity.translateValue[0]);
this.gridElement.style.setProperty('--ueb-translate-y', this.entity.translateValue[1]);
this.gridElement.style.setProperty("--ueb-translate-x", this.entity.translateValue[0]);
this.gridElement.style.setProperty("--ueb-translate-y", this.entity.translateValue[1]);
}
}
@@ -2031,7 +2042,7 @@ class Blueprint extends GraphElement {
}
getScale() {
return parseFloat(getComputedStyle(this.gridElement).getPropertyValue('--ueb-scale'))
return parseFloat(getComputedStyle(this.gridElement).getPropertyValue("--ueb-scale"))
}
compensateTranslation(position) {
@@ -2095,7 +2106,7 @@ class Blueprint extends GraphElement {
}
}
customElements.define('u-blueprint', Blueprint);
customElements.define("u-blueprint", Blueprint);
class GraphLink extends GraphElement {
@@ -2123,7 +2134,7 @@ class GraphLink extends GraphElement {
}
}
customElements.define('u-link', GraphLink);
customElements.define("u-link", GraphLink);
class GeneralSerializer extends Serializer {

22
js/Blueprint.js
View File

@@ -54,7 +54,7 @@ export default class Blueprint extends GraphElement {
connectedCallback() {
super.connectedCallback()
this.classList.add('ueb', `ueb-zoom-${this.zoom}`)
this.classList.add("ueb", `ueb-zoom-${this.zoom}`)
this.headerElement = this.querySelector('.ueb-viewport-header')
console.assert(this.headerElement, "Header element not provided by the template.")
@@ -62,13 +62,13 @@ export default class Blueprint extends GraphElement {
console.assert(this.overlayElement, "Overlay element not provided by the template.")
this.viewportElement = this.querySelector('.ueb-viewport-body')
console.assert(this.viewportElement, "Viewport element not provided by the template.")
this.gridElement = this.viewportElement.querySelector('.ueb-grid')
this.gridElement = this.viewportElement.querySelector(".ueb-grid")
console.assert(this.gridElement, "Grid element not provided by the template.")
this.selectorElement = new GraphSelector()
this.nodesContainerElement = this.querySelector('[data-nodes]')
this.nodesContainerElement = this.querySelector("[data-nodes]")
console.assert(this.nodesContainerElement, "Nodes container element not provided by the template.")
this.nodesContainerElement.append(this.selectorElement)
this.querySelector('[data-nodes]').append(...this.entity.nodes)
this.querySelector("[data-nodes]").append(...this.entity.nodes)
this.copyObject = new Copy(this.getGridDOMElement(), this)
@@ -118,7 +118,7 @@ export default class Blueprint extends GraphElement {
this.viewportElement.scroll({
left: value[0],
top: value[1],
behavior: 'smooth'
behavior: "smooth"
})
}
}
@@ -205,8 +205,8 @@ export default class Blueprint extends GraphElement {
y = Math.round(Math.abs(y))
this.entity.additional = [this.entity.additional[0] + x, this.entity.additional[1] + y]
if (this.gridElement) {
this.gridElement.style.setProperty('--ueb-additional-x', this.entity.additional[0])
this.gridElement.style.setProperty('--ueb-additional-y', this.entity.additional[1])
this.gridElement.style.setProperty("--ueb-additional-x", this.entity.additional[0])
this.gridElement.style.setProperty("--ueb-additional-y", this.entity.additional[1])
}
}
@@ -220,8 +220,8 @@ export default class Blueprint extends GraphElement {
y = Math.round(y)
this.entity.translateValue = [this.entity.translateValue[0] + x, this.entity.translateValue[1] + y]
if (this.gridElement) {
this.gridElement.style.setProperty('--ueb-translate-x', this.entity.translateValue[0])
this.gridElement.style.setProperty('--ueb-translate-y', this.entity.translateValue[1])
this.gridElement.style.setProperty("--ueb-translate-x", this.entity.translateValue[0])
this.gridElement.style.setProperty("--ueb-translate-y", this.entity.translateValue[1])
}
}
@@ -279,7 +279,7 @@ export default class Blueprint extends GraphElement {
}
getScale() {
return parseFloat(getComputedStyle(this.gridElement).getPropertyValue('--ueb-scale'))
return parseFloat(getComputedStyle(this.gridElement).getPropertyValue("--ueb-scale"))
}
compensateTranslation(position) {
@@ -343,4 +343,4 @@ export default class Blueprint extends GraphElement {
}
}
customElements.define('u-blueprint', Blueprint)
customElements.define("u-blueprint", Blueprint)

2
js/BlueprintData.js
View File

@@ -12,4 +12,4 @@ export default class BlueprintData {
/** @type {number[]} */
this.mousePosition = [0, 0]
}
}
}

2
js/Utility.js
View File

@@ -6,7 +6,7 @@ export default class Utility {
}
static getScale(element) {
return getComputedStyle(element).getPropertyValue('--ueb-scale')
return getComputedStyle(element).getPropertyValue("--ueb-scale")
}
/**

8
js/entity/IntegerEntity.js
View File

@@ -10,9 +10,13 @@ export default class IntegerEntity extends Entity {
return IntegerEntity.attributes
}
constructor(options = {}) {
constructor(options = { value: 0 }) {
options.value = Math.round(options.value)
super(options)
this.value = Math.round(value)
}
valueOf() {
return this.value
}
toString() {

8
js/entity/ObjectEntity.js
View File

@@ -1,6 +1,7 @@
import Entity from "./Entity"
import FunctionReferenceEntity from "./FunctionReferenceEntity"
import GuidEntity from "./GuidEntity"
import IntegerEntity from "./IntegerEntity"
import ObjectReferenceEntity from "./ObjectReferenceEntity"
import PinEntity from "./PinEntity"
import TypeInitialization from "./TypeInitialization"
@@ -14,10 +15,13 @@ export default class ObjectEntity extends Entity {
bIsPureFunc: new TypeInitialization(Boolean, false, false),
VariableReference: new TypeInitialization(VariableReferenceEntity, false, null),
FunctionReference: new TypeInitialization(FunctionReferenceEntity, false, null,),
EventReference: new TypeInitialization(FunctionReferenceEntity, false, null,),
TargetType: new TypeInitialization(ObjectReferenceEntity, false, null),
NodePosX: 0,
NodePosY: 0,
NodePosX: IntegerEntity,
NodePosY: IntegerEntity,
NodeGuid: GuidEntity,
ErrorType: new TypeInitialization(IntegerEntity, false),
ErrorMsg: new TypeInitialization(String, false, ""),
CustomProperties: [PinEntity]
}

2
js/entity/PathSymbolEntity.js
View File

@@ -13,4 +13,4 @@ export default class PathSymbolEntity extends Entity {
toString() {
return this.value
}
}
}

2
js/export.js
View File

@@ -6,4 +6,4 @@ import initializeSerializerFactory from "./serialization/initializeSerializerFac
initializeSerializerFactory()
export { Blueprint as Blueprint, GraphNode as GraphNode, GraphLink as GraphLink }
export { Blueprint as Blueprint, GraphNode as GraphNode, GraphLink as GraphLink }

2
js/graph/GraphElement.js
View File

@@ -13,7 +13,7 @@ export default class GraphElement extends HTMLElement {
}
connectedCallback() {
this.blueprint = this.closest('u-blueprint')
this.blueprint = this.closest("u-blueprint")
this.append(...this.template.getElements(this.entity))
}
}

2
js/graph/GraphLink.js
View File

@@ -26,4 +26,4 @@ export default class GraphLink extends GraphElement {
}
}
customElements.define('u-link', GraphLink)
customElements.define("u-link", GraphLink)

2
js/graph/GraphNode.js
View File

@@ -50,4 +50,4 @@ export default class GraphNode extends SelectableDraggable {
}
}
customElements.define('u-node', GraphNode)
customElements.define("u-node", GraphNode)

16
js/graph/GraphSelector.js
View File

@@ -14,7 +14,7 @@ export default class GraphSelector extends GraphElement {
connectedCallback() {
super.connectedCallback()
this.classList.add('ueb-selector')
this.classList.add("ueb-selector")
this.dataset.selecting = "false"
}
@@ -25,11 +25,11 @@ export default class GraphSelector extends GraphElement {
startSelecting(initialPosition) {
initialPosition = this.blueprint.compensateTranslation(initialPosition)
// Set initial position
this.style.setProperty('--ueb-select-from-x', initialPosition[0])
this.style.setProperty('--ueb-select-from-y', initialPosition[1])
this.style.setProperty("--ueb-select-from-x", initialPosition[0])
this.style.setProperty("--ueb-select-from-y", initialPosition[1])
// Final position coincide with the initial position, at the beginning of selection
this.style.setProperty('--ueb-select-to-x', initialPosition[0])
this.style.setProperty('--ueb-select-to-y', initialPosition[1])
this.style.setProperty("--ueb-select-to-x", initialPosition[0])
this.style.setProperty("--ueb-select-to-y", initialPosition[1])
this.dataset.selecting = "true"
this.selectionModel = new FastSelectionModel(initialPosition, this.blueprint.getNodes(), this.blueprint.nodeBoundariesSupplier, this.blueprint.nodeSelectToggleFunction)
}
@@ -40,8 +40,8 @@ export default class GraphSelector extends GraphElement {
*/
doSelecting(finalPosition) {
finalPosition = this.blueprint.compensateTranslation(finalPosition)
this.style.setProperty('--ueb-select-to-x', finalPosition[0])
this.style.setProperty('--ueb-select-to-y', finalPosition[1])
this.style.setProperty("--ueb-select-to-x", finalPosition[0])
this.style.setProperty("--ueb-select-to-y", finalPosition[1])
this.selectionModel.selectTo(finalPosition)
}
@@ -51,4 +51,4 @@ export default class GraphSelector extends GraphElement {
}
}
customElements.define('u-selector', GraphSelector)
customElements.define("u-selector", GraphSelector)

14
js/graph/SelectableDraggable.js
View File

@@ -28,8 +28,8 @@ export default class SelectableDraggable extends GraphElement {
setLocation(value = [0, 0]) {
this.location = value
this.style.setProperty('--ueb-position-x', this.location[0])
this.style.setProperty('--ueb-position-y', this.location[1])
this.style.setProperty("--ueb-position-x", this.location[0])
this.style.setProperty("--ueb-position-y", this.location[1])
}
addLocation(value) {
@@ -41,7 +41,7 @@ export default class SelectableDraggable extends GraphElement {
this.blueprint.unselectAll()
this.setSelected(true)
}
let dragEvent = new CustomEvent('uDragSelected', {
let dragEvent = new CustomEvent("uDragSelected", {
detail: {
instigator: this,
value: value
@@ -59,11 +59,11 @@ export default class SelectableDraggable extends GraphElement {
}
this.selected = value
if (this.selected) {
this.classList.add('ueb-selected')
this.blueprint.addEventListener('uDragSelected', this.dragHandler)
this.classList.add("ueb-selected")
this.blueprint.addEventListener("uDragSelected", this.dragHandler)
} else {
this.classList.remove('ueb-selected')
this.blueprint.removeEventListener('uDragSelected', this.dragHandler)
this.classList.remove("ueb-selected")
this.blueprint.removeEventListener("uDragSelected", this.dragHandler)
}
}
}

2
js/input/Copy.js
View File

@@ -23,4 +23,4 @@ export default class Copy extends Context {
const value = this.blueprint.getNodes(true).map(node => this.serializer.write(node.entity)).join("\n")
navigator.clipboard.writeText(value)
}
}
}

2
js/input/Drag.js
View File

@@ -17,7 +17,7 @@ export default class Drag extends MouseClickDrag {
startDrag() {
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = parseInt(getComputedStyle(this.target).getPropertyValue('--ueb-grid-snap'))
this.stepSize = parseInt(getComputedStyle(this.target).getPropertyValue("--ueb-grid-snap"))
if (isNaN(this.stepSize) || this.stepSize <= 0) {
this.stepSize = 1
}

4
js/input/KeyboardShortcut.js
View File

@@ -29,11 +29,11 @@ export default class KeyboardShortcut extends Context {
}
blueprintFocused() {
document.addEventListener('keydown', this.keyDownHandler)
document.addEventListener("keydown", this.keyDownHandler)
}
blueprintUnfocused() {
document.removeEventListener('keydown', this.keyDownHandler)
document.removeEventListener("keydown", this.keyDownHandler)
}
fire() {

22
js/input/MouseClickDrag.js
View File

@@ -26,8 +26,8 @@ export default class MouseClickDrag extends Pointing {
e.stopPropagation()
self.started = false
// Attach the listeners
movementListenedElement.addEventListener('mousemove', self.mouseStartedMovingHandler)
document.addEventListener('mouseup', self.mouseUpHandler)
movementListenedElement.addEventListener("mousemove", self.mouseStartedMovingHandler)
document.addEventListener("mouseup", self.mouseUpHandler)
self.clickedPosition = self.getLocation(e)
self.clicked(self.clickedPosition)
}
@@ -45,8 +45,8 @@ export default class MouseClickDrag extends Pointing {
e.stopPropagation()
// Delegate from now on to self.mouseMoveHandler
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler)
movementListenedElement.addEventListener('mousemove', self.mouseMoveHandler)
movementListenedElement.removeEventListener("mousemove", self.mouseStartedMovingHandler)
movementListenedElement.addEventListener("mousemove", self.mouseMoveHandler)
// Do actual actions
self.startDrag()
@@ -64,16 +64,16 @@ export default class MouseClickDrag extends Pointing {
this.mouseUpHandler = e => {
if (!self.exitAnyButton || e.button == self.clickButton) {
// Remove the handlers of "mousemove" and "mouseup"
movementListenedElement.removeEventListener('mousemove', self.mouseStartedMovingHandler)
movementListenedElement.removeEventListener('mousemove', self.mouseMoveHandler)
document.removeEventListener('mouseup', self.mouseUpHandler)
movementListenedElement.removeEventListener("mousemove", self.mouseStartedMovingHandler)
movementListenedElement.removeEventListener("mousemove", self.mouseMoveHandler)
document.removeEventListener("mouseup", self.mouseUpHandler)
self.endDrag()
}
}
this.target.addEventListener('mousedown', this.mouseDownHandler)
this.target.addEventListener("mousedown", this.mouseDownHandler)
if (this.clickButton == 2) {
this.target.addEventListener('contextmenu', this.preventDefault)
this.target.addEventListener("contextmenu", this.preventDefault)
}
}
@@ -83,9 +83,9 @@ export default class MouseClickDrag extends Pointing {
unlistenDOMElement() {
super.unlistenDOMElement()
this.target.removeEventListener('mousedown', this.mouseDownHandler)
this.target.removeEventListener("mousedown", this.mouseDownHandler)
if (this.clickButton == 2) {
this.target.removeEventListener('contextmenu', this.preventDefault)
this.target.removeEventListener("contextmenu", this.preventDefault)
} blueprintunfocusHandler
}

2
js/input/MouseTracking.js
View File

@@ -19,4 +19,4 @@ export default class MouseTracking extends Pointing {
blueprintUnfocused() {
this.target.removeEventListener("mousemove", this.mousemoveHandler)
}
}
}

10
js/input/MouseWheel.js
View File

@@ -22,18 +22,18 @@ export default class MouseWheel extends Pointing {
this.mouseParentWheelHandler = e => e.preventDefault()
if (this.blueprint.focused) {
this.movementSpace.addEventListener('wheel', this.mouseWheelHandler, false)
this.movementSpace.addEventListener("wheel", this.mouseWheelHandler, false)
}
}
blueprintFocused() {
this.movementSpace.addEventListener('wheel', this.mouseWheelHandler, false)
this.movementSpace.parentElement?.addEventListener('wheel', this.mouseParentWheelHandler)
this.movementSpace.addEventListener("wheel", this.mouseWheelHandler, false)
this.movementSpace.parentElement?.addEventListener("wheel", this.mouseParentWheelHandler)
}
blueprintUnfocused() {
this.movementSpace.removeEventListener('wheel', this.mouseWheelHandler, false)
this.movementSpace.parentElement?.removeEventListener('wheel', this.mouseParentWheelHandler)
this.movementSpace.removeEventListener("wheel", this.mouseWheelHandler, false)
this.movementSpace.parentElement?.removeEventListener("wheel", this.mouseParentWheelHandler)
}
/* Subclasses will override the following method */

6
js/input/Paste.js
View File

@@ -29,14 +29,18 @@ export default class Paste extends Context {
left = Math.min(left, node.location[0])
return node
})
if (nodes.length > 0) {
this.blueprint.unselectAll()
}
let mousePosition = this.blueprint.entity.mousePosition
this.blueprint.addNode(...nodes)
nodes.forEach(node => {
const locationOffset = [
mousePosition[0] - left,
mousePosition[1] - top
]
node.addLocation(locationOffset)
node.setSelected(true)
})
this.blueprint.addNode(...nodes)
}
}

2
js/serialization/CustomSerializer.js
View File

@@ -11,4 +11,4 @@ export default class CustomSerializer extends GeneralSerializer {
let result = this.objectWriter(object)
return result
}
}
}

6
js/serialization/Grammar.js
View File

@@ -20,9 +20,9 @@ export default class Grammar {
Null = r => P.seq(P.string("("), r.InlineOptWhitespace, P.string(")")).map(_ => null).desc("null: ()")
None = _ => P.string("None").map(_ => new ObjectReferenceEntity({ type: "None", path: "" })).desc("none")
Boolean = _ => P.alt(P.string("True"), P.string("False")).map(v => v === "True" ? true : false).desc("either True or False")
Number = _ => P.regex(/[0-9]+(?:\.[0-9]+)?/).map(Number).desc("a number")
Integer = _ => P.regex(/[0-9]+/).map(v => new IntegerEntity({ value: v })).desc("an integer")
String = _ => P.regex(/(?:[^"\\]|\\")*/).wrap(P.string('"'), P.string('"')).desc('string (with possibility to escape the quote using \")')
Number = _ => P.regex(/[\-\+]?[0-9]+(?:\.[0-9]+)?/).map(Number).desc("a number")
Integer = _ => P.regex(/[\-\+]?[0-9]+/).map(v => new IntegerEntity({ value: v })).desc("an integer")
String = _ => P.regex(/(?:[^"\\]|\\.)*/).wrap(P.string('"'), P.string('"')).desc('string (with possibility to escape the quote using \")')
Word = _ => P.regex(/[a-zA-Z]+/).desc("a word")
Guid = _ => P.regex(/[0-9a-zA-Z]{32}/).map(v => new GuidEntity({ value: v })).desc("32 digit hexadecimal (accepts all the letters for safety) value")
PathSymbolEntity = _ => P.regex(/[0-9a-zA-Z_]+/).map(v => new PathSymbolEntity({ value: v }))

2
js/serialization/ToStringSerializer.js
View File

@@ -10,4 +10,4 @@ export default class ToStringSerializer extends GeneralSerializer {
let result = object.toString()
return result
}
}
}

2
js/serialization/initializeSerializerFactory.js
View File

@@ -47,4 +47,4 @@ export default function initializeSerializerFactory() {
SerializerFactory.registerSerializer(PathSymbolEntity, new ToStringSerializer(PathSymbolEntity))
SerializerFactory.registerSerializer(GuidEntity, new ToStringSerializer(GuidEntity))
SerializerFactory.registerSerializer(IntegerEntity, new ToStringSerializer(IntegerEntity))
}
}

2
js/template/NodeTemplate.js
View File

@@ -48,7 +48,7 @@ export default class NodeTemplate extends Template {
${output.getPinDisplayName()}
<span class="ueb-node-value-icon ${outputs[index].connected ? 'ueb-node-value-fill' : ''}"></span>
</div>
`).join("") ?? ''}
`).join('') ?? ''}
</div>
</div>
`

2
js/template/Template.js
View File

@@ -18,7 +18,7 @@ export default class Template {
* @returns The rendered elements
*/
getElements(entity) {
let aDiv = document.createElement('div')
let aDiv = document.createElement("div")
aDiv.innerHTML = this.render(entity)
return aDiv.childNodes
}