GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-18 22:12:21 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Use CodeMirror for Mathjax Editor

Browse source
This commit is contained in:
Henrik Giesel 2021-08-06 18:21:23 +02:00
parent 882a2710a9
commit 1185593fee
2 changed files with 25 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
ts/components/DropdownMenu.svelte
View file

@ -26,5 +26,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
.dropdown-menu { .dropdown-menu {
background-color: var(--frame-bg); background-color: var(--frame-bg);
border-color: var(--medium-border); border-color: var(--medium-border);
min-width: 1rem;
} }
</style> </style>

40
ts/editor/MathjaxHandleEditor.svelte
View file

@ -23,36 +23,43 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
const codeMirrorOptions = { const codeMirrorOptions = {
mode: latex, mode: latex,
theme: "monokai", theme: "monokai",
/* lineNumbers: true, */ lineWrapping: true,
/* lineWrapping: true, */ matchTags: { bothTags: true },
/* foldGutter: true, */ extraKeys: { Tab: false, "Shift-Tab": false },
/* gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"], */ viewportMargin: Infinity,
/* matchTags: { bothTags: true }, */ lineWiseCopyCut: false,
/* extraKeys: { Tab: false, "Shift-Tab": false }, */ autofocus: true,
/* viewportMargin: Infinity, */
/* lineWiseCopyCut: false, */
/* autofocus: true, */
}; };
let codeMirror: CodeMirror; let codeMirror: CodeMirror;
function onInput() {
dispatch("update", { mathjax: codeMirror.getValue() });
}
function openCodemirror(textarea: HTMLTextAreaElement): void { function openCodemirror(textarea: HTMLTextAreaElement): void {
codeMirror = CodeMirror.fromTextArea(textarea, codeMirrorOptions); codeMirror = CodeMirror.fromTextArea(textarea, codeMirrorOptions);
codeMirror.setCursor(codeMirror.lineCount(), 0); codeMirror.on("change", onInput);
} }
const dispatch = createEventDispatcher(); const dispatch = createEventDispatcher();
let textarea: HTMLTextAreaElement; let textarea: HTMLTextAreaElement;
onMount(() => textarea.focus()); onMount(() => {
codeMirror.focus();
function onInput() { codeMirror.setCursor(codeMirror.lineCount(), 0);
dispatch("update", { mathjax: textarea.value }); });
}
</script> </script>
<!-- <textarea bind:value use:openCodemirror /> --> <!-- <textarea bind:value use:openCodemirror /> -->
<div on:click|stopPropagation on:focus|stopPropagation on:keydown|stopPropagation> <div
on:click|stopPropagation
on:focus|stopPropagation
on:keydown|stopPropagation
on:focusin|stopPropagation
on:keyup|stopPropagation
on:mouseup|stopPropagation
>
<!-- TODO no focusin for now, as EditingArea will defer to Editable/Codable --> <!-- TODO no focusin for now, as EditingArea will defer to Editable/Codable -->
<textarea <textarea
bind:this={textarea} bind:this={textarea}
@ -62,5 +69,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
on:click|stopPropagation on:click|stopPropagation
on:focusin|stopPropagation on:focusin|stopPropagation
on:input={onInput} on:input={onInput}
use:openCodemirror
/> />
</div> </div>