Use event object in createShortcut, fix F8 for highlight

This commit is contained in:
Henrik Giesel 2021-07-26 06:15:30 +02:00
parent 66faa4ec25
commit 95c8f5a12a
9 changed files with 21 additions and 20 deletions

View file

@ -29,7 +29,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
theme="primary" theme="primary"
on:click={() => save()} on:click={() => save()}
tooltip={shortcutLabel} tooltip={shortcutLabel}
on:mount={createShortcut}>{tr.actionsSave()}</LabelButton on:mount={(event) => createShortcut(event.detail.button)}
>{tr.actionsSave()}</LabelButton
> >
</WithShortcut> </WithShortcut>
</ButtonGroupItem> </ButtonGroupItem>

View file

@ -12,8 +12,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
let deregister: () => void; let deregister: () => void;
function createShortcut({ detail }: CustomEvent): void { function createShortcut(mounted: HTMLElement): void {
const mounted: HTMLButtonElement = detail.button;
deregister = registerShortcut((event: KeyboardEvent) => { deregister = registerShortcut((event: KeyboardEvent) => {
mounted.dispatchEvent(new MouseEvent("click", event)); mounted.dispatchEvent(new MouseEvent("click", event));
event.preventDefault(); event.preventDefault();

View file

@ -65,7 +65,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
theme="primary" theme="primary"
on:click={() => save(false)} on:click={() => save(false)}
tooltip={shortcutLabel} tooltip={shortcutLabel}
on:mount={createShortcut}>{tr.deckConfigSaveButton()}</LabelButton on:mount={(event) => createShortcut(event.detail.button)}
>{tr.deckConfigSaveButton()}</LabelButton
> >
</WithShortcut> </WithShortcut>
</ButtonGroupItem> </ButtonGroupItem>

View file

@ -48,7 +48,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
tooltip={`${tr.editingClozeDeletion()} (${shortcutLabel})`} tooltip={`${tr.editingClozeDeletion()} (${shortcutLabel})`}
{disabled} {disabled}
on:click={onCloze} on:click={onCloze}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{@html ellipseIcon} {@html ellipseIcon}
</IconButton> </IconButton>

View file

@ -44,7 +44,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
)} )}
{disabled} {disabled}
on:click={forecolorWrap} on:click={forecolorWrap}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{@html textColorIcon} {@html textColorIcon}
{@html colorHelperIcon} {@html colorHelperIcon}
@ -68,7 +68,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
forecolorWrap = wrapWithForecolor(setColor(event)); forecolorWrap = wrapWithForecolor(setColor(event));
forecolorWrap(); forecolorWrap();
}} }}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.input)}
/> />
</IconButton> </IconButton>
</WithShortcut> </WithShortcut>

View file

@ -48,7 +48,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
tooltip={appendInParentheses(tooltip, shortcutLabel)} tooltip={appendInParentheses(tooltip, shortcutLabel)}
{disabled} {disabled}
on:click={() => document.execCommand(key)} on:click={() => document.execCommand(key)}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
<slot /> <slot />
</IconButton> </IconButton>
@ -69,7 +69,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
document.execCommand(key); document.execCommand(key);
updateState(event); updateState(event);
}} }}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
<slot /> <slot />
</IconButton> </IconButton>

View file

@ -29,7 +29,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<LabelButton <LabelButton
tooltip={`${tr.editingCustomizeCardTemplates()} (${shortcutLabel})`} tooltip={`${tr.editingCustomizeCardTemplates()} (${shortcutLabel})`}
on:click={() => bridgeCommand("cards")} on:click={() => bridgeCommand("cards")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.editingCards()}... {tr.editingCards()}...
</LabelButton> </LabelButton>

View file

@ -14,7 +14,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<LabelButton <LabelButton
tooltip={tr.browsingPreviewSelectedCard({ val: shortcutLabel })} tooltip={tr.browsingPreviewSelectedCard({ val: shortcutLabel })}
on:click={() => bridgeCommand("preview")} on:click={() => bridgeCommand("preview")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.actionsPreview()} {tr.actionsPreview()}
</LabelButton> </LabelButton>

View file

@ -53,7 +53,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
iconSize={70} iconSize={70}
{disabled} {disabled}
on:click={onAttachment} on:click={onAttachment}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{@html paperclipIcon} {@html paperclipIcon}
</IconButton> </IconButton>
@ -72,7 +72,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
iconSize={70} iconSize={70}
{disabled} {disabled}
on:click={onRecord} on:click={onRecord}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{@html micIcon} {@html micIcon}
</IconButton> </IconButton>
@ -105,7 +105,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
> >
<DropdownItem <DropdownItem
on:click={() => wrapCurrent("\\(", "\\)")} on:click={() => wrapCurrent("\\(", "\\)")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.editingMathjaxInline()} {tr.editingMathjaxInline()}
<span class="ps-1 float-end">{shortcutLabel}</span> <span class="ps-1 float-end">{shortcutLabel}</span>
@ -119,7 +119,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
> >
<DropdownItem <DropdownItem
on:click={() => wrapCurrent("\\[", "\\]")} on:click={() => wrapCurrent("\\[", "\\]")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.editingMathjaxBlock()} {tr.editingMathjaxBlock()}
<span class="ps-1 float-end">{shortcutLabel}</span> <span class="ps-1 float-end">{shortcutLabel}</span>
@ -133,7 +133,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
> >
<DropdownItem <DropdownItem
on:click={() => wrapCurrent("\\(\\ce{", "}\\)")} on:click={() => wrapCurrent("\\(\\ce{", "}\\)")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.editingMathjaxChemistry()} {tr.editingMathjaxChemistry()}
<span class="ps-1 float-end">{shortcutLabel}</span> <span class="ps-1 float-end">{shortcutLabel}</span>
@ -147,7 +147,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
> >
<DropdownItem <DropdownItem
on:click={() => wrapCurrent("[latex]", "[/latex]")} on:click={() => wrapCurrent("[latex]", "[/latex]")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.editingLatex()} {tr.editingLatex()}
<span class="ps-1 float-end">{shortcutLabel}</span> <span class="ps-1 float-end">{shortcutLabel}</span>
@ -161,7 +161,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
> >
<DropdownItem <DropdownItem
on:click={() => wrapCurrent("[$]", "[/$]")} on:click={() => wrapCurrent("[$]", "[/$]")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.editingLatexEquation()} {tr.editingLatexEquation()}
<span class="ps-1 float-end">{shortcutLabel}</span> <span class="ps-1 float-end">{shortcutLabel}</span>
@ -175,7 +175,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
> >
<DropdownItem <DropdownItem
on:click={() => wrapCurrent("[$$]", "[/$$]")} on:click={() => wrapCurrent("[$$]", "[/$$]")}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{tr.editingLatexMathEnv()} {tr.editingLatexMathEnv()}
<span class="ps-1 float-end">{shortcutLabel}</span> <span class="ps-1 float-end">{shortcutLabel}</span>
@ -202,7 +202,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
active={inCodable} active={inCodable}
disabled={!fieldFocused} disabled={!fieldFocused}
on:click={onHtmlEdit} on:click={onHtmlEdit}
on:mount={createShortcut} on:mount={(event) => createShortcut(event.detail.button)}
> >
{@html xmlIcon} {@html xmlIcon}
</IconButton> </IconButton>