better graphs
This commit is contained in:
parent
66327ad1c8
commit
09e4b5858c
|
@ -1,5 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import { nodes, edges} from "./stores.js";
|
import { nodes, edges, auto} from "./stores.js";
|
||||||
import { SvelteFlow, Controls, Background, BackgroundVariant, MiniMap } from "@xyflow/svelte";
|
import { SvelteFlow, Controls, Background, BackgroundVariant, MiniMap } from "@xyflow/svelte";
|
||||||
import Node from "./nodes/Node.svelte";
|
import Node from "./nodes/Node.svelte";
|
||||||
|
|
||||||
|
@ -31,6 +31,7 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
<label for="auto"><input id="auto" type="checkbox" bind:checked={$auto} />Automatic Layout</label>
|
||||||
<div style="width: 900px; height: 500px;">
|
<div style="width: 900px; height: 500px;">
|
||||||
<SvelteFlow
|
<SvelteFlow
|
||||||
{nodeTypes}
|
{nodeTypes}
|
||||||
|
|
|
@ -189,19 +189,19 @@ export const previewCommand = derived([edges, nodes], ([$edges, $nodes]) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (filtergraph.length > 0) {
|
if (filtergraph.length > 0) {
|
||||||
const fg = '"' + filtergraph.join(";") + '"';
|
const fg = '"' + filtergraph.join(";") + '"';
|
||||||
hasVid = fg.includes(":v]")
|
hasVid = fg.includes(":v]");
|
||||||
hasAud = fg.includes(":a]")
|
hasAud = fg.includes(":a]");
|
||||||
|
|
||||||
finalCommand.push("-filter_complex");
|
finalCommand.push("-filter_complex");
|
||||||
finalCommand.push(fg);
|
finalCommand.push(fg);
|
||||||
|
|
||||||
finalCommand.push("-map");
|
finalCommand.push("-map");
|
||||||
if (hasAud) {
|
if (hasAud) {
|
||||||
finalCommand.push('"[aud_out]"');
|
finalCommand.push('"[aud_out]"');
|
||||||
} else {
|
} else {
|
||||||
finalCommand.push('0:a');
|
finalCommand.push("0:a");
|
||||||
}
|
}
|
||||||
|
|
||||||
if (hasVid) {
|
if (hasVid) {
|
||||||
finalCommand.push("-map");
|
finalCommand.push("-map");
|
||||||
|
@ -260,61 +260,52 @@ export const output = derived(nodes, ($nodes) => {
|
||||||
});
|
});
|
||||||
|
|
||||||
nodes.subscribe(($nodes) => {
|
nodes.subscribe(($nodes) => {
|
||||||
console.log($nodes);
|
|
||||||
const isAuto = get(auto);
|
const isAuto = get(auto);
|
||||||
if (!isAuto) return;
|
if (!isAuto) return;
|
||||||
|
|
||||||
const outputNodes = $nodes.filter((n) => n.nodeType === "output");
|
const outputNodes = $nodes.filter((n) => n.nodeType === "output");
|
||||||
const inputNodes = $nodes.filter((n) => n.nodeType === "input");
|
const inputNodes = $nodes.filter((n) => n.nodeType === "input");
|
||||||
const filterNodes = $nodes.filter((n) => n.nodeType === "filter");
|
const filterNodes = $nodes.filter((n) => n.nodeType === "filter");
|
||||||
const orderedNodes = []
|
const orderedNodes = [].concat(filterNodes, outputNodes).filter((n) => n != undefined);
|
||||||
.concat(inputNodes, filterNodes, outputNodes)
|
|
||||||
.filter((n) => n != undefined);
|
|
||||||
|
|
||||||
const filled = [];
|
const filled = [];
|
||||||
|
|
||||||
// find next open output for same input
|
|
||||||
let newEdges = [];
|
let newEdges = [];
|
||||||
for (let i = 0; i < orderedNodes.length; i++) {
|
|
||||||
const n1 = orderedNodes[i];
|
function connectNode(n1, rest) {
|
||||||
for (let j = 0; j < n1.data.outputs.length; j++) {
|
for (let i = 0; i < n1.data.outputs.length; i++) {
|
||||||
const edgeType = n1.data.outputs[j];
|
const edgeType = n1.data.outputs[i];
|
||||||
for (let k = i + 1; k < orderedNodes.length; k++) {
|
for (let j = 0; j < rest.length; j++) {
|
||||||
const n2 = orderedNodes[k];
|
let found = false;
|
||||||
const ind = n2.data.inputs.indexOf(edgeType);
|
const n2 = rest[j];
|
||||||
if (ind > -1 && !filled.includes(n2.id + edgeType + ind)) {
|
for (let k = 0; k < n2.data.inputs.length; k++) {
|
||||||
newEdges.push({
|
const targetEdgeType = n2.data.inputs[k];
|
||||||
id: uuidv4(),
|
if (edgeType === targetEdgeType && !filled.includes(n2.id+k)) {
|
||||||
type: "default",
|
newEdges.push({
|
||||||
source: n1.id,
|
id: uuidv4(),
|
||||||
target: n2.id,
|
type: "default",
|
||||||
sourceHandle: edgeType + "_" + j,
|
source: n1.id,
|
||||||
targetHandle: edgeType + "_" + ind,
|
target: n2.id,
|
||||||
});
|
sourceHandle: edgeType + "_" + i,
|
||||||
filled.push(n2.id + edgeType + ind);
|
targetHandle: edgeType + "_" + k,
|
||||||
break;
|
});
|
||||||
|
filled.push(n2.id+ k);
|
||||||
|
found = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
if (found) break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
const nextNode = rest.shift();
|
||||||
|
if (nextNode) {
|
||||||
|
connectNode(nextNode, rest);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// for (let i = 0; i < orderedNodes.length - 1; i++) {
|
|
||||||
// const n1 = orderedNodes[i];
|
for (let inpNode of inputNodes) {
|
||||||
// const n2 = orderedNodes[i + 1];
|
connectNode(inpNode, [...orderedNodes]);
|
||||||
// for (let j = 0; j < n1.data.outputs.length; j++) {
|
}
|
||||||
// const edgeType = n1.data.outputs[j];
|
// console.log("new", newEdges);
|
||||||
// if (n2.data.inputs.includes(edgeType)) {
|
|
||||||
// newEdges.push({
|
|
||||||
// id: uuidv4(),
|
|
||||||
// type: "default",
|
|
||||||
// source: n1.id,
|
|
||||||
// target: n2.id,
|
|
||||||
// sourceHandle: edgeType + "_0",
|
|
||||||
// targetHandle: edgeType + "_0",
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
console.log("new", newEdges);
|
|
||||||
edges.set(newEdges);
|
edges.set(newEdges);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue