diff --git a/src/hat-graph/hat-graph-node.ts b/src/hat-graph/hat-graph-node.ts index 74c3cf3..d251c2a 100644 --- a/src/hat-graph/hat-graph-node.ts +++ b/src/hat-graph/hat-graph-node.ts @@ -4,22 +4,11 @@ const NODE_SIZE = 24; export class HatGraphNode extends LitElement { @property() iconPath?; - dragtarget = undefined; config = undefined; connectedCallback() { super.connectedCallback(); if (!this.hasAttribute("tabindex")) this.setAttribute("tabindex", "0"); - - this.addEventListener("dragstart", () => { - this.classList.add("dragging"); - (window as any)._dragElement = this.dragtarget ?? this; - this.updateNode(""); - }); - this.addEventListener("dragend", () => { - this.classList.remove("dragging"); - (window as any)._dragElement = undefined; - }); } updateNode(config) { diff --git a/src/hat-graph/make-graph.ts b/src/hat-graph/make-graph.ts index 70c04f6..b1057fa 100644 --- a/src/hat-graph/make-graph.ts +++ b/src/hat-graph/make-graph.ts @@ -89,13 +89,7 @@ function makeChooseNode(config) { render( html` - + ${config.choose?.map((branch) => { const head = document.createElement("hat-graph-node") as HatGraphNode; @@ -139,7 +133,6 @@ function makeRepeatNode(config) { } function makeNode(config) { - if (typeof config === "string") return undefined; const type = OPTIONS.find((key) => key in config) || "yaml"; if (type in SPECIAL_NODES) { @@ -149,7 +142,6 @@ function makeNode(config) { const node = document.createElement("hat-graph-node") as HatGraphNode; node.iconPath = ICONS[type]; - node.draggable = true; node.config = config; @@ -164,16 +156,6 @@ function makeNode(config) { export function makeGraph(nodes, head = undefined) { const graph = document.createElement("hat-graph") as HatGraph; - graph.addEventListener("dragenter", (ev) => { - ev.stopPropagation(); - ev.preventDefault(); - try { - graph.appendChild((window as any)._dragElement); - } catch (e) { - if (!(e instanceof DOMException)) throw e; - } - }); - (graph as any).test = "Hello!"; if (head) { head.slot = "head"; @@ -182,43 +164,6 @@ export function makeGraph(nodes, head = undefined) { for (const [i, nodeConfig] of nodes.entries()) { const node = makeNode(nodeConfig); - if (!node) { - window.setTimeout(() => { - const config = [...nodes]; - config.splice(i, 1); - - graph.dispatchEvent( - new CustomEvent("update-node", { detail: { config }, bubbles: true }) - ); - }, 100); - continue; - } - - node.addEventListener("dragover", (ev) => { - ev.stopPropagation(); - ev.preventDefault(); - }); - node.addEventListener("dragenter", (ev) => { - ev.stopPropagation(); - ev.preventDefault(); - if (node === (window as any)._dragElement) return; - try { - graph.insertBefore((window as any)._dragElement, node); - (window as any)._dragTarget = node; - } catch (e) { - if (!(e instanceof DOMException)) throw e; - } - }); - - node.addEventListener("drop", (ev) => { - ev.stopPropagation(); - ev.preventDefault(); - if ((window as any)._dragTarget) { - console.log("Drop onto ", (window as any)._dragTarget); - const config = { ...(window as any)._dragElement.config }; - (window as any)._dragTarget.placeNode(config); - } - }); node.addEventListener("update-node", (ev) => { ev.stopPropagation();