chore: remove debug artifacts from PR
Remove elk_viewer test page, console log dumps, and layout screenshots that were used during development. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@@ -1,694 +0,0 @@
|
||||
Total messages: 23 (Errors: 0, Warnings: 1)
|
||||
|
||||
[DEBUG] Building graph @ http://localhost:5183/src/lib/components/graph/graphBuilder.svelte.ts?t=1772535251657:65
|
||||
[DEBUG] layoutNodes same nodes @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:516
|
||||
[DEBUG] [vite] connecting... @ http://localhost:5183/@vite/client:730
|
||||
[DEBUG] [vite] connected. @ http://localhost:5183/@vite/client:832
|
||||
[DEBUG] Building graph @ http://localhost:5183/src/lib/components/graph/graphBuilder.svelte.ts?t=1772535251657:65
|
||||
[DEBUG] Building graph @ http://localhost:5183/src/lib/components/graph/graphBuilder.svelte.ts?t=1772535251657:65
|
||||
[DEBUG] layoutNodes 3 @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:521
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [Input]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:535
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-Result",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:536
|
||||
[LOG] cancelling request: {reason: saveAndClear, abortController: undefined} @ http://localhost:5183/src/lib/components/copilot/chat/AIChatManager.svelte.ts?t=1772535251800:1024
|
||||
[LOG] loadFlow @ http://localhost:5183/src/routes/(root)/(logged)/flows/edit/[...path]/+page.svelte?t=1772544066222:100
|
||||
[LOG] ELK result: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 277,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 279,
|
||||
"x": 12,
|
||||
"y": 108
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 281,
|
||||
"x": 12,
|
||||
"y": 204
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Trigger-Input_s0",
|
||||
"startPoint": {
|
||||
"x": 150,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 150,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "Trigger",
|
||||
"outgoingShape": "Input"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-Input-Result",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Input-Result_s0",
|
||||
"startPoint": {
|
||||
"x": 150,
|
||||
"y": 142
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 150,
|
||||
"y": 204
|
||||
},
|
||||
"incomingShape": "Input",
|
||||
"outgoingShape": "Result"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
}
|
||||
],
|
||||
"$H": 13,
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"width": 299,
|
||||
"height": 250
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:540
|
||||
[LOG] Welcome back admin to testing @ http://localhost:5183/src/routes/(root)/+layout.svelte?t=1772535251800:68
|
||||
[WARNING] using deprecated parameters for the initialization function; pass a single object instead @ http://localhost:5183/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=5452fe86:3211
|
||||
[DEBUG] Building graph @ http://localhost:5183/src/lib/components/graph/graphBuilder.svelte.ts?t=1772535251657:65
|
||||
[DEBUG] Building graph @ http://localhost:5183/src/lib/components/graph/graphBuilder.svelte.ts?t=1772535251657:65
|
||||
[DEBUG] Building graph @ http://localhost:5183/src/lib/components/graph/graphBuilder.svelte.ts?t=1772535251657:65
|
||||
[DEBUG] layoutNodes 14 @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:521
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [a-end], a(module) ← [Input], a-end(branchAllEnd) ← [c,d,g], a-branch-0(branchAllStart) ← [a], b(module) ← [a-branch-0], c(module) ← [b], a-branch-1(branchAllStart) ← [a], d(module) ← [a-branch-1], a-branch-2(branchAllStart) ← [a], e(module) ← [a-branch-2], f(module) ← [e], g(module) ← [f]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:535
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a-end",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.separateConnectedComponents": "false",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES",
|
||||
"elk.layered.nodePlacement.strategy": "BRANDES_KOEPF",
|
||||
"elk.layered.nodePlacement.bk.fixedAlignment": "LEFTUP"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "a-branch-0",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "b",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "c",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-b-c",
|
||||
"sources": [
|
||||
"b"
|
||||
],
|
||||
"targets": [
|
||||
"c"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "a-branch-1",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "d",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": []
|
||||
},
|
||||
{
|
||||
"id": "a-branch-2",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "e",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "f",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "g",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-e-f",
|
||||
"sources": [
|
||||
"e"
|
||||
],
|
||||
"targets": [
|
||||
"f"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-f-g",
|
||||
"sources": [
|
||||
"f"
|
||||
],
|
||||
"targets": [
|
||||
"g"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-end-Result",
|
||||
"sources": [
|
||||
"a-end"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-a",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"a"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-a-end",
|
||||
"sources": [
|
||||
"a"
|
||||
],
|
||||
"targets": [
|
||||
"a-end"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:536
|
||||
[LOG] ELK result: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 352,
|
||||
"x": 385,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 354,
|
||||
"x": 385,
|
||||
"y": 108
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 356,
|
||||
"x": 385,
|
||||
"y": 636
|
||||
},
|
||||
{
|
||||
"id": "a-end",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 358,
|
||||
"x": 385,
|
||||
"y": 540
|
||||
},
|
||||
{
|
||||
"id": "a",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.separateConnectedComponents": "false",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES",
|
||||
"elk.layered.nodePlacement.strategy": "BRANDES_KOEPF",
|
||||
"elk.layered.nodePlacement.bk.fixedAlignment": "LEFTUP"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "a-branch-0",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "b",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 364,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "c",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 366,
|
||||
"x": 12,
|
||||
"y": 108
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-b-c",
|
||||
"sources": [
|
||||
"b"
|
||||
],
|
||||
"targets": [
|
||||
"c"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-b-c_s0",
|
||||
"startPoint": {
|
||||
"x": 149.5,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 149.5,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "b",
|
||||
"outgoingShape": "c"
|
||||
}
|
||||
],
|
||||
"container": "a-branch-0"
|
||||
}
|
||||
],
|
||||
"$H": 362,
|
||||
"x": 12,
|
||||
"y": 60,
|
||||
"width": 299,
|
||||
"height": 154
|
||||
},
|
||||
{
|
||||
"id": "a-branch-1",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "d",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 370,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
}
|
||||
],
|
||||
"edges": [],
|
||||
"$H": 368,
|
||||
"x": 361,
|
||||
"y": 108,
|
||||
"width": 299,
|
||||
"height": 58
|
||||
},
|
||||
{
|
||||
"id": "a-branch-2",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "e",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 374,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "f",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 376,
|
||||
"x": 12,
|
||||
"y": 108
|
||||
},
|
||||
{
|
||||
"id": "g",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 378,
|
||||
"x": 12,
|
||||
"y": 204
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-e-f",
|
||||
"sources": [
|
||||
"e"
|
||||
],
|
||||
"targets": [
|
||||
"f"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-e-f_s0",
|
||||
"startPoint": {
|
||||
"x": 149.5,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 149.5,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "e",
|
||||
"outgoingShape": "f"
|
||||
}
|
||||
],
|
||||
"container": "a-branch-2"
|
||||
},
|
||||
{
|
||||
"id": "e-f-g",
|
||||
"sources": [
|
||||
"f"
|
||||
],
|
||||
"targets": [
|
||||
"g"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-f-g_s0",
|
||||
"startPoint": {
|
||||
"x": 149.5,
|
||||
"y": 142
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 149.5,
|
||||
"y": 204
|
||||
},
|
||||
"incomingShape": "f",
|
||||
"outgoingShape": "g"
|
||||
}
|
||||
],
|
||||
"container": "a-branch-2"
|
||||
}
|
||||
],
|
||||
"$H": 372,
|
||||
"x": 710,
|
||||
"y": 12,
|
||||
"width": 299,
|
||||
"height": 250
|
||||
}
|
||||
],
|
||||
"$H": 360,
|
||||
"x": 12,
|
||||
"y": 204,
|
||||
"width": 1021,
|
||||
"height": 274
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Trigger-Input_s0",
|
||||
"startPoint": {
|
||||
"x": 523,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 523,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "Trigger",
|
||||
"outgoingShape": "Input"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-a-end-Result",
|
||||
"sources": [
|
||||
"a-end"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-a-end-Result_s0",
|
||||
"startPoint": {
|
||||
"x": 523,
|
||||
"y": 574
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 523,
|
||||
"y": 636
|
||||
},
|
||||
"incomingShape": "a-end",
|
||||
"outgoingShape": "Result"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-Input-a",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"a"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Input-a_s0",
|
||||
"startPoint": {
|
||||
"x": 523,
|
||||
"y": 142
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 523,
|
||||
"y": 204
|
||||
},
|
||||
"incomingShape": "Input",
|
||||
"outgoingShape": "a"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-a-a-end",
|
||||
"sources": [
|
||||
"a"
|
||||
],
|
||||
"targets": [
|
||||
"a-end"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-a-a-end_s0",
|
||||
"startPoint": {
|
||||
"x": 523,
|
||||
"y": 478
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 523,
|
||||
"y": 540
|
||||
},
|
||||
"incomingShape": "a",
|
||||
"outgoingShape": "a-end"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
}
|
||||
],
|
||||
"$H": 350,
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"width": 1045,
|
||||
"height": 682
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:540
|
||||
[DEBUG] Building graph @ http://localhost:5183/src/lib/components/graph/graphBuilder.svelte.ts?t=1772535251657:65
|
||||
[DEBUG] layoutNodes same nodes @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772544066222:516
|
||||
@@ -1,425 +0,0 @@
|
||||
Total messages: 36 (Errors: 0, Warnings: 1)
|
||||
Returning 22 messages for level "info"
|
||||
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [Input]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:531
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-Result",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:532
|
||||
[LOG] cancelling request: {reason: saveAndClear, abortController: undefined} @ http://localhost:5183/src/lib/components/copilot/chat/AIChatManager.svelte.ts?t=1772535251800:1024
|
||||
[LOG] loadFlow @ http://localhost:5183/src/routes/(root)/(logged)/flows/edit/[...path]/+page.svelte?t=1772543608757:100
|
||||
[LOG] Welcome back admin to testing @ http://localhost:5183/src/routes/(root)/+layout.svelte?t=1772535251800:68
|
||||
[WARNING] using deprecated parameters for the initialization function; pass a single object instead @ http://localhost:5183/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=5452fe86:3211
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [a-end], a(module) ← [Input], a-end(branchAllEnd) ← [c,d,g], a-branch-0(branchAllStart) ← [a], b(module) ← [a-branch-0], c(module) ← [b], a-branch-1(branchAllStart) ← [a], d(module) ← [a-branch-1], a-branch-2(branchAllStart) ← [a], e(module) ← [a-branch-2], f(module) ← [e], g(module) ← [f]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:531
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a-end",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "RIGHT",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "a-branch-0",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "b",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "c",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-b-c",
|
||||
"sources": [
|
||||
"b"
|
||||
],
|
||||
"targets": [
|
||||
"c"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "a-branch-1",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "d",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": []
|
||||
},
|
||||
{
|
||||
"id": "a-branch-2",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "e",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "f",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "g",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-e-f",
|
||||
"sources": [
|
||||
"e"
|
||||
],
|
||||
"targets": [
|
||||
"f"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-f-g",
|
||||
"sources": [
|
||||
"f"
|
||||
],
|
||||
"targets": [
|
||||
"g"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-end-Result",
|
||||
"sources": [
|
||||
"a-end"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-a",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"a"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-a-end",
|
||||
"sources": [
|
||||
"a"
|
||||
],
|
||||
"targets": [
|
||||
"a-end"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:532
|
||||
[LOG] RawScript module b without assets field, parsing @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:149
|
||||
[LOG] Parsing assets for RawScript module b @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:121
|
||||
[LOG] RawScript module c without assets field, parsing @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:149
|
||||
[LOG] Parsing assets for RawScript module c @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:121
|
||||
[LOG] RawScript module d without assets field, parsing @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:149
|
||||
[LOG] Parsing assets for RawScript module d @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:121
|
||||
[LOG] RawScript module e without assets field, parsing @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:149
|
||||
[LOG] Parsing assets for RawScript module e @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:121
|
||||
[LOG] RawScript module f without assets field, parsing @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:149
|
||||
[LOG] Parsing assets for RawScript module f @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:121
|
||||
[LOG] RawScript module g without assets field, parsing @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:149
|
||||
[LOG] Parsing assets for RawScript module g @ http://localhost:5183/src/lib/components/flows/FlowAssetsHandler.svelte?t=1772535251800:121
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [a-end], a(module) ← [Input], a-end(branchAllEnd) ← [c,d,g], a-branch-0(branchAllStart) ← [a], b(module) ← [a-branch-0], c(module) ← [b], a-branch-1(branchAllStart) ← [a], d(module) ← [a-branch-1], a-branch-2(branchAllStart) ← [a], e(module) ← [a-branch-2], f(module) ← [e], g(module) ← [f]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:531
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a-end",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "RIGHT",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "a-branch-0",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "b",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "c",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-b-c",
|
||||
"sources": [
|
||||
"b"
|
||||
],
|
||||
"targets": [
|
||||
"c"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "a-branch-1",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "d",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": []
|
||||
},
|
||||
{
|
||||
"id": "a-branch-2",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "e",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "f",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "g",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-e-f",
|
||||
"sources": [
|
||||
"e"
|
||||
],
|
||||
"targets": [
|
||||
"f"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-f-g",
|
||||
"sources": [
|
||||
"f"
|
||||
],
|
||||
"targets": [
|
||||
"g"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-end-Result",
|
||||
"sources": [
|
||||
"a-end"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-a",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"a"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-a-end",
|
||||
"sources": [
|
||||
"a"
|
||||
],
|
||||
"targets": [
|
||||
"a-end"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:532
|
||||
@@ -1,149 +0,0 @@
|
||||
Total messages: 15 (Errors: 0, Warnings: 0)
|
||||
Returning 6 messages for level "info"
|
||||
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [Input]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:531
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-Result",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:532
|
||||
[LOG] cancelling request: {reason: saveAndClear, abortController: undefined} @ http://localhost:5183/src/lib/components/copilot/chat/AIChatManager.svelte.ts?t=1772535251800:1024
|
||||
[LOG] loadFlow @ http://localhost:5183/src/routes/(root)/(logged)/flows/edit/[...path]/+page.svelte?t=1772543608757:100
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [a-end], a(module) ← [Input], a-end(branchOneEnd) ← [a-branch-default], a-branch-default(branchOneStart) ← [a]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:531
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a-end",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "RIGHT",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "a-branch-default",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [],
|
||||
"edges": []
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-end-Result",
|
||||
"sources": [
|
||||
"a-end"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-a",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"a"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-a-end",
|
||||
"sources": [
|
||||
"a"
|
||||
],
|
||||
"targets": [
|
||||
"a-end"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543608757:532
|
||||
@@ -1,674 +0,0 @@
|
||||
Total messages: 21 (Errors: 0, Warnings: 1)
|
||||
Returning 10 messages for level "info"
|
||||
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [Input]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543797839:531
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-Result",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543797839:532
|
||||
[LOG] cancelling request: {reason: saveAndClear, abortController: undefined} @ http://localhost:5183/src/lib/components/copilot/chat/AIChatManager.svelte.ts?t=1772535251800:1024
|
||||
[LOG] loadFlow @ http://localhost:5183/src/routes/(root)/(logged)/flows/edit/[...path]/+page.svelte?t=1772543797839:100
|
||||
[LOG] Welcome back admin to testing @ http://localhost:5183/src/routes/(root)/+layout.svelte?t=1772535251800:68
|
||||
[LOG] ELK result: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 277,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 279,
|
||||
"x": 12,
|
||||
"y": 108
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 281,
|
||||
"x": 12,
|
||||
"y": 204
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Trigger-Input_s0",
|
||||
"startPoint": {
|
||||
"x": 150,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 150,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "Trigger",
|
||||
"outgoingShape": "Input"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-Input-Result",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Input-Result_s0",
|
||||
"startPoint": {
|
||||
"x": 150,
|
||||
"y": 142
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 150,
|
||||
"y": 204
|
||||
},
|
||||
"incomingShape": "Input",
|
||||
"outgoingShape": "Result"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
}
|
||||
],
|
||||
"$H": 13,
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"width": 299,
|
||||
"height": 250
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543797839:536
|
||||
[WARNING] using deprecated parameters for the initialization function; pass a single object instead @ http://localhost:5183/node_modules/@sveltejs/kit/src/runtime/client/client.js?v=5452fe86:3211
|
||||
[LOG] ELK input nodes: [Trigger(trigger) ← [], Input(input2) ← [Trigger], Result(result) ← [a-end], a(module) ← [Input], a-end(branchAllEnd) ← [c,d,g], a-branch-0(branchAllStart) ← [a], b(module) ← [a-branch-0], c(module) ← [b], a-branch-1(branchAllStart) ← [a], d(module) ← [a-branch-1], a-branch-2(branchAllStart) ← [a], e(module) ← [a-branch-2], f(module) ← [e], g(module) ← [f]] @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543797839:531
|
||||
[LOG] ELK graph: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a-end",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "a",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "a-branch-0",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "b",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "c",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-b-c",
|
||||
"sources": [
|
||||
"b"
|
||||
],
|
||||
"targets": [
|
||||
"c"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "a-branch-1",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "d",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": []
|
||||
},
|
||||
{
|
||||
"id": "a-branch-2",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "e",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "f",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
},
|
||||
{
|
||||
"id": "g",
|
||||
"width": 275,
|
||||
"height": 34
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-e-f",
|
||||
"sources": [
|
||||
"e"
|
||||
],
|
||||
"targets": [
|
||||
"f"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-f-g",
|
||||
"sources": [
|
||||
"f"
|
||||
],
|
||||
"targets": [
|
||||
"g"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-end-Result",
|
||||
"sources": [
|
||||
"a-end"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-Input-a",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"a"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "e-a-a-end",
|
||||
"sources": [
|
||||
"a"
|
||||
],
|
||||
"targets": [
|
||||
"a-end"
|
||||
]
|
||||
}
|
||||
]
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543797839:532
|
||||
[LOG] ELK result: {
|
||||
"id": "root",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50",
|
||||
"elk.layered.nodePlacement.strategy": "NETWORK_SIMPLEX",
|
||||
"elk.layered.crossingMinimization.strategy": "LAYER_SWEEP",
|
||||
"elk.layered.considerModelOrder.strategy": "NODES_AND_EDGES"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "Trigger",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 352,
|
||||
"x": 36,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "Input",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 354,
|
||||
"x": 36,
|
||||
"y": 108
|
||||
},
|
||||
{
|
||||
"id": "Result",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 356,
|
||||
"x": 36,
|
||||
"y": 888
|
||||
},
|
||||
{
|
||||
"id": "a-end",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 358,
|
||||
"x": 36,
|
||||
"y": 792
|
||||
},
|
||||
{
|
||||
"id": "a",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "a-branch-0",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "b",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 364,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "c",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 366,
|
||||
"x": 12,
|
||||
"y": 108
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-b-c",
|
||||
"sources": [
|
||||
"b"
|
||||
],
|
||||
"targets": [
|
||||
"c"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-b-c_s0",
|
||||
"startPoint": {
|
||||
"x": 149.5,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 149.5,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "b",
|
||||
"outgoingShape": "c"
|
||||
}
|
||||
],
|
||||
"container": "a-branch-0"
|
||||
}
|
||||
],
|
||||
"$H": 362,
|
||||
"x": 12,
|
||||
"y": 90,
|
||||
"width": 299,
|
||||
"height": 154
|
||||
},
|
||||
{
|
||||
"id": "a-branch-1",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "d",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 370,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
}
|
||||
],
|
||||
"edges": [],
|
||||
"$H": 368,
|
||||
"x": 12,
|
||||
"y": 12,
|
||||
"width": 299,
|
||||
"height": 58
|
||||
},
|
||||
{
|
||||
"id": "a-branch-2",
|
||||
"layoutOptions": {
|
||||
"elk.algorithm": "layered",
|
||||
"elk.direction": "DOWN",
|
||||
"elk.layered.spacing.nodeNodeBetweenLayers": "62",
|
||||
"elk.spacing.nodeNode": "50"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"id": "e",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 374,
|
||||
"x": 12,
|
||||
"y": 12
|
||||
},
|
||||
{
|
||||
"id": "f",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 376,
|
||||
"x": 12,
|
||||
"y": 108
|
||||
},
|
||||
{
|
||||
"id": "g",
|
||||
"width": 275,
|
||||
"height": 34,
|
||||
"$H": 378,
|
||||
"x": 12,
|
||||
"y": 204
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-e-f",
|
||||
"sources": [
|
||||
"e"
|
||||
],
|
||||
"targets": [
|
||||
"f"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-e-f_s0",
|
||||
"startPoint": {
|
||||
"x": 149.5,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 149.5,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "e",
|
||||
"outgoingShape": "f"
|
||||
}
|
||||
],
|
||||
"container": "a-branch-2"
|
||||
},
|
||||
{
|
||||
"id": "e-f-g",
|
||||
"sources": [
|
||||
"f"
|
||||
],
|
||||
"targets": [
|
||||
"g"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-f-g_s0",
|
||||
"startPoint": {
|
||||
"x": 149.5,
|
||||
"y": 142
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 149.5,
|
||||
"y": 204
|
||||
},
|
||||
"incomingShape": "f",
|
||||
"outgoingShape": "g"
|
||||
}
|
||||
],
|
||||
"container": "a-branch-2"
|
||||
}
|
||||
],
|
||||
"$H": 372,
|
||||
"x": 12,
|
||||
"y": 264,
|
||||
"width": 299,
|
||||
"height": 250
|
||||
}
|
||||
],
|
||||
"$H": 360,
|
||||
"x": 12,
|
||||
"y": 204,
|
||||
"width": 323,
|
||||
"height": 526
|
||||
}
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "e-Trigger-Input",
|
||||
"sources": [
|
||||
"Trigger"
|
||||
],
|
||||
"targets": [
|
||||
"Input"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Trigger-Input_s0",
|
||||
"startPoint": {
|
||||
"x": 174,
|
||||
"y": 46
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 174,
|
||||
"y": 108
|
||||
},
|
||||
"incomingShape": "Trigger",
|
||||
"outgoingShape": "Input"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-a-end-Result",
|
||||
"sources": [
|
||||
"a-end"
|
||||
],
|
||||
"targets": [
|
||||
"Result"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-a-end-Result_s0",
|
||||
"startPoint": {
|
||||
"x": 174,
|
||||
"y": 826
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 174,
|
||||
"y": 888
|
||||
},
|
||||
"incomingShape": "a-end",
|
||||
"outgoingShape": "Result"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-Input-a",
|
||||
"sources": [
|
||||
"Input"
|
||||
],
|
||||
"targets": [
|
||||
"a"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-Input-a_s0",
|
||||
"startPoint": {
|
||||
"x": 174,
|
||||
"y": 142
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 174,
|
||||
"y": 204
|
||||
},
|
||||
"incomingShape": "Input",
|
||||
"outgoingShape": "a"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
},
|
||||
{
|
||||
"id": "e-a-a-end",
|
||||
"sources": [
|
||||
"a"
|
||||
],
|
||||
"targets": [
|
||||
"a-end"
|
||||
],
|
||||
"sections": [
|
||||
{
|
||||
"id": "e-a-a-end_s0",
|
||||
"startPoint": {
|
||||
"x": 174,
|
||||
"y": 730
|
||||
},
|
||||
"endPoint": {
|
||||
"x": 174,
|
||||
"y": 792
|
||||
},
|
||||
"incomingShape": "a",
|
||||
"outgoingShape": "a-end"
|
||||
}
|
||||
],
|
||||
"container": "root"
|
||||
}
|
||||
],
|
||||
"$H": 350,
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"width": 347,
|
||||
"height": 934
|
||||
} @ http://localhost:5183/src/lib/components/graph/FlowGraphV2.svelte?t=1772543797839:536
|
||||
|
Before Width: | Height: | Size: 93 KiB |
|
Before Width: | Height: | Size: 78 KiB |
|
Before Width: | Height: | Size: 84 KiB |
|
Before Width: | Height: | Size: 75 KiB |
|
Before Width: | Height: | Size: 75 KiB |
|
Before Width: | Height: | Size: 89 KiB |
|
Before Width: | Height: | Size: 90 KiB |
|
Before Width: | Height: | Size: 71 KiB |
|
Before Width: | Height: | Size: 99 KiB |
|
Before Width: | Height: | Size: 80 KiB |
|
Before Width: | Height: | Size: 83 KiB |
|
Before Width: | Height: | Size: 90 KiB |
|
Before Width: | Height: | Size: 88 KiB |
|
Before Width: | Height: | Size: 78 KiB |
|
Before Width: | Height: | Size: 137 KiB |
|
Before Width: | Height: | Size: 123 KiB |
|
Before Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 77 KiB |
|
Before Width: | Height: | Size: 94 KiB |
|
Before Width: | Height: | Size: 72 KiB |
|
Before Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 116 KiB |
@@ -1,266 +0,0 @@
|
||||
<script lang="ts">
|
||||
import '@xyflow/svelte/dist/base.css'
|
||||
import {
|
||||
SvelteFlow,
|
||||
SvelteFlowProvider,
|
||||
type Node,
|
||||
type Edge,
|
||||
Controls
|
||||
} from '@xyflow/svelte'
|
||||
|
||||
let jsonInput = $state(SAMPLE_ELK_RESULT)
|
||||
let error = $state('')
|
||||
let nodes = $state.raw<Node[]>([])
|
||||
let edges = $state.raw<Edge[]>([])
|
||||
|
||||
/**
|
||||
* Parse an ELK layout result using SvelteFlow's parentId system.
|
||||
*
|
||||
* Approach:
|
||||
* - Compound nodes (have children) → rendered as group wrappers (dashed border)
|
||||
* Position is relative to their own parent (or absolute if at root).
|
||||
* - Leaf nodes → rendered as regular nodes with parentId pointing to their
|
||||
* compound parent. Position is relative to parent (ELK already gives relative coords).
|
||||
* - Nodes must be ordered: parents before children.
|
||||
*/
|
||||
function parseElkResult(elkResult: any) {
|
||||
const svelteNodes: Node[] = []
|
||||
const svelteEdges: Edge[] = []
|
||||
|
||||
function walkNodes(elkNode: any, parentId: string | undefined) {
|
||||
for (const child of elkNode.children ?? []) {
|
||||
const isCompound = child.children?.length > 0
|
||||
|
||||
const node: Node = {
|
||||
id: child.id,
|
||||
position: { x: child.x ?? 0, y: child.y ?? 0 },
|
||||
data: { label: child.id },
|
||||
type: 'default',
|
||||
...(parentId ? { parentId } : {}),
|
||||
...(isCompound
|
||||
? {
|
||||
style: `width: ${child.width}px; height: ${child.height}px; background: rgba(100,149,237,0.06); border: 1px dashed #6495ed; border-radius: 8px; font-size: 10px; color: #6495ed; padding: 4px;`,
|
||||
// Prevent group from intercepting pointer events on children
|
||||
selectable: false
|
||||
}
|
||||
: {
|
||||
style: `width: ${child.width ?? 275}px; height: ${child.height ?? 34}px; font-size: 11px;`
|
||||
})
|
||||
}
|
||||
|
||||
// Parent (compound) nodes must come before their children
|
||||
svelteNodes.push(node)
|
||||
|
||||
if (isCompound) {
|
||||
// Recurse: children will get parentId = this compound's id
|
||||
walkNodes(child, child.id)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function walkEdges(elkNode: any) {
|
||||
for (const edge of elkNode.edges ?? []) {
|
||||
svelteEdges.push({
|
||||
id: edge.id,
|
||||
source: edge.sources?.[0] ?? '',
|
||||
target: edge.targets?.[0] ?? '',
|
||||
type: 'default'
|
||||
})
|
||||
}
|
||||
for (const child of elkNode.children ?? []) {
|
||||
walkEdges(child)
|
||||
}
|
||||
}
|
||||
|
||||
walkNodes(elkResult, undefined)
|
||||
walkEdges(elkResult)
|
||||
|
||||
return { svelteNodes, svelteEdges }
|
||||
}
|
||||
|
||||
function renderFromJson() {
|
||||
try {
|
||||
const parsed = JSON.parse(jsonInput)
|
||||
const { svelteNodes, svelteEdges } = parseElkResult(parsed)
|
||||
nodes = svelteNodes
|
||||
edges = svelteEdges
|
||||
error = ''
|
||||
} catch (e: any) {
|
||||
error = e.message
|
||||
}
|
||||
}
|
||||
|
||||
$effect(() => {
|
||||
renderFromJson()
|
||||
})
|
||||
|
||||
const proOptions = { hideAttribution: true }
|
||||
</script>
|
||||
|
||||
<div class="flex h-screen w-screen">
|
||||
<!-- Left: JSON editor -->
|
||||
<div class="w-[500px] flex flex-col border-r border-gray-300 bg-white">
|
||||
<div class="flex items-center justify-between p-2 border-b border-gray-200 bg-gray-50">
|
||||
<h2 class="text-sm font-bold">ELK Result JSON</h2>
|
||||
<button
|
||||
class="px-3 py-1 text-sm bg-blue-600 text-white rounded hover:bg-blue-700"
|
||||
onclick={renderFromJson}
|
||||
>
|
||||
Render
|
||||
</button>
|
||||
</div>
|
||||
{#if error}
|
||||
<div class="p-2 text-xs text-red-600 bg-red-50 border-b border-red-200">{error}</div>
|
||||
{/if}
|
||||
<textarea
|
||||
class="flex-1 p-2 font-mono text-xs resize-none border-0 outline-none"
|
||||
bind:value={jsonInput}
|
||||
spellcheck="false"
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<!-- Right: SvelteFlow canvas -->
|
||||
<div class="flex-1 relative">
|
||||
<SvelteFlowProvider>
|
||||
<SvelteFlow
|
||||
{nodes}
|
||||
{edges}
|
||||
fitView
|
||||
{proOptions}
|
||||
minZoom={0.1}
|
||||
maxZoom={3}
|
||||
nodesDraggable={false}
|
||||
>
|
||||
<Controls />
|
||||
</SvelteFlow>
|
||||
</SvelteFlowProvider>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
:global(.svelte-flow) {
|
||||
background: #fafafa;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script module lang="ts">
|
||||
/**
|
||||
* Sample ELK result demonstrating the wrapper approach:
|
||||
*
|
||||
* - `a` is a regular leaf node (the branchAll step), rendered before the wrapper
|
||||
* - `a__group` is the invisible compound wrapper (holds all branch lanes)
|
||||
* - Each `a-branch-X` is a compound lane (dashed border for debug)
|
||||
* with the branch-start label as its FIRST child node
|
||||
* - Remaining nodes (b, c, d, ...) are leaf children inside their lane
|
||||
*
|
||||
* Edges at root: Trigger→Input→a→a__group→a-end→Result
|
||||
* Edges inside lanes: branch-label→content nodes
|
||||
*/
|
||||
const SAMPLE_ELK_RESULT = JSON.stringify(
|
||||
{
|
||||
id: 'root',
|
||||
layoutOptions: {
|
||||
'elk.algorithm': 'layered',
|
||||
'elk.direction': 'DOWN'
|
||||
},
|
||||
children: [
|
||||
{ id: 'Trigger', width: 275, height: 34, x: 385, y: 12 },
|
||||
{ id: 'Input', width: 275, height: 34, x: 385, y: 108 },
|
||||
// `a` = branchAll step, rendered as a regular leaf node
|
||||
{ id: 'a', width: 275, height: 34, x: 385, y: 204 },
|
||||
// `a__group` = invisible wrapper compound for the branch lanes
|
||||
// width/height must fully contain all children (no overflow)
|
||||
// max child right = 710+299 = 1009, +12 padding = 1021
|
||||
// max child bottom = 12+346 = 358, +12 padding = 370
|
||||
{
|
||||
id: 'a__group',
|
||||
x: 12,
|
||||
y: 300,
|
||||
width: 1021,
|
||||
height: 370,
|
||||
children: [
|
||||
// Lane 0: compound with branch-start label as first child
|
||||
{
|
||||
id: 'a-branch-0',
|
||||
x: 12,
|
||||
y: 12,
|
||||
width: 299,
|
||||
height: 250,
|
||||
children: [
|
||||
// First child = branch start label node
|
||||
{ id: 'a-branch-0-label', width: 275, height: 34, x: 12, y: 12 },
|
||||
{ id: 'b', width: 275, height: 34, x: 12, y: 108 },
|
||||
{ id: 'c', width: 275, height: 34, x: 12, y: 204 }
|
||||
],
|
||||
edges: [
|
||||
{
|
||||
id: 'e-label0-b',
|
||||
sources: ['a-branch-0-label'],
|
||||
targets: ['b']
|
||||
},
|
||||
{ id: 'e-b-c', sources: ['b'], targets: ['c'] }
|
||||
]
|
||||
},
|
||||
// Lane 1
|
||||
{
|
||||
id: 'a-branch-1',
|
||||
x: 361,
|
||||
y: 12,
|
||||
width: 299,
|
||||
height: 154,
|
||||
children: [
|
||||
{ id: 'a-branch-1-label', width: 275, height: 34, x: 12, y: 12 },
|
||||
{ id: 'd', width: 275, height: 34, x: 12, y: 108 }
|
||||
],
|
||||
edges: [
|
||||
{
|
||||
id: 'e-label1-d',
|
||||
sources: ['a-branch-1-label'],
|
||||
targets: ['d']
|
||||
}
|
||||
]
|
||||
},
|
||||
// Lane 2
|
||||
{
|
||||
id: 'a-branch-2',
|
||||
x: 710,
|
||||
y: 12,
|
||||
width: 299,
|
||||
height: 346,
|
||||
children: [
|
||||
{ id: 'a-branch-2-label', width: 275, height: 34, x: 12, y: 12 },
|
||||
{ id: 'e', width: 275, height: 34, x: 12, y: 108 },
|
||||
{ id: 'f', width: 275, height: 34, x: 12, y: 204 },
|
||||
{ id: 'g', width: 275, height: 34, x: 12, y: 300 }
|
||||
],
|
||||
edges: [
|
||||
{
|
||||
id: 'e-label2-e',
|
||||
sources: ['a-branch-2-label'],
|
||||
targets: ['e']
|
||||
},
|
||||
{ id: 'e-e-f', sources: ['e'], targets: ['f'] },
|
||||
{ id: 'e-f-g', sources: ['f'], targets: ['g'] }
|
||||
]
|
||||
}
|
||||
],
|
||||
edges: []
|
||||
},
|
||||
// a__group bottom = 300+370 = 670, +62 gap = 732
|
||||
{ id: 'a-end', width: 275, height: 34, x: 385, y: 732 },
|
||||
{ id: 'Result', width: 275, height: 34, x: 385, y: 828 }
|
||||
],
|
||||
edges: [
|
||||
{ id: 'e-Trigger-Input', sources: ['Trigger'], targets: ['Input'] },
|
||||
{ id: 'e-Input-a', sources: ['Input'], targets: ['a'] },
|
||||
{ id: 'e-a-group', sources: ['a'], targets: ['a__group'] },
|
||||
{ id: 'e-group-end', sources: ['a__group'], targets: ['a-end'] },
|
||||
{ id: 'e-a-end-Result', sources: ['a-end'], targets: ['Result'] }
|
||||
],
|
||||
width: 1045,
|
||||
height: 874
|
||||
},
|
||||
null,
|
||||
2
|
||||
)
|
||||
</script>
|
||||