Use Ace for Run JavaScript code editor

Closes #1928
This commit is contained in:
Fletcher Hazlehurst 2020-12-15 12:22:22 -07:00
parent 36d81e839c
commit 0bb1588f22
3 changed files with 26 additions and 5 deletions

View file

@ -13,13 +13,17 @@
<main>
<div class="textbox-container">
<div class="textbox-header">
<label class="textbox-label" for="code">Code:</label>
<label class="textbox-label" for="editor-code">Code:</label>
<label id="run-as-async-label" for="run-as-async">
<input id="run-as-async" type="checkbox" onclick="update()">
Run as async function
</label>
</div>
<textarea id="code" oninput="handleInput()"></textarea>
<iframe
src="chrome://zotero/content/ace.html"
id="editor-code"
class="editor-code"
></iframe>
</div>
<div class="textbox-container">

View file

@ -10,7 +10,7 @@ async function run() {
if (!win) {
return;
}
var code = document.getElementById('code').value;
var code = codeEditor.getSession().getValue();
var isAsync = document.getElementById('run-as-async').checked;
var result;
var resultTextbox = document.getElementById('result');
@ -42,7 +42,7 @@ function handleInput() { // eslint-disable-line no-unused-vars
if (isAsync) {
return;
}
var code = document.getElementById('code').value;
var code = codeEditor.getSession().getValue();
// If `await` is used, switch to async mode
if (/[^=([]\s*await\s/m.test(code)) {
checkbox.checked = true;
@ -77,3 +77,16 @@ var shortcut = Zotero.isMac ? 'Cmd-R' : 'Ctrl+R';
document.getElementById('run-label').textContent = `(${shortcut})`;
update();
var codeWin, codeEditor;
window.addEventListener("load", function (e) {
if (e.target !== document) {
return;
}
codeWin = document.getElementById("editor-code").contentWindow;
codeEditor = codeWin.editor;
codeEditor.getSession().setMode(new codeWin.JavaScriptMode);
codeEditor.getSession().setUseSoftTabs(false);
codeEditor.on('input', handleInput);
}, false);

View file

@ -70,4 +70,8 @@ textarea {
textarea.error {
color: red;
}
}
.editor-code {
flex: 1;
}