disable cloze&math buttons in html mode

Following on from 8a07d3161d
Keeping them active seems to encourage users to experiment:
https://forums.ankiweb.net/t/cloze-deleting-html-svg/11011
This commit is contained in:
Damien Elmes 2021-06-25 10:26:07 +10:00
parent 33c9ae211a
commit 18843e711d
2 changed files with 22 additions and 15 deletions

View file

@ -5,6 +5,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<script lang="typescript"> <script lang="typescript">
import * as tr from "lib/i18n"; import * as tr from "lib/i18n";
import { disabledKey } from "components/contextKeys"; import { disabledKey } from "components/contextKeys";
import { inCodableKey } from "./contextKeys";
import IconButton from "components/IconButton.svelte"; import IconButton from "components/IconButton.svelte";
import WithShortcut from "components/WithShortcut.svelte"; import WithShortcut from "components/WithShortcut.svelte";
@ -45,13 +46,15 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<WithShortcut shortcut={"Control+Alt?+Shift+C"} let:createShortcut let:shortcutLabel> <WithShortcut shortcut={"Control+Alt?+Shift+C"} let:createShortcut let:shortcutLabel>
<WithContext key={disabledKey} let:context={disabled}> <WithContext key={disabledKey} let:context={disabled}>
<IconButton <WithContext key={inCodableKey} let:context={inCodable}>
tooltip={`${tr.editingClozeDeletion()} (${shortcutLabel})`} <IconButton
{disabled} tooltip={`${tr.editingClozeDeletion()} (${shortcutLabel})`}
on:click={onCloze} disabled={inCodable || disabled}
on:mount={createShortcut} on:click={onCloze}
> on:mount={createShortcut}
{@html bracketsIcon} >
</IconButton> {@html bracketsIcon}
</IconButton>
</WithContext>
</WithContext> </WithContext>
</WithShortcut> </WithShortcut>

View file

@ -82,18 +82,22 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
</ButtonGroupItem> </ButtonGroupItem>
<ButtonGroupItem id="cloze"> <ButtonGroupItem id="cloze">
<ClozeButton /> <OnlyEditable>
<ClozeButton />
</OnlyEditable>
</ButtonGroupItem> </ButtonGroupItem>
<ButtonGroupItem> <ButtonGroupItem>
<WithDropdownMenu let:createDropdown let:menuId> <WithDropdownMenu let:createDropdown let:menuId>
<WithContext key={disabledKey} let:context={disabled}> <WithContext key={disabledKey} let:context={disabled}>
<IconButton <OnlyEditable let:disabled={inCodable}>
{disabled} <IconButton
on:mount={(event) => createDropdown(event.detail.button)} disabled={disabled || inCodable}
> on:mount={(event) => createDropdown(event.detail.button)}
{@html functionIcon} >
</IconButton> {@html functionIcon}
</IconButton>
</OnlyEditable>
</WithContext> </WithContext>
<DropdownMenu id={menuId}> <DropdownMenu id={menuId}>