Redesign PaneCP as vertical focus-path menu; add score metadata to FO pane

PaneCP: replace horizontal breadcrumb with vertical list of short views
for each node in the focus path (type tag + label/identifier). Clicking
any item above current navigates up.

PaneFO: show score info fields (title, composer, source, encrypter) as
editable DL when at score level instead of 'Nothing selected'.
This commit is contained in:
c0dev0id
2026-06-23 18:45:13 +02:00
parent 839ea3f95c
commit 06b2bab5d3
2 changed files with 86 additions and 41 deletions

View File

@@ -3,6 +3,15 @@ import { ObjectExtended } from './ObjectExtended.js';
import { EnvelopeEditor } from './EnvelopeEditor.js';
import { LinkedInstrumentModal } from './LinkedInstrumentModal.js';
function scoreInfoFields(info) {
return [
{ key: 'title', value: info?.title ?? '', editable: true },
{ key: 'composer', value: info?.composer ?? '', editable: true },
{ key: 'source', value: info?.source ?? '', editable: true },
{ key: 'encrypter', value: info?.encrypter ?? '', editable: true },
];
}
function instrFields(instr) {
return [
{ key: 'name', value: instr.name, editable: false },
@@ -61,7 +70,19 @@ export const PaneFO = {
const children = [];
if (!node || node.type === 'score') {
return h('div', { class: 'se-fo-pane' }, 'Nothing selected');
const model = props.store.scoreModel;
if (!model) return h('div', { class: 'se-fo-pane' }, 'No score loaded');
return h('div', { class: 'se-fo-pane' }, [
h('h4', { style: 'margin:0 0 0.5rem' }, 'Score'),
h(ObjectExtended, {
fields: scoreInfoFields(model.info),
onChange: ({ key, value }) => {
if (!model.info) model.info = {};
model.info[key] = value;
props.store.markDirty();
},
}),
]);
}
if (node.type === 'instrument') {