mirror of
https://github.com/ankitects/anki.git
synced 2025-09-18 22:12:21 -04:00
efaaae8ce4
* NF: replace `disabled` by `enabled` This allows to remove the negations and, in my opinion, make the code easier to understand and edit. * Cloze button get disabled outside of cloze field More specifically, if the user focus in a field that is not a cloze field, the button are still there but appear as disabled. The shortcut instead of adding the cloze context shows an alert explaining why this can't be done. While this message is already displayed when the user tries to add a note with cloze in non-cloze field, I suspect it will save time to stop the user as soon as possible from making mistake. This should make very clear what is authorized and what is not. It'll also be a reminder of whether the current field is a cloze or not. In order to do this, I added a back-end method (that I expect we may reuse in ankidroid) to get the index of the fields used in cloze. This set is sent to the note editor, which propagates it where needed. In mathjax, the cloze symbol is removed when the selected field is not a cloze field.
58 lines
1.7 KiB
Svelte
58 lines
1.7 KiB
Svelte
<!--
|
|
Copyright: Ankitects Pty Ltd and contributors
|
|
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|
-->
|
|
<script lang="ts">
|
|
import * as tr from "@generated/ftl";
|
|
import { createEventDispatcher } from "svelte";
|
|
|
|
import ButtonGroup from "$lib/components/ButtonGroup.svelte";
|
|
import ButtonToolbar from "$lib/components/ButtonToolbar.svelte";
|
|
import Icon from "$lib/components/Icon.svelte";
|
|
import IconButton from "$lib/components/IconButton.svelte";
|
|
import { blockIcon, deleteIcon, inlineIcon } from "$lib/components/icons";
|
|
|
|
import ClozeButtons from "../ClozeButtons.svelte";
|
|
|
|
export let isBlock: boolean;
|
|
export let isClozeField: boolean;
|
|
|
|
const dispatch = createEventDispatcher();
|
|
</script>
|
|
|
|
<ButtonToolbar size={1.6} wrap={false}>
|
|
<ButtonGroup>
|
|
<IconButton
|
|
tooltip={tr.editingMathjaxInline()}
|
|
active={!isBlock}
|
|
on:click={() => dispatch("setinline")}
|
|
--border-left-radius="5px"
|
|
>
|
|
<Icon icon={inlineIcon} />
|
|
</IconButton>
|
|
|
|
<IconButton
|
|
tooltip={tr.editingMathjaxBlock()}
|
|
active={isBlock}
|
|
on:click={() => dispatch("setblock")}
|
|
--border-right-radius="5px"
|
|
>
|
|
<Icon icon={blockIcon} />
|
|
</IconButton>
|
|
</ButtonGroup>
|
|
|
|
{#if isClozeField}
|
|
<ClozeButtons on:surround alwaysEnabled={true} />
|
|
{/if}
|
|
|
|
<ButtonGroup>
|
|
<IconButton
|
|
tooltip={tr.actionsDelete()}
|
|
on:click={() => dispatch("delete")}
|
|
--border-left-radius="5px"
|
|
--border-right-radius="5px"
|
|
>
|
|
<Icon icon={deleteIcon} />
|
|
</IconButton>
|
|
</ButtonGroup>
|
|
</ButtonToolbar>
|