diff --git a/qt/aqt/editor.py b/qt/aqt/editor.py index d76bdc550..0cbb8059e 100644 --- a/qt/aqt/editor.py +++ b/qt/aqt/editor.py @@ -1114,6 +1114,9 @@ class Editor: paste=onPaste, cutOrCopy=onCutOrCopy, htmlEdit=onHtmlEdit, + mathjaxInline=insertMathjaxInline, + mathjaxBlock=insertMathjaxBlock, + mathjaxChemistry=insertMathjaxChemistry, ) diff --git a/ts/editor-toolbar/color.ts b/ts/editor-toolbar/color.ts index f0041badd..5868c674f 100644 --- a/ts/editor-toolbar/color.ts +++ b/ts/editor-toolbar/color.ts @@ -1,7 +1,7 @@ import IconButton from "./IconButton.svelte"; import ColorPicker from "./ColorPicker.svelte"; -import { lazyProperties } from "anki/lazy"; +import { withLazyProperties } from "anki/lazy"; import * as tr from "anki/i18n"; import squareFillIcon from "./square-fill.svg"; @@ -21,25 +21,27 @@ function wrapWithForecolor(color: string): void { document.execCommand("forecolor", false, color); } -const forecolorButton = { - component: IconButton, - icon: squareFillIcon, - className: "forecolor", - onClick: () => wrapWithForecolor(getForecolor()), -}; +const forecolorButton = withLazyProperties( + { + component: IconButton, + icon: squareFillIcon, + className: "forecolor", + onClick: () => wrapWithForecolor(getForecolor()), + }, + { + title: tr.editingSetForegroundColourF7, + } +); -lazyProperties(forecolorButton, { - title: tr.editingSetForegroundColourF7, -}); - -const colorpickerButton = { - component: ColorPicker, - className: "rainbow", - onChange: ({ currentTarget }) => setForegroundColor(currentTarget.value), -}; - -lazyProperties(colorpickerButton, { - title: tr.editingChangeColourF8, -}); +const colorpickerButton = withLazyProperties( + { + component: ColorPicker, + className: "rainbow", + onChange: ({ currentTarget }) => setForegroundColor(currentTarget.value), + }, + { + title: tr.editingChangeColourF8, + } +); export const colorButtons = [forecolorButton, colorpickerButton]; diff --git a/ts/editor-toolbar/format.ts b/ts/editor-toolbar/format.ts index d95321625..2f319c048 100644 --- a/ts/editor-toolbar/format.ts +++ b/ts/editor-toolbar/format.ts @@ -1,6 +1,6 @@ import CommandIconButton from "./CommandIconButton.svelte"; -import { lazyProperties } from "anki/lazy"; +import { withLazyProperties } from "anki/lazy"; import * as tr from "anki/i18n"; import boldIcon from "./type-bold.svg"; @@ -10,66 +10,72 @@ import superscriptIcon from "./format-superscript.svg"; import subscriptIcon from "./format-subscript.svg"; import eraserIcon from "./eraser.svg"; -const boldButton = { - component: CommandIconButton, - icon: boldIcon, - command: "bold", -}; +const boldButton = withLazyProperties( + { + component: CommandIconButton, + icon: boldIcon, + command: "bold", + }, + { + title: tr.editingBoldTextCtrlandb, + } +); -lazyProperties(boldButton, { - title: tr.editingBoldTextCtrlandb, -}); +const italicButton = withLazyProperties( + { + component: CommandIconButton, + icon: italicIcon, + command: "italic", + }, + { + title: tr.editingItalicTextCtrlandi, + } +); -const italicButton = { - component: CommandIconButton, - icon: italicIcon, - command: "italic", -}; +const underlineButton = withLazyProperties( + { + component: CommandIconButton, + icon: underlineIcon, + command: "underline", + }, + { + title: tr.editingUnderlineTextCtrlandu, + } +); -lazyProperties(italicButton, { - title: tr.editingItalicTextCtrlandi, -}); +const superscriptButton = withLazyProperties( + { + component: CommandIconButton, + icon: superscriptIcon, + command: "superscript", + }, + { + title: tr.editingSuperscriptCtrlandand, + } +); -const underlineButton = { - component: CommandIconButton, - icon: underlineIcon, - command: "underline", -}; +const subscriptButton = withLazyProperties( + { + component: CommandIconButton, + icon: subscriptIcon, + command: "subscript", + }, + { + title: tr.editingSubscriptCtrland, + } +); -lazyProperties(underlineButton, { - title: tr.editingUnderlineTextCtrlandu, -}); - -const superscriptButton = { - component: CommandIconButton, - icon: superscriptIcon, - command: "superscript", -}; - -lazyProperties(superscriptButton, { - title: tr.editingSuperscriptCtrlandand, -}); - -const subscriptButton = { - component: CommandIconButton, - icon: subscriptIcon, - command: "subscript", -}; - -lazyProperties(subscriptButton, { - title: tr.editingSubscriptCtrland, -}); - -const removeFormatButton = { - component: CommandIconButton, - icon: eraserIcon, - command: "removeFormat", - activatable: false, -}; - -lazyProperties(removeFormatButton, { - title: tr.editingRemoveFormattingCtrlandr, -}); +const removeFormatButton = withLazyProperties( + { + component: CommandIconButton, + icon: eraserIcon, + command: "removeFormat", + activatable: false, + }, + { + title: tr.editingRemoveFormattingCtrlandr, + } +); export const formatButtons = [ boldButton, diff --git a/ts/editor-toolbar/notetype.ts b/ts/editor-toolbar/notetype.ts index 76d1af001..f1e6e3600 100644 --- a/ts/editor-toolbar/notetype.ts +++ b/ts/editor-toolbar/notetype.ts @@ -1,28 +1,31 @@ -import { bridgeCommand } from "anki/bridgecommand"; -import { lazyProperties } from "anki/lazy"; -import * as tr from "anki/i18n"; import LabelButton from "./LabelButton.svelte"; -const fieldsButton = { - component: LabelButton, - onClick: () => bridgeCommand("fields"), - disables: false, -}; +import { bridgeCommand } from "anki/bridgecommand"; +import { withLazyProperties } from "anki/lazy"; +import * as tr from "anki/i18n"; -lazyProperties(fieldsButton, { - label: () => `${tr.editingFields()}...`, - title: tr.editingCustomizeFields, -}); +const fieldsButton = withLazyProperties( + { + component: LabelButton, + onClick: () => bridgeCommand("fields"), + disables: false, + }, + { + label: () => `${tr.editingFields()}...`, + title: tr.editingCustomizeFields, + } +); -const cardsButton = { - component: LabelButton, - onClick: () => bridgeCommand("cards"), - disables: false, -}; - -lazyProperties(cardsButton, { - label: () => `${tr.editingCards()}...`, - title: tr.editingCustomizeCardTemplatesCtrlandl, -}); +const cardsButton = withLazyProperties( + { + component: LabelButton, + onClick: () => bridgeCommand("cards"), + disables: false, + }, + { + label: () => `${tr.editingCards()}...`, + title: tr.editingCustomizeCardTemplatesCtrlandl, + } +); export const notetypeButtons = [fieldsButton, cardsButton]; diff --git a/ts/editor-toolbar/template.ts b/ts/editor-toolbar/template.ts index 6583bd7dc..c429db0b3 100644 --- a/ts/editor-toolbar/template.ts +++ b/ts/editor-toolbar/template.ts @@ -4,7 +4,7 @@ import DropdownItem from "./DropdownItem.svelte"; import WithDropdownMenu from "./WithDropdownMenu.svelte"; import { bridgeCommand } from "anki/bridgecommand"; -import { lazyProperties } from "anki/lazy"; +import { withLazyProperties } from "anki/lazy"; import * as tr from "anki/i18n"; import paperclipIcon from "./paperclip.svg"; @@ -29,31 +29,34 @@ function onHtmlEdit(): void { bridgeCommand("htmlEdit"); } -const attachmentButton = { - component: IconButton, - icon: paperclipIcon, - onClick: onAttachment, -}; +const attachmentButton = withLazyProperties( + { + component: IconButton, + icon: paperclipIcon, + onClick: onAttachment, + }, + { + title: tr.editingAttachPicturesaudiovideoF3, + } +); -lazyProperties(attachmentButton, { - title: tr.editingAttachPicturesaudiovideoF3, -}); +const recordButton = withLazyProperties( + { component: IconButton, icon: micIcon, onClick: onRecord }, + { + title: tr.editingRecordAudioF5, + } +); -const recordButton = { component: IconButton, icon: micIcon, onClick: onRecord }; - -lazyProperties(recordButton, { - title: tr.editingRecordAudioF5, -}); - -const clozeButton = { - component: IconButton, - icon: bracketsIcon, - onClick: onCloze, -}; - -lazyProperties(clozeButton, { - title: tr.editingClozeDeletionCtrlandshiftandc, -}); +const clozeButton = withLazyProperties( + { + component: IconButton, + icon: bracketsIcon, + onClick: onCloze, + }, + { + title: tr.editingClozeDeletionCtrlandshiftandc, + } +); const mathjaxButton = { component: IconButton, @@ -66,7 +69,21 @@ const mathjaxMenu = { component: DropdownMenu, id: mathjaxMenuId, menuItems: [ - { component: DropdownItem, label: "Foo", onClick: () => console.log("foo") }, + withLazyProperties( + { component: DropdownItem, onClick: () => bridgeCommand("mathjaxInline") }, + { label: tr.editingMathjaxInline } + ), + withLazyProperties( + { component: DropdownItem, onClick: () => bridgeCommand("mathjaxBlock") }, + { label: tr.editingMathjaxBlock } + ), + withLazyProperties( + { + component: DropdownItem, + onClick: () => bridgeCommand("mathjaxChemistry"), + }, + { label: tr.editingMathjaxChemistry } + ), ], }; @@ -76,15 +93,16 @@ const mathjaxButtonWithMenu = { menuId: mathjaxMenuId, }; -const htmlButton = { - component: IconButton, - icon: xmlIcon, - onClick: onHtmlEdit, -}; - -lazyProperties(htmlButton, { - title: tr.editingHtmlEditor, -}); +const htmlButton = withLazyProperties( + { + component: IconButton, + icon: xmlIcon, + onClick: onHtmlEdit, + }, + { + title: tr.editingHtmlEditor, + } +); export const templateButtons = [ attachmentButton, diff --git a/ts/lib/lazy.ts b/ts/lib/lazy.ts index 90d0439c5..d0c758e57 100644 --- a/ts/lib/lazy.ts +++ b/ts/lib/lazy.ts @@ -23,3 +23,29 @@ export function lazyProperties( Object.defineProperties(object, propertyDescriptorMap); } + +export function withLazyProperties( + object: Record, + properties: Record unknown> +): Record { + const propertyDescriptorMap = Object.entries(properties) + .map(([name, getter]: [string, () => unknown]): [ + string, + PropertyDescriptor + ] => [ + name, + { + get: getter, + enumerable: true, + }, + ]) + .reduce( + ( + accumulator: PropertyDescriptorMap, + [name, property] + ): PropertyDescriptorMap => ((accumulator[name] = property), accumulator), + {} + ); + + return Object.defineProperties(object, propertyDescriptorMap); +}