Fix script injection, small refactoring

js/graph/GraphNode.js

@@ -36,16 +36,6 @@ export default class GraphNode extends SelectableDraggable {
     connectedCallback() {
         const type = this.getAttribute("type")?.trim()
         super.connectedCallback()
-        this.querySelectorAll(".ueb-node-input, .ueb-node-output").forEach(element => {
-            this.dragLinkObjects.push(
-                new DragLink(element, this.blueprint, {
-                    clickButton: 0,
-                    moveEverywhere: true,
-                    exitAnyButton: true,
-                    looseTarget: true
-                })
-            )
-        })
     }
 
     setLocation(value = [0, 0]) {

js/graph/GraphPin.js

@@ -1,5 +1,6 @@
 import GraphElement from "./GraphElement"
 import PinTemplate from "../template/PinTemplate"
+import DragLink from "../input/DragLink"
 
 export default class GraphPin extends GraphElement {
 
@@ -7,10 +8,15 @@ export default class GraphPin extends GraphElement {
         super(entity, new PinTemplate())
         /** @type {import("../entity/PinEntity").default} */
         this.entity
+        /** @type {HTMLElement} */
+        this.clickableElement = null
     }
 
     connectedCallback() {
         super.connectedCallback()
+        new DragLink(this.clickableElement, this.blueprint, {
+            moveEverywhere: true
+        })
     }
 
     /**

js/graph/SelectableDraggable.js

@@ -1,4 +1,4 @@
-import Drag from "../input/Drag"
+import DragMove from "../input/DragMove"
 import GraphElement from "./GraphElement"
 
 export default class SelectableDraggable extends GraphElement {
@@ -19,7 +19,7 @@ export default class SelectableDraggable extends GraphElement {
 
     connectedCallback() {
         super.connectedCallback()
-        this.dragObject = new Drag(this, this.blueprint, {
+        this.dragObject = new DragMove(this, this.blueprint, {
             looseTarget: true
         })
     }

js/input/DragLink.js

@@ -7,7 +7,8 @@ export default class DragLink extends MouseClickDrag {
     }
 
     startDrag() {
-        //this.selectorElement.startSelecting(this.clickedPosition)
+        let a = 12
+        console.log(a)
     }
 
     dragTo(location, movement) {

js/input/DragMove.js

@@ -1,6 +1,6 @@
 import MouseClickDrag from "./MouseClickDrag"
 
-export default class Drag extends MouseClickDrag {
+export default class DragMove extends MouseClickDrag {
 
     constructor(target, blueprint, options) {
         super(target, blueprint, options)

js/input/MouseClickDrag.js

@@ -23,6 +23,7 @@ export default class MouseClickDrag extends Pointing {
                 case self.clickButton:
                     // Either doesn't matter or consider the click only when clicking on the parent, not descandants
                     if (self.looseTarget || e.target == e.currentTarget) {
+                        e.preventDefault()
                         e.stopPropagation()
                         self.started = false
                         // Attach the listeners

js/template/BlueprintTemplate.js

@@ -74,8 +74,8 @@ export default class BlueprintTemplate extends Template {
      * @param {Blueprint} brueprint The blueprint element
      */
     applyZoom(blueprint, newZoom) {
-        blueprint.classList.remove(`ueb-zoom-${blueprint.zoom}`)
-        blueprint.classList.add(sanitizeText`ueb-zoom-${newZoom}`)
+        blueprint.classList.remove("ueb-zoom-" + sanitizeText(blueprint.zoom))
+        blueprint.classList.add("ueb-zoom-" + sanitizeText(newZoom))
     }
 
     /**

js/template/PinTemplate.js

@@ -16,11 +16,11 @@ export default class PinTemplate extends Template {
         if (pin.isInput()) {
             return html`
                 <span class="ueb-node-value-icon ${pin.isConnected() ? 'ueb-node-value-fill' : ''}"></span>
-                ${pin.getPinDisplayName()}
+                ${sanitizeText(pin.getPinDisplayName())}
             `
         } else {
             return html`
-                ${pin.getPinDisplayName()}
+                ${sanitizeText(pin.getPinDisplayName())}
                 <span class="ueb-node-value-icon ${pin.isConnected() ? 'ueb-node-value-fill' : ''}"></span>
             `
         }
@@ -33,5 +33,6 @@ export default class PinTemplate extends Template {
     apply(pin) {
         super.apply(pin)
         pin.classList.add("ueb-node-" + pin.isInput() ? "input" : "output", "ueb-node-value-" + sanitizeText(pin.getType()))
+        pin.clickableElement = pin.querySelector(".ueb-node-value-icon")
     }
 }