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

Correctly import CodeMirror

Browse source
This commit is contained in:
Henrik Giesel 2021-08-08 00:13:16 +02:00
parent a3fef552bd
commit e71aed7146
3 changed files with 27 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ts/editor/BUILD.bazel
View file

@ -191,5 +191,7 @@ svelte_check(
"//ts/sass/bootstrap",
"@npm//@types/bootstrap",
"//ts/components",
"@npm//@types/codemirror",
"@npm//codemirror",
],
)

10
ts/editor/MathjaxHandleEditor.svelte
View file

@ -6,7 +6,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import { onMount, createEventDispatcher } from "svelte";
import { ChangeTimer } from "./change-timer";
import * as CodeMirror from "codemirror/lib/codemirror";
import CodeMirror from "codemirror";
import "codemirror/mode/stex/stex";
import "codemirror/addon/fold/foldcode";
import "codemirror/addon/fold/foldgutter";
@ -21,18 +21,22 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
inMathMode: true,
};
const noop = () => {
/* noop */
};
const codeMirrorOptions = {
mode: latex,
theme: "monokai",
lineWrapping: true,
matchTags: { bothTags: true },
extraKeys: { Tab: false, "Shift-Tab": false },
extraKeys: { Tab: noop, "Shift-Tab": noop },
viewportMargin: Infinity,
lineWiseCopyCut: false,
autofocus: true,
};
let codeMirror: CodeMirror;
let codeMirror: CodeMirror.EditorFromTextArea;
const changeTimer = new ChangeTimer();
function onInput() {

28
ts/editor/codable.ts
View file

@ -1,7 +1,11 @@
// Copyright: Ankitects Pty Ltd and contributors
// License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import * as CodeMirror from "codemirror/lib/codemirror";
/* eslint
@typescript-eslint/no-non-null-assertion: "off",
*/
import CodeMirror from "codemirror";
import "codemirror/mode/htmlmixed/htmlmixed";
import "codemirror/mode/stex/stex";
import "codemirror/addon/fold/foldcode";
@ -24,6 +28,10 @@ const htmlanki = {
},
};
const noop = () => {
/* noop */
};
const codeMirrorOptions = {
mode: htmlanki,
theme: "monokai",
@ -33,7 +41,7 @@ const codeMirrorOptions = {
gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
matchTags: { bothTags: true },
autoCloseTags: true,
extraKeys: { Tab: false, "Shift-Tab": false },
extraKeys: { Tab: noop, "Shift-Tab": noop },
viewportMargin: Infinity,
lineWiseCopyCut: false,
};
@ -47,7 +55,7 @@ function parseHTML(html: string): string {
}
export class Codable extends HTMLTextAreaElement {
codeMirror: CodeMirror | undefined;
codeMirror: CodeMirror.EditorFromTextArea | undefined;
get active(): boolean {
return Boolean(this.codeMirror);
@ -55,14 +63,14 @@ export class Codable extends HTMLTextAreaElement {
set fieldHTML(content: string) {
if (this.active) {
this.codeMirror.setValue(content);
this.codeMirror?.setValue(content);
} else {
this.value = content;
}
}
get fieldHTML(): string {
return parseHTML(this.active ? this.codeMirror.getValue() : this.value);
return parseHTML(this.active ? this.codeMirror!.getValue() : this.value);
}
connectedCallback(): void {
@ -76,23 +84,23 @@ export class Codable extends HTMLTextAreaElement {
}
teardown(): string {
this.codeMirror.toTextArea();
this.codeMirror!.toTextArea();
this.codeMirror = undefined;
return this.fieldHTML;
}
focus(): void {
this.codeMirror.focus();
this.codeMirror!.focus();
inCodable.set(true);
}
caretToEnd(): void {
this.codeMirror.setCursor(this.codeMirror.lineCount(), 0);
this.codeMirror!.setCursor(this.codeMirror!.lineCount(), 0);
}
surroundSelection(before: string, after: string): void {
const selection = this.codeMirror.getSelection();
this.codeMirror.replaceSelection(before + selection + after);
const selection = this.codeMirror!.getSelection();
this.codeMirror!.replaceSelection(before + selection + after);
}
onEnter(): void {