diff --git a/static/components/AppShell.js b/static/components/AppShell.js index 661520f..146db82 100644 --- a/static/components/AppShell.js +++ b/static/components/AppShell.js @@ -31,11 +31,11 @@ export const AppShell = { // Pane area h('div', { class: 'se-pane-area' }, [ h('div', { class: ['se-pane', activePane.value === 'cp' ? 'active' : null] }, - h(PaneCP, { store, onImportClick: openImport })), + h(PaneCP, { store, onImportClick: openImport, onFocusFO: () => { activePane.value = 'fo'; } })), h('div', { class: ['se-pane', activePane.value === 'fo' ? 'active' : null] }, h(PaneFO, { store })), h('div', { class: ['se-pane', activePane.value === 'sub' ? 'active' : null] }, - h(PaneSubObjects, { store })), + h(PaneSubObjects, { store, onFocusFO: () => { activePane.value = 'fo'; } })), ]), // Handle bar (tab switcher at bottom) diff --git a/static/components/PaneCP.js b/static/components/PaneCP.js index 916843c..9dac7c9 100644 --- a/static/components/PaneCP.js +++ b/static/components/PaneCP.js @@ -32,7 +32,7 @@ function shortView(node) { } export const PaneCP = { - props: ['store', 'onImportClick'], + props: ['store', 'onImportClick', 'onFocusFO'], setup(props) { const exporting = ref(false); const exportError = ref(''); @@ -92,6 +92,7 @@ export const PaneCP = { onClick: () => { if (idx === -1) store.setFocus([]); else store.setFocus(fp.slice(0, idx + 1)); + props.onFocusFO?.(); }, }, [ h('span', { class: 'se-object-type' }, typeTag), diff --git a/static/components/PaneSubObjects.js b/static/components/PaneSubObjects.js index 2d82073..b9dfb89 100644 --- a/static/components/PaneSubObjects.js +++ b/static/components/PaneSubObjects.js @@ -3,7 +3,7 @@ import { ObjectShort } from './ObjectShort.js'; // Shows sub-objects of the currently focused node — variations, bars, voices, etc. export const PaneSubObjects = { - props: ['store'], + props: ['store', 'onFocusFO'], setup(props) { function focused() { const fp = props.store.focusPath; @@ -71,8 +71,8 @@ export const PaneSubObjects = { typeTag: item.kind, focused: props.store.focusPath.includes(item.node), hasChildren: item.hasChildren ?? (item.kind !== 'bar' && item.kind !== 'voice'), - onFocus: () => props.store.pushFocus(item.node), - onDrillDown: () => props.store.pushFocus(item.node), + onFocus: () => { props.store.pushFocus(item.node); props.onFocusFO?.(); }, + onDrillDown: () => { props.store.pushFocus(item.node); props.onFocusFO?.(); }, }) )), ]);