From e8641edae4e90e7fe71cc74491ad4ed8a0a302f2 Mon Sep 17 00:00:00 2001 From: Jan Starzak Date: Tue, 21 Nov 2023 17:36:15 +0100 Subject: [PATCH] chore(ScriptEditor): rename nodes in Schema to match the rest of the UI --- .../apps/client/src/ScriptEditor/Editor.tsx | 29 ++++++----------- .../src/ScriptEditor/plugins/updateModel.ts | 31 +++++++++++++++++-- .../client/src/ScriptEditor/scriptSchema.ts | 22 +++++++------ 3 files changed, 50 insertions(+), 32 deletions(-) diff --git a/packages/apps/client/src/ScriptEditor/Editor.tsx b/packages/apps/client/src/ScriptEditor/Editor.tsx index 7cceaae..4b55eae 100644 --- a/packages/apps/client/src/ScriptEditor/Editor.tsx +++ b/packages/apps/client/src/ScriptEditor/Editor.tsx @@ -27,24 +27,15 @@ export function Editor({ void initialValue useEffect(() => { - function onKeyDown(ev: KeyboardEvent) { - console.log(ev) - if (ev.key === 'w' && ev.ctrlKey) { - ev.preventDefault() - } - } - function onBeforeUnload(ev: BeforeUnloadEvent) { ev.stopPropagation() ev.preventDefault() return false } - window.addEventListener('keydown', onKeyDown) window.addEventListener('beforeunload', onBeforeUnload, { capture: true }) return () => { - window.removeEventListener('keydown', onKeyDown) window.removeEventListener('beforeunload', onBeforeUnload, { capture: true }) } }, []) @@ -57,32 +48,32 @@ export function Editor({ schema.node(schema.nodes.segment, undefined, [ schema.node(schema.nodes.segmentTitle, undefined, schema.text('Segment Title')), schema.node( - schema.nodes.part, + schema.nodes.line, { - partId: randomId(), + lineId: randomId(), }, [ - schema.node(schema.nodes.partTitle, undefined, schema.text('Part title')), + schema.node(schema.nodes.lineTitle, undefined, schema.text('Line title')), schema.node(schema.nodes.paragraph, undefined, schema.text('Script...')), ] ), schema.node( - schema.nodes.part, + schema.nodes.line, { - partId: randomId(), + lineId: randomId(), }, [ - schema.node(schema.nodes.partTitle, undefined, schema.text('Part title')), + schema.node(schema.nodes.lineTitle, undefined, schema.text('Line title')), schema.node(schema.nodes.paragraph, undefined, schema.text('Script...')), ] ), schema.node( - schema.nodes.part, + schema.nodes.line, { - partId: randomId(), + lineId: randomId(), }, [ - schema.node(schema.nodes.partTitle, undefined, schema.text('Part title')), + schema.node(schema.nodes.lineTitle, undefined, schema.text('Line title')), schema.node(schema.nodes.paragraph, undefined, schema.text('Script...')), ] ), @@ -98,7 +89,7 @@ export function Editor({ keymap(formatingKeymap), keymap(baseKeymap), readOnlyNodeFilter(), - updateModel(), + updateModel(console.log), ], doc, }) diff --git a/packages/apps/client/src/ScriptEditor/plugins/updateModel.ts b/packages/apps/client/src/ScriptEditor/plugins/updateModel.ts index e712b78..ef133f8 100644 --- a/packages/apps/client/src/ScriptEditor/plugins/updateModel.ts +++ b/packages/apps/client/src/ScriptEditor/plugins/updateModel.ts @@ -1,10 +1,35 @@ import { Plugin } from 'prosemirror-state' +import { UILineId } from '../../model/UILine' -export function updateModel() { +export function updateModel(onChange?: (lineId: UILineId, contents: SomeContents) => void) { return new Plugin({ - appendTransaction: () => { - // console.log(newState) + appendTransaction: (trs, oldState, newState) => { + const anyChanges = trs.reduce((memo, tr) => memo || tr.docChanged, false) + if (!anyChanges) return null + + for (const tr of trs) { + for (const step of tr.steps) { + step.getMap().forEach((oldStart, oldEnd, newStart, newEnd) => { + oldState.doc.nodesBetween(oldStart, oldEnd, (_node, _pos, parent) => { + if (!parent) return + if (parent.type.name !== 'line') return + + const lineId = parent.attrs['lineId'] as UILineId + + newState.doc.nodesBetween(newStart, newEnd, (_node, _pos, parent) => { + if (!parent) return + if (parent.type.name !== 'line') return + + if (onChange) onChange(lineId, parent.toString()) + }) + }) + }) + } + } + return null }, }) } + +type SomeContents = unknown diff --git a/packages/apps/client/src/ScriptEditor/scriptSchema.ts b/packages/apps/client/src/ScriptEditor/scriptSchema.ts index 9762023..0bdca35 100644 --- a/packages/apps/client/src/ScriptEditor/scriptSchema.ts +++ b/packages/apps/client/src/ScriptEditor/scriptSchema.ts @@ -7,7 +7,7 @@ export const schema = new Schema({ paragraph: nodes.paragraph, - partTitle: { + lineTitle: { group: 'title', content: 'text*', atom: true, @@ -17,20 +17,22 @@ export const schema = new Schema({ selectable: false, locked: true, toDOM() { - return ['h2', { class: 'PartSlug', contenteditable: 'false' }, 0] + return ['h3', { class: 'LineSlug', contenteditable: 'false' }, 0] }, }, - part: { + line: { group: 'block', - content: 'partTitle paragraph*', - partId: { - default: null, + content: 'lineTitle paragraph*', + attrs: { + lineId: { + default: null, + }, }, isolating: true, draggable: false, selectable: false, toDOM() { - return ['div', { class: 'part' }, 0] + return ['div', { class: 'Line' }, 0] }, }, @@ -49,12 +51,12 @@ export const schema = new Schema({ }, segment: { group: 'block', - content: 'segmentTitle part*', + content: 'segmentTitle line*', isolating: true, draggable: false, selectable: false, toDOM() { - return ['div', { class: 'segment' }, 0] + return ['div', { class: 'Segment' }, 0] }, }, @@ -78,7 +80,7 @@ export const schema = new Schema({ draggable: false, selectable: false, toDOM() { - return ['div', { class: 'rundown' }, 0] + return ['div', { class: 'Rundown' }, 0] }, },