Display Mathjax editor and buttons at the same time

This commit is contained in:
Henrik Giesel 2021-08-07 02:25:16 +02:00
parent b06b5e9151
commit b361bcc69f
2 changed files with 22 additions and 29 deletions

View file

@ -130,8 +130,10 @@ export const Mathjax: DecoratedElementConstructor = class Mathjax
case "block": case "block":
this.block = newValue !== "false"; this.block = newValue !== "false";
this.component?.$set({ block: this.block }); this.component?.$set({ block: this.block });
break;
case "data-mathjax": case "data-mathjax":
this.component?.$set({ mathjax: newValue }); this.component?.$set({ mathjax: newValue });
break;
} }
} }

View file

@ -27,7 +27,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
resizeObserver.observe(container); resizeObserver.observe(container);
let updateSelection: () => void; let updateSelection: () => void;
let edit = false;
function onUpdate(event: CustomEvent) { function onUpdate(event: CustomEvent) {
activeImage!.parentElement!.dataset.mathjax = event.detail.mathjax; activeImage!.parentElement!.dataset.mathjax = event.detail.mathjax;
@ -51,37 +50,29 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
bind:updateSelection bind:updateSelection
on:mount={(event) => createDropdown(event.detail.selection)} on:mount={(event) => createDropdown(event.detail.selection)}
> >
<HandleBackground <HandleBackground on:click={(event) => event.stopPropagation()} />
on:click={(event) => event.stopPropagation()}
on:dblclick={() => (edit = !edit)}
/>
<HandleControl offsetX={1} offsetY={1} /> <HandleControl offsetX={1} offsetY={1} />
</HandleSelection> </HandleSelection>
{#if !edit} <DropdownMenu>
<DropdownMenu> <MathjaxHandleEditor
<MathjaxHandleEditor initialValue={activeImage.parentElement?.dataset.mathjax ?? ""}
initialValue={activeImage.parentElement?.dataset.mathjax ?? ""} on:update={(event) => {
on:update={(event) => { onUpdate(event);
onUpdate(event); setTimeout(dropdownObject.update);
setTimeout(dropdownObject.update); }}
}} />
/> <div
</DropdownMenu> on:click={() => {
{:else} updateSelection();
<ButtonDropdown> dropdownObject.update();
<div }}
on:click={() => { >
updateSelection(); <Item>
dropdownObject.update(); <MathjaxHandleInlineBlock {activeImage} {isRtl} />
}} </Item>
> </div>
<Item> </DropdownMenu>
<MathjaxHandleInlineBlock {activeImage} {isRtl} />
</Item>
</div>
</ButtonDropdown>
{/if}
{/if} {/if}
</WithDropdown> </WithDropdown>