update: monaco template editor
This commit is contained in:
parent
1413fa01b2
commit
c9a3ed0e06
|
|
@ -122,10 +122,12 @@
|
|||
<input id="editor-name" type="text" style="width: 100%" />
|
||||
</div>
|
||||
<div style="display: flex; flex-direction: column; height: 100%">
|
||||
<textarea
|
||||
id="editor-textbox"
|
||||
style="height: 100%; resize: none"
|
||||
></textarea>
|
||||
<iframe
|
||||
id="editor"
|
||||
src="chrome://scaffold/content/monaco/monaco.html"
|
||||
style="width: 100%; height: 100%; border: none"
|
||||
onmousedown="this.focus()"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="viewport preview-viewport">
|
||||
|
|
@ -153,7 +155,10 @@
|
|||
wantdropmarker="true"
|
||||
>
|
||||
<menupopup>
|
||||
<menuitem id="importClipboard" data-l10n-id="importClipboard"></menuitem>
|
||||
<menuitem
|
||||
id="importClipboard"
|
||||
data-l10n-id="importClipboard"
|
||||
></menuitem>
|
||||
<menuitem id="importNote" data-l10n-id="importNote"></menuitem>
|
||||
<menuseparator />
|
||||
<menuitem id="share" data-l10n-id="share"></menuitem>
|
||||
|
|
|
|||
34
package.json
34
package.json
|
|
@ -50,7 +50,7 @@
|
|||
"hast-util-to-text": "^3.1.2",
|
||||
"hastscript": "^7.2.0",
|
||||
"html-docx-js-typescript": "^0.1.5",
|
||||
"katex": "^0.16.7",
|
||||
"katex": "^0.16.8",
|
||||
"rehype-format": "^4.0.1",
|
||||
"rehype-parse": "^8.0.4",
|
||||
"rehype-remark": "^9.1.2",
|
||||
|
|
@ -66,32 +66,32 @@
|
|||
"unist-util-visit": "^5.0.0",
|
||||
"unist-util-visit-parents": "^6.0.1",
|
||||
"yamljs": "^0.3.0",
|
||||
"zotero-plugin-toolkit": "^2.1.7"
|
||||
"zotero-plugin-toolkit": "^2.2.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@prettier/plugin-xml": "^3.1.1",
|
||||
"@prettier/plugin-xml": "^3.2.0",
|
||||
"@types/browser-or-node": "^1.3.0",
|
||||
"@types/diff": "^5.0.3",
|
||||
"@types/node": "^20.4.2",
|
||||
"@types/node": "^20.4.9",
|
||||
"@types/seedrandom": "^3.0.5",
|
||||
"@types/yamljs": "^0.2.31",
|
||||
"@typescript-eslint/eslint-plugin": "^6.0.0",
|
||||
"@typescript-eslint/parser": "^6.0.0",
|
||||
"@typescript-eslint/eslint-plugin": "^6.3.0",
|
||||
"@typescript-eslint/parser": "^6.3.0",
|
||||
"chokidar-cli": "^3.0.0",
|
||||
"compressing": "^1.9.0",
|
||||
"compressing": "^1.9.1",
|
||||
"concurrently": "^8.2.0",
|
||||
"cross-env": "^7.0.3",
|
||||
"esbuild": "^0.18.1",
|
||||
"eslint": "^8.44.0",
|
||||
"eslint-config-prettier": "^8.8.0",
|
||||
"prettier": "^3.0.0",
|
||||
"prosemirror-model": "^1.19.2",
|
||||
"esbuild": "^0.18.20",
|
||||
"eslint": "^8.46.0",
|
||||
"eslint-config-prettier": "^8.10.0",
|
||||
"prettier": "^3.0.1",
|
||||
"prosemirror-model": "^1.19.3",
|
||||
"prosemirror-state": "^1.4.3",
|
||||
"prosemirror-transform": "^1.7.3",
|
||||
"prosemirror-view": "^1.31.4",
|
||||
"release-it": "^16.1.3",
|
||||
"prosemirror-transform": "^1.7.4",
|
||||
"prosemirror-view": "^1.31.7",
|
||||
"release-it": "^16.1.4",
|
||||
"replace-in-file": "^7.0.1",
|
||||
"typescript": "^5.1.3",
|
||||
"zotero-types": "^1.0.15"
|
||||
"typescript": "^5.1.6",
|
||||
"zotero-types": "^1.2.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -89,6 +89,7 @@ class Addon {
|
|||
templateEditor: {
|
||||
window?: Window;
|
||||
tableHelper?: VirtualizedTableHelper;
|
||||
editor?: any;
|
||||
templates: { name: string }[];
|
||||
};
|
||||
templatePicker: {
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { config } from "../../../package.json";
|
|||
import { showHint } from "../../utils/hint";
|
||||
import { itemPicker } from "../../utils/itemPicker";
|
||||
import { getString } from "../../utils/locale";
|
||||
import { waitUtilAsync } from "../../utils/wait";
|
||||
|
||||
export async function showTemplateEditor() {
|
||||
if (
|
||||
|
|
@ -13,7 +14,6 @@ export async function showTemplateEditor() {
|
|||
const windowArgs = {
|
||||
_initPromise: Zotero.Promise.defer(),
|
||||
};
|
||||
// @ts-ignore
|
||||
const _window = window.openDialog(
|
||||
`chrome://${config.addonRef}/content/templateEditor.xhtml`,
|
||||
`${config.addonRef}-templateEditor`,
|
||||
|
|
@ -128,8 +128,16 @@ export async function showTemplateEditor() {
|
|||
?.addEventListener("click", (ev) => {
|
||||
restoreTemplates(_window);
|
||||
});
|
||||
addon.data.templateEditor.window?.focus();
|
||||
const editorWin = (_window.document.querySelector("#editor") as any)
|
||||
.contentWindow;
|
||||
await waitUtilAsync(() => editorWin?.loadMonaco);
|
||||
const { monaco, editor } = await editorWin.loadMonaco({
|
||||
language: "javascript",
|
||||
theme: "vs-light",
|
||||
});
|
||||
addon.data.templateEditor.editor = editor;
|
||||
}
|
||||
addon.data.templateEditor.window?.focus();
|
||||
}
|
||||
|
||||
async function refresh() {
|
||||
|
|
@ -154,9 +162,9 @@ function updateEditor() {
|
|||
const header = addon.data.templateEditor.window?.document.getElementById(
|
||||
"editor-name",
|
||||
) as HTMLInputElement;
|
||||
const text = addon.data.templateEditor.window?.document.getElementById(
|
||||
"editor-textbox",
|
||||
) as HTMLTextAreaElement;
|
||||
const editor = addon.data.templateEditor.window?.document.getElementById(
|
||||
"editor",
|
||||
) as HTMLIFrameElement;
|
||||
const saveTemplate =
|
||||
addon.data.templateEditor.window?.document.getElementById(
|
||||
"save",
|
||||
|
|
@ -172,8 +180,7 @@ function updateEditor() {
|
|||
if (!name) {
|
||||
header.value = "";
|
||||
header.setAttribute("disabled", "true");
|
||||
text.value = "";
|
||||
text.setAttribute("disabled", "true");
|
||||
editor.hidden = true;
|
||||
saveTemplate.setAttribute("disabled", "true");
|
||||
deleteTemplate.setAttribute("disabled", "true");
|
||||
deleteTemplate.hidden = false;
|
||||
|
|
@ -190,8 +197,8 @@ function updateEditor() {
|
|||
deleteTemplate.hidden = true;
|
||||
resetTemplate.hidden = false;
|
||||
}
|
||||
text.value = templateText;
|
||||
text.removeAttribute("disabled");
|
||||
addon.data.templateEditor.editor.setValue(templateText);
|
||||
editor.hidden = false;
|
||||
saveTemplate.removeAttribute("disabled");
|
||||
deleteTemplate.removeAttribute("disabled");
|
||||
}
|
||||
|
|
@ -258,9 +265,6 @@ function saveSelectedTemplate() {
|
|||
const header = addon.data.templateEditor.window?.document.getElementById(
|
||||
"editor-name",
|
||||
) as HTMLInputElement;
|
||||
const text = addon.data.templateEditor.window?.document.getElementById(
|
||||
"editor-textbox",
|
||||
) as HTMLTextAreaElement;
|
||||
|
||||
if (
|
||||
addon.api.template.SYSTEM_TEMPLATE_NAMES.includes(name) &&
|
||||
|
|
@ -274,7 +278,7 @@ function saveSelectedTemplate() {
|
|||
|
||||
const template = {
|
||||
name: header.value,
|
||||
text: text.value,
|
||||
text: addon.data.templateEditor.editor.getValue(),
|
||||
};
|
||||
addon.api.template.setTemplate(template);
|
||||
if (name !== template.name) {
|
||||
|
|
@ -303,12 +307,10 @@ function deleteSelectedTemplate() {
|
|||
function resetSelectedTemplate() {
|
||||
const name = getSelectedTemplateName();
|
||||
if (addon.api.template.SYSTEM_TEMPLATE_NAMES.includes(name)) {
|
||||
const text = addon.data.templateEditor.window?.document.getElementById(
|
||||
"editor-textbox",
|
||||
) as HTMLTextAreaElement;
|
||||
text.value =
|
||||
addon.data.templateEditor.editor.setValue(
|
||||
addon.api.template.DEFAULT_TEMPLATES.find((t) => t.name === name)?.text ||
|
||||
"";
|
||||
"",
|
||||
);
|
||||
showHint(`Template ${name} is reset. Please save before leaving.`);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue