1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-08-07 23:03:00 +03:00

Lexical: Media form improvements

- Allowed re-editing of existing embed HTML code.
- Handled "src" form field when video is using child source tags.
This commit is contained in:
Dan Brown
2025-06-15 20:00:28 +01:00
parent 1611b0399f
commit b913ae703d
4 changed files with 46 additions and 6 deletions

View File

@@ -192,11 +192,17 @@ export function $showMediaForm(media: MediaNode|null, context: EditorUiContext):
let formDefaults = {};
if (media) {
const nodeAttrs = media.getAttributes();
const nodeDOM = media.exportDOM(context.editor).element;
const nodeHtml = (nodeDOM instanceof HTMLElement) ? nodeDOM.outerHTML : '';
formDefaults = {
src: nodeAttrs.src || nodeAttrs.data || '',
src: nodeAttrs.src || nodeAttrs.data || media.getSources()[0]?.src || '',
width: nodeAttrs.width,
height: nodeAttrs.height,
embed: '',
embed: nodeHtml,
// This is used so we can check for edits against the embed field on submit
embed_check: nodeHtml,
}
}
@@ -214,7 +220,8 @@ export const media: EditorFormDefinition = {
}));
const embedCode = (formData.get('embed') || '').toString().trim();
if (embedCode) {
const embedCheck = (formData.get('embed_check') || '').toString().trim();
if (embedCode && embedCode !== embedCheck) {
context.editor.update(() => {
const node = $createMediaNodeFromHtml(embedCode);
if (selectedNode && node) {
@@ -236,6 +243,7 @@ export const media: EditorFormDefinition = {
if (selectedNode) {
selectedNode.setSrc(src);
selectedNode.setWidthAndHeight(width, height);
context.manager.triggerFutureStateRefresh();
return;
}
@@ -281,6 +289,11 @@ export const media: EditorFormDefinition = {
name: 'embed',
type: 'textarea',
},
{
label: '',
name: 'embed_check',
type: 'hidden',
},
],
}
])