sundog
/
ffmpeg-explorer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

better graphs

This commit is contained in:
Sam Lavigne 2023-08-24 14:47:22 -04:00
parent 66327ad1c8
commit 09e4b5858c
2 changed files with 42 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/Graph.svelte
View File

@ -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}

67
src/stores.js
View File

@ -190,8 +190,8 @@ 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);
@ -200,7 +200,7 @@ export const previewCommand = derived([edges, nodes], ([$edges, $nodes]) => {
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) {
@ -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++) {
const targetEdgeType = n2.data.inputs[k];
if (edgeType === targetEdgeType && !filled.includes(n2.id+k)) {
newEdges.push({ newEdges.push({
id: uuidv4(), id: uuidv4(),
type: "default", type: "default",
source: n1.id, source: n1.id,
target: n2.id, target: n2.id,
sourceHandle: edgeType + "_" + j, sourceHandle: edgeType + "_" + i,
targetHandle: edgeType + "_" + ind, targetHandle: edgeType + "_" + k,
}); });
filled.push(n2.id + edgeType + ind); filled.push(n2.id+ k);
found = true;
break; break;
} }
} }
if (found) break;
} }
} }
// for (let i = 0; i < orderedNodes.length - 1; i++) { const nextNode = rest.shift();
// const n1 = orderedNodes[i]; if (nextNode) {
// const n2 = orderedNodes[i + 1]; connectNode(nextNode, rest);
// for (let j = 0; j < n1.data.outputs.length; j++) { }
// const edgeType = n1.data.outputs[j]; }
// if (n2.data.inputs.includes(edgeType)) {
// newEdges.push({ for (let inpNode of inputNodes) {
// id: uuidv4(), connectNode(inpNode, [...orderedNodes]);
// type: "default", }
// source: n1.id, // console.log("new", newEdges);
// target: n2.id,
// sourceHandle: edgeType + "_0",
// targetHandle: edgeType + "_0",
// });
// }
// }
// }
console.log("new", newEdges);
edges.set(newEdges); edges.set(newEdges);
}); });