lint: src/static/js/ace.js

rhansen-ace2editor
Richard Hansen 2021-01-29 00:43:53 -05:00
parent e49341926f
commit 5b55f3f98a
1 changed files with 59 additions and 82 deletions

View File

@ -1,3 +1,4 @@
'use strict';
/** /**
* This code is mostly from the old Etherpad. Please help us to comment this code. * This code is mostly from the old Etherpad. Please help us to comment this code.
* This helps other people to understand this code better and helps them to improve it. * This helps other people to understand this code better and helps them to improve it.
@ -25,28 +26,17 @@
const KERNEL_SOURCE = '../static/js/require-kernel.js'; const KERNEL_SOURCE = '../static/js/require-kernel.js';
Ace2Editor.registry = {
nextId: 1,
};
const hooks = require('./pluginfw/hooks'); const hooks = require('./pluginfw/hooks');
const pluginUtils = require('./pluginfw/shared'); const pluginUtils = require('./pluginfw/shared');
const _ = require('./underscore');
function scriptTag(source) { const scriptTag =
return ( (source) => `<script type="text/javascript">\n${source.replace(/<\//g, '<\\/')}</script>`;
`<script type="text/javascript">\n${
source.replace(/<\//g, '<\\/')
}</script>`
);
}
function Ace2Editor() { const Ace2Editor = function () {
const ace2 = Ace2Editor; const ace2 = Ace2Editor;
const editor = {};
let info = { let info = {
editor, editor: this,
id: (ace2.registry.nextId++), id: (ace2.registry.nextId++),
}; };
let loaded = false; let loaded = false;
@ -59,18 +49,17 @@ function Ace2Editor() {
actionsPendingInit.push(action); actionsPendingInit.push(action);
}; };
function doActionsPendingInit() { const doActionsPendingInit = () => {
_.each(actionsPendingInit, (fn, i) => { for (const fn of actionsPendingInit) fn();
fn();
});
actionsPendingInit = []; actionsPendingInit = [];
} };
ace2.registry[info.id] = info; ace2.registry[info.id] = info;
// The following functions (prefixed by 'ace_') are exposed by editor, but // The following functions (prefixed by 'ace_') are exposed by editor, but
// execution is delayed until init is complete // execution is delayed until init is complete
const aceFunctionsPendingInit = ['importText', const aceFunctionsPendingInit = [
'importText',
'importAText', 'importAText',
'focus', 'focus',
'setEditable', 'setEditable',
@ -88,57 +77,41 @@ function Ace2Editor() {
'setAuthorSelectionRange', 'setAuthorSelectionRange',
'callWithAce', 'callWithAce',
'execCommand', 'execCommand',
'replaceRange']; 'replaceRange',
];
for (const fnName of aceFunctionsPendingInit) { for (const fnName of aceFunctionsPendingInit) {
// Note: info[`ace_${fnName}`] does not exist yet, so it can't be passed directly to // Note: info[`ace_${fnName}`] does not exist yet, so it can't be passed directly to
// pendingInit(). A simple wrapper is used to defer the info[`ace_${fnName}`] lookup until // pendingInit(). A simple wrapper is used to defer the info[`ace_${fnName}`] lookup until
// method invocation. // method invocation.
editor[fnName] = pendingInit(function (...args) { this[fnName] = pendingInit(function (...args) {
info[`ace_${fnName}`].apply(this, args); info[`ace_${fnName}`].apply(this, args);
}); });
} }
editor.exportText = function () { this.exportText = () => loaded ? info.ace_exportText() : '(awaiting init)\n';
if (!loaded) return '(awaiting init)\n';
return info.ace_exportText();
};
editor.getFrame = function () { this.getFrame = () => info.frame || null;
return info.frame || null;
};
editor.getDebugProperty = function (prop) { this.getDebugProperty = (prop) => info.ace_getDebugProperty(prop);
return info.ace_getDebugProperty(prop);
};
editor.getInInternationalComposition = function () { this.getInInternationalComposition =
if (!loaded) return false; () => loaded ? info.ace_getInInternationalComposition() : false;
return info.ace_getInInternationalComposition();
};
// prepareUserChangeset: // prepareUserChangeset:
// Returns null if no new changes or ACE not ready. Otherwise, bundles up all user changes // Returns null if no new changes or ACE not ready. Otherwise, bundles up all user changes
// to the latest base text into a Changeset, which is returned (as a string if encodeAsString). // to the latest base text into a Changeset, which is returned (as a string if encodeAsString).
// If this method returns a truthy value, then applyPreparedChangesetToBase can be called // If this method returns a truthy value, then applyPreparedChangesetToBase can be called at some
// at some later point to consider these changes part of the base, after which prepareUserChangeset // later point to consider these changes part of the base, after which prepareUserChangeset must
// must be called again before applyPreparedChangesetToBase. Multiple consecutive calls // be called again before applyPreparedChangesetToBase. Multiple consecutive calls to
// to prepareUserChangeset will return an updated changeset that takes into account the // prepareUserChangeset will return an updated changeset that takes into account the latest user
// latest user changes, and modify the changeset to be applied by applyPreparedChangesetToBase // changes, and modify the changeset to be applied by applyPreparedChangesetToBase accordingly.
// accordingly. this.prepareUserChangeset = () => loaded ? info.ace_prepareUserChangeset() : null;
editor.prepareUserChangeset = function () {
if (!loaded) return null;
return info.ace_prepareUserChangeset();
};
editor.getUnhandledErrors = function () { // returns array of {error: <browser Error object>, time: +new Date()}
if (!loaded) return []; this.getUnhandledErrors = () => loaded ? info.ace_getUnhandledErrors() : [];
// returns array of {error: <browser Error object>, time: +new Date()}
return info.ace_getUnhandledErrors();
};
const sortFilesByEmbeded = (files) => {
function sortFilesByEmbeded(files) {
const embededFiles = []; const embededFiles = [];
let remoteFiles = []; let remoteFiles = [];
@ -156,43 +129,42 @@ function Ace2Editor() {
} }
return {embeded: embededFiles, remote: remoteFiles}; return {embeded: embededFiles, remote: remoteFiles};
} };
function pushStyleTagsFor(buffer, files) {
const pushStyleTagsFor = (buffer, files) => {
const sorted = sortFilesByEmbeded(files); const sorted = sortFilesByEmbeded(files);
const embededFiles = sorted.embeded; const embededFiles = sorted.embeded;
const remoteFiles = sorted.remote; const remoteFiles = sorted.remote;
if (embededFiles.length > 0) { if (embededFiles.length > 0) {
buffer.push('<style type="text/css">'); buffer.push('<style type="text/css">');
for (var i = 0, ii = embededFiles.length; i < ii; i++) { for (const file of embededFiles) {
var file = embededFiles[i];
buffer.push((Ace2Editor.EMBEDED[file] || '').replace(/<\//g, '<\\/')); buffer.push((Ace2Editor.EMBEDED[file] || '').replace(/<\//g, '<\\/'));
} }
buffer.push('<\/style>'); buffer.push('</style>');
} }
for (var i = 0, ii = remoteFiles.length; i < ii; i++) { for (const file of remoteFiles) {
var file = remoteFiles[i]; buffer.push(`<link rel="stylesheet" type="text/css" href="${encodeURI(file)}"/>`);
buffer.push(`<link rel="stylesheet" type="text/css" href="${encodeURI(file)}"\/>`);
} }
} };
editor.destroy = pendingInit(() => { this.destroy = pendingInit(() => {
info.ace_dispose(); info.ace_dispose();
info.frame.parentNode.removeChild(info.frame); info.frame.parentNode.removeChild(info.frame);
delete ace2.registry[info.id]; delete ace2.registry[info.id];
info = null; // prevent IE 6 closure memory leaks info = null; // prevent IE 6 closure memory leaks
}); });
editor.init = function (containerId, initialCode, doneFunc) { this.init = function (containerId, initialCode, doneFunc) {
editor.importText(initialCode); this.importText(initialCode);
info.onEditorReady = function () { info.onEditorReady = () => {
loaded = true; loaded = true;
doActionsPendingInit(); doActionsPendingInit();
doneFunc(); doneFunc();
}; };
(function () { (() => {
const doctype = '<!doctype html>'; const doctype = '<!doctype html>';
const iframeHTML = []; const iframeHTML = [];
@ -204,8 +176,8 @@ function Ace2Editor() {
// and compressed, putting the compressed code from the named file directly into the // and compressed, putting the compressed code from the named file directly into the
// source here. // source here.
// these lines must conform to a specific format because they are passed by the build script: // these lines must conform to a specific format because they are passed by the build script:
var includedCSS = []; let includedCSS = [];
var $$INCLUDE_CSS = function (filename) { includedCSS.push(filename); }; let $$INCLUDE_CSS = (filename) => { includedCSS.push(filename); };
$$INCLUDE_CSS('../static/css/iframe_editor.css'); $$INCLUDE_CSS('../static/css/iframe_editor.css');
// disableCustomScriptsAndStyles can be used to disable loading of custom scripts // disableCustomScriptsAndStyles can be used to disable loading of custom scripts
@ -213,14 +185,15 @@ function Ace2Editor() {
$$INCLUDE_CSS(`../static/css/pad.css?v=${clientVars.randomVersionString}`); $$INCLUDE_CSS(`../static/css/pad.css?v=${clientVars.randomVersionString}`);
} }
var additionalCSS = _(hooks.callAll('aceEditorCSS')).map((path) => { let additionalCSS = hooks.callAll('aceEditorCSS').map((path) => {
if (path.match(/\/\//)) { // Allow urls to external CSS - http(s):// and //some/path.css if (path.match(/\/\//)) { // Allow urls to external CSS - http(s):// and //some/path.css
return path; return path;
} }
return `../static/plugins/${path}`; return `../static/plugins/${path}`;
}); });
includedCSS = includedCSS.concat(additionalCSS); includedCSS = includedCSS.concat(additionalCSS);
$$INCLUDE_CSS(`../static/skins/${clientVars.skinName}/pad.css?v=${clientVars.randomVersionString}`); $$INCLUDE_CSS(
`../static/skins/${clientVars.skinName}/pad.css?v=${clientVars.randomVersionString}`);
pushStyleTagsFor(iframeHTML, includedCSS); pushStyleTagsFor(iframeHTML, includedCSS);
@ -253,7 +226,8 @@ plugins.ensure(function () {\n\
iframeHTML, iframeHTML,
}); });
iframeHTML.push('</head><body id="innerdocbody" class="innerdocbody" role="application" class="syntax" spellcheck="false">&nbsp;</body></html>'); iframeHTML.push('</head><body id="innerdocbody" class="innerdocbody" role="application" ' +
'class="syntax" spellcheck="false">&nbsp;</body></html>');
// eslint-disable-next-line node/no-unsupported-features/es-builtins // eslint-disable-next-line node/no-unsupported-features/es-builtins
const gt = typeof globalThis === 'object' ? globalThis : window; const gt = typeof globalThis === 'object' ? globalThis : window;
@ -287,23 +261,24 @@ window.onload = function () {\n\
}, 0);\n\ }, 0);\n\
}`; }`;
const outerHTML = [doctype, `<html class="inner-editor outerdoc ${clientVars.skinVariants}"><head>`]; const outerHTML =
[doctype, `<html class="inner-editor outerdoc ${clientVars.skinVariants}"><head>`];
var includedCSS = []; includedCSS = [];
var $$INCLUDE_CSS = function (filename) { includedCSS.push(filename); }; $$INCLUDE_CSS = (filename) => { includedCSS.push(filename); };
$$INCLUDE_CSS('../static/css/iframe_editor.css'); $$INCLUDE_CSS('../static/css/iframe_editor.css');
$$INCLUDE_CSS(`../static/css/pad.css?v=${clientVars.randomVersionString}`); $$INCLUDE_CSS(`../static/css/pad.css?v=${clientVars.randomVersionString}`);
var additionalCSS = _(hooks.callAll('aceEditorCSS')).map((path) => { additionalCSS = hooks.callAll('aceEditorCSS').map((path) => {
if (path.match(/\/\//)) { // Allow urls to external CSS - http(s):// and //some/path.css if (path.match(/\/\//)) { // Allow urls to external CSS - http(s):// and //some/path.css
return path; return path;
} }
return `../static/plugins/${path}`; return `../static/plugins/${path}`;
} });
);
includedCSS = includedCSS.concat(additionalCSS); includedCSS = includedCSS.concat(additionalCSS);
$$INCLUDE_CSS(`../static/skins/${clientVars.skinName}/pad.css?v=${clientVars.randomVersionString}`); $$INCLUDE_CSS(
`../static/skins/${clientVars.skinName}/pad.css?v=${clientVars.randomVersionString}`);
pushStyleTagsFor(outerHTML, includedCSS); pushStyleTagsFor(outerHTML, includedCSS);
@ -334,8 +309,10 @@ window.onload = function () {\n\
editorDocument.close(); editorDocument.close();
})(); })();
}; };
};
return editor; Ace2Editor.registry = {
} nextId: 1,
};
exports.Ace2Editor = Ace2Editor; exports.Ace2Editor = Ace2Editor;