search

newcat / baklavajs

Graph / node editor in the browser using VueJS
http://baklava.tech
MIT License
1.47k stars 107 forks source link

Automatically open sidebar for highlighted node #413

Closed voxelstack closed 2 months ago

voxelstack commented 2 months ago

I would like to open the sidebar automatically whenever a node is clicked but I don't see any events for when a node is selected. Is it currently possible?

If not I feel like it should be, and I'd be happy to try making a PR for it if given a little guidance.

louisefp commented 2 months ago

Hello,

I think it's already implemented, Here is the sidebar documentation https://v2.baklava.tech/visual-editor/sidebar.html

Hope it helps,

Louise

newcat commented 2 months ago

There are no explicit events if a node is selected/deselected, but you can watch the selectedNodes property on the displayed graph:

import { watch } from "vue";
import { useBaklava } from "baklavajs";

const baklava = useBaklava();

watch(() => baklava.displayedGraph.selectedNodes, () => {
  // this function is called whenever a node is selected/deselected
});

Then you can programmatically open the sidebar using the OPEN_SIDEBAR command, as described in the link posted by Louise. Here is a description of how commands work: https://v2.baklava.tech/visual-editor/commands.html

voxelstack commented 2 months ago

Perfect, that works! I was able to open the sidebar for a given node, all that was missing was a way to watch for the last placed/selected node.