mirror of
https://github.com/ankitects/anki.git
synced 2025-09-18 14:02:21 -04:00
Port Focus tags shortcut to webview
This commit is contained in:
parent
f3df0fe305
commit
f056851c1e
15 changed files with 68 additions and 42 deletions
|
@ -300,9 +300,7 @@ $editorToolbar.then(({{ toolbar }}) => toolbar.appendGroup({{
|
|||
|
||||
def setupShortcuts(self) -> None:
|
||||
# if a third element is provided, enable shortcut even when no field selected
|
||||
cuts: List[Tuple] = [
|
||||
("Ctrl+Shift+T", self.onFocusTags, True),
|
||||
]
|
||||
cuts: List[Tuple] = []
|
||||
gui_hooks.editor_did_init_shortcuts(cuts, self)
|
||||
for row in cuts:
|
||||
if len(row) == 2:
|
||||
|
|
|
@ -5,6 +5,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<script lang="ts">
|
||||
import * as tr from "lib/i18n";
|
||||
import type { ChangeNotetypeState } from "./lib";
|
||||
import { withButton } from "components/helpers";
|
||||
|
||||
import ButtonGroup from "components/ButtonGroup.svelte";
|
||||
import ButtonGroupItem from "components/ButtonGroupItem.svelte";
|
||||
|
@ -29,9 +30,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
theme="primary"
|
||||
on:click={() => save()}
|
||||
tooltip={shortcutLabel}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
>{tr.actionsSave()}</LabelButton
|
||||
>
|
||||
on:mount={withButton(createShortcut)}
|
||||
>{tr.actionsSave()}</LabelButton>
|
||||
</WithShortcut>
|
||||
</ButtonGroupItem>
|
||||
</ButtonGroup>
|
||||
|
|
|
@ -9,6 +9,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
|
||||
let className = "";
|
||||
export { className as class };
|
||||
export let tooltip: string | undefined;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
|
@ -23,6 +24,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
|
||||
<span
|
||||
bind:this={spanRef}
|
||||
title={tooltip}
|
||||
class={`badge ${className}`}
|
||||
class:dropdown-toggle={dropdownProps.dropdown}
|
||||
{...dropdownProps}
|
||||
|
|
|
@ -12,9 +12,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
|
||||
let deregister: () => void;
|
||||
|
||||
function createShortcut(mounted: HTMLElement): void {
|
||||
function createShortcut(element: HTMLElement): void {
|
||||
deregister = registerShortcut((event: KeyboardEvent) => {
|
||||
mounted.dispatchEvent(new MouseEvent("click", event));
|
||||
element.dispatchEvent(new MouseEvent("click", event));
|
||||
event.preventDefault();
|
||||
}, shortcut);
|
||||
}
|
||||
|
|
|
@ -14,3 +14,15 @@ export function mergeTooltipAndShortcut(
|
|||
}
|
||||
return buf;
|
||||
}
|
||||
|
||||
export const withButton =
|
||||
(f: (button: HTMLButtonElement) => void) =>
|
||||
({ detail }: CustomEvent): void => {
|
||||
f(detail.button);
|
||||
};
|
||||
|
||||
export const withSpan =
|
||||
(f: (span: HTMLSpanElement) => void) =>
|
||||
({ detail }: CustomEvent): void => {
|
||||
f(detail.span);
|
||||
};
|
||||
|
|
|
@ -7,6 +7,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
import { createEventDispatcher } from "svelte";
|
||||
import type { DeckOptionsState } from "./lib";
|
||||
import type Dropdown from "bootstrap/js/dist/dropdown";
|
||||
import { withButton } from "components/helpers";
|
||||
|
||||
import ButtonGroup from "components/ButtonGroup.svelte";
|
||||
import ButtonGroupItem from "components/ButtonGroupItem.svelte";
|
||||
|
@ -65,7 +66,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
theme="primary"
|
||||
on:click={() => save(false)}
|
||||
tooltip={shortcutLabel}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>{tr.deckConfigSaveButton()}</LabelButton
|
||||
>
|
||||
</WithShortcut>
|
||||
|
|
|
@ -3,18 +3,28 @@ Copyright: Ankitects Pty Ltd and contributors
|
|||
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
||||
-->
|
||||
<script lang="ts">
|
||||
import WithShortcut from "components/WithShortcut.svelte";
|
||||
import Badge from "components/Badge.svelte";
|
||||
|
||||
import { withSpan } from "components/helpers";
|
||||
import { appendInParentheses } from "./helpers";
|
||||
import { tagIcon, addTagIcon } from "./icons";
|
||||
|
||||
let theTagIcon = tagIcon;
|
||||
|
||||
const tooltip = "Add tag";
|
||||
</script>
|
||||
|
||||
<Badge
|
||||
class="add-icon d-flex me-1"
|
||||
on:click
|
||||
on:mouseenter={() => (theTagIcon = addTagIcon)}
|
||||
on:mouseleave={() => (theTagIcon = tagIcon)}>{@html theTagIcon}</Badge
|
||||
>
|
||||
<WithShortcut shortcut="Control+Shift+T" let:createShortcut let:shortcutLabel>
|
||||
<Badge
|
||||
class="add-icon d-flex me-1"
|
||||
tooltip={appendInParentheses(tooltip, shortcutLabel)}
|
||||
on:click
|
||||
on:mouseenter={() => (theTagIcon = addTagIcon)}
|
||||
on:mouseleave={() => (theTagIcon = tagIcon)}
|
||||
on:mount={withSpan(createShortcut)}>{@html theTagIcon}</Badge
|
||||
>
|
||||
</WithShortcut>
|
||||
|
||||
<style lang="scss">
|
||||
:global(.add-icon > svg) {
|
||||
|
|
|
@ -9,6 +9,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
import WithShortcut from "components/WithShortcut.svelte";
|
||||
import OnlyEditable from "./OnlyEditable.svelte";
|
||||
|
||||
import { withButton } from "components/helpers";
|
||||
import { ellipseIcon } from "./icons";
|
||||
import { forEditorField } from ".";
|
||||
import { wrapCurrent } from "./wrap";
|
||||
|
@ -46,9 +47,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<OnlyEditable let:disabled>
|
||||
<IconButton
|
||||
tooltip={`${tr.editingClozeDeletion()} (${shortcutLabel})`}
|
||||
{disabled}
|
||||
disabled={disabled}
|
||||
on:click={onCloze}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{@html ellipseIcon}
|
||||
</IconButton>
|
||||
|
|
|
@ -14,6 +14,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
import OnlyEditable from "./OnlyEditable.svelte";
|
||||
|
||||
import { bridgeCommand } from "lib/bridgecommand";
|
||||
import { withButton } from "components/helpers";
|
||||
import { textColorIcon, highlightColorIcon, arrowIcon } from "./icons";
|
||||
import { appendInParentheses } from "./helpers";
|
||||
|
||||
|
@ -45,7 +46,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
)}
|
||||
{disabled}
|
||||
on:click={forecolorWrap}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{@html textColorIcon}
|
||||
{@html colorHelperIcon}
|
||||
|
@ -71,7 +72,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
forecolorWrap = wrapWithForecolor(setColor(event));
|
||||
forecolorWrap();
|
||||
}}
|
||||
on:mount={(event) => createShortcut(event.detail.input)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
/>
|
||||
</IconButton>
|
||||
</WithShortcut>
|
||||
|
|
|
@ -8,6 +8,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
import WithState from "components/WithState.svelte";
|
||||
import OnlyEditable from "./OnlyEditable.svelte";
|
||||
|
||||
import { withButton } from "components/helpers";
|
||||
import { appendInParentheses } from "./helpers";
|
||||
|
||||
export let key: string;
|
||||
|
@ -48,7 +49,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
tooltip={appendInParentheses(tooltip, shortcutLabel)}
|
||||
{disabled}
|
||||
on:click={() => document.execCommand(key)}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
<slot />
|
||||
</IconButton>
|
||||
|
@ -69,7 +70,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
document.execCommand(key);
|
||||
updateState(event);
|
||||
}}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
<slot />
|
||||
</IconButton>
|
||||
|
|
|
@ -5,6 +5,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<script lang="typescript">
|
||||
import { bridgeCommand } from "lib/bridgecommand";
|
||||
import * as tr from "lib/i18n";
|
||||
import { withButton } from "components/helpers";
|
||||
|
||||
import ButtonGroup from "components/ButtonGroup.svelte";
|
||||
import ButtonGroupItem from "components/ButtonGroupItem.svelte";
|
||||
|
@ -29,7 +30,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<LabelButton
|
||||
tooltip={`${tr.editingCustomizeCardTemplates()} (${shortcutLabel})`}
|
||||
on:click={() => bridgeCommand("cards")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.editingCards()}...
|
||||
</LabelButton>
|
||||
|
|
|
@ -5,6 +5,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<script lang="typescript">
|
||||
import { bridgeCommand } from "lib/bridgecommand";
|
||||
import * as tr from "lib/i18n";
|
||||
import { withButton } from "components/helpers";
|
||||
|
||||
import WithShortcut from "components/WithShortcut.svelte";
|
||||
import LabelButton from "components/LabelButton.svelte";
|
||||
|
@ -14,7 +15,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<LabelButton
|
||||
tooltip={tr.browsingPreviewSelectedCard({ val: shortcutLabel })}
|
||||
on:click={() => bridgeCommand("preview")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.actionsPreview()}
|
||||
</LabelButton>
|
||||
|
|
|
@ -32,7 +32,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
</script>
|
||||
|
||||
{#if active}
|
||||
<TagInputEdit bind:name on:focusout={() => (active = false)} on:update={updateTag} />
|
||||
<TagInputEdit
|
||||
bind:name
|
||||
on:focusout={() => (active = false)}
|
||||
on:update={updateTag}
|
||||
/>
|
||||
{:else}
|
||||
<span
|
||||
class="d-inline-flex align-items-center tag text-nowrap bg-secondary rounded ps-2 pe-1 me-1"
|
||||
|
|
|
@ -31,11 +31,4 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
/* } */
|
||||
</script>
|
||||
|
||||
<TagInput
|
||||
bind:name
|
||||
bind:input
|
||||
on:keydown={onKeydown}
|
||||
on:focusout
|
||||
on:update
|
||||
on:add
|
||||
/>
|
||||
<TagInput bind:name bind:input on:keydown={onKeydown} on:focusout on:update on:add />
|
||||
|
|
|
@ -19,6 +19,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
import ClozeButton from "./ClozeButton.svelte";
|
||||
|
||||
import { getCurrentField, appendInParentheses } from "./helpers";
|
||||
import { withButton } from "components/helpers";
|
||||
import { wrapCurrent } from "./wrap";
|
||||
import { paperclipIcon, micIcon, functionIcon, xmlIcon } from "./icons";
|
||||
|
||||
|
@ -52,7 +53,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
iconSize={70}
|
||||
{disabled}
|
||||
on:click={onAttachment}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{@html paperclipIcon}
|
||||
</IconButton>
|
||||
|
@ -71,7 +72,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
iconSize={70}
|
||||
{disabled}
|
||||
on:click={onRecord}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{@html micIcon}
|
||||
</IconButton>
|
||||
|
@ -90,7 +91,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<OnlyEditable let:disabled>
|
||||
<IconButton
|
||||
{disabled}
|
||||
on:mount={(event) => createDropdown(event.detail.button)}
|
||||
on:mount={withButton(createDropdown)}
|
||||
>
|
||||
{@html functionIcon}
|
||||
</IconButton>
|
||||
|
@ -104,7 +105,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
>
|
||||
<DropdownItem
|
||||
on:click={() => wrapCurrent("\\(", "\\)")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.editingMathjaxInline()}
|
||||
<span class="ps-1 float-end">{shortcutLabel}</span>
|
||||
|
@ -118,7 +119,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
>
|
||||
<DropdownItem
|
||||
on:click={() => wrapCurrent("\\[", "\\]")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.editingMathjaxBlock()}
|
||||
<span class="ps-1 float-end">{shortcutLabel}</span>
|
||||
|
@ -132,7 +133,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
>
|
||||
<DropdownItem
|
||||
on:click={() => wrapCurrent("\\(\\ce{", "}\\)")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.editingMathjaxChemistry()}
|
||||
<span class="ps-1 float-end">{shortcutLabel}</span>
|
||||
|
@ -146,7 +147,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
>
|
||||
<DropdownItem
|
||||
on:click={() => wrapCurrent("[latex]", "[/latex]")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.editingLatex()}
|
||||
<span class="ps-1 float-end">{shortcutLabel}</span>
|
||||
|
@ -160,7 +161,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
>
|
||||
<DropdownItem
|
||||
on:click={() => wrapCurrent("[$]", "[/$]")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.editingLatexEquation()}
|
||||
<span class="ps-1 float-end">{shortcutLabel}</span>
|
||||
|
@ -174,7 +175,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
>
|
||||
<DropdownItem
|
||||
on:click={() => wrapCurrent("[$$]", "[/$$]")}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{tr.editingLatexMathEnv()}
|
||||
<span class="ps-1 float-end">{shortcutLabel}</span>
|
||||
|
@ -201,7 +202,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
active={inCodable}
|
||||
disabled={!fieldFocused}
|
||||
on:click={onHtmlEdit}
|
||||
on:mount={(event) => createShortcut(event.detail.button)}
|
||||
on:mount={withButton(createShortcut)}
|
||||
>
|
||||
{@html xmlIcon}
|
||||
</IconButton>
|
||||
|
|
Loading…
Reference in a new issue