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 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';
Ace2Editor.registry = {
nextId: 1,
};
const hooks = require('./pluginfw/hooks');
const pluginUtils = require('./pluginfw/shared');
const _ = require('./underscore');
function scriptTag(source) {
return (
`<script type="text/javascript">\n${
source.replace(/<\//g, '<\\/')
}</script>`
);
}
const scriptTag =
(source) => `<script type="text/javascript">\n${source.replace(/<\//g, '<\\/')}</script>`;
function Ace2Editor() {
const Ace2Editor = function () {
const ace2 = Ace2Editor;
const editor = {};
let info = {
editor,
editor: this,
id: (ace2.registry.nextId++),
};
let loaded = false;
@ -59,18 +49,17 @@ function Ace2Editor() {
actionsPendingInit.push(action);
};
function doActionsPendingInit() {
_.each(actionsPendingInit, (fn, i) => {
fn();
});
const doActionsPendingInit = () => {
for (const fn of actionsPendingInit) fn();
actionsPendingInit = [];
}
};
ace2.registry[info.id] = info;
// The following functions (prefixed by 'ace_') are exposed by editor, but
// execution is delayed until init is complete
const aceFunctionsPendingInit = ['importText',
const aceFunctionsPendingInit = [
'importText',
'importAText',
'focus',
'setEditable',
@ -88,57 +77,41 @@ function Ace2Editor() {
'setAuthorSelectionRange',
'callWithAce',
'execCommand',
'replaceRange'];
'replaceRange',
];
for (const fnName of aceFunctionsPendingInit) {
// 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
// method invocation.
editor[fnName] = pendingInit(function (...args) {
this[fnName] = pendingInit(function (...args) {
info[`ace_${fnName}`].apply(this, args);
});
}
editor.exportText = function () {
if (!loaded) return '(awaiting init)\n';
return info.ace_exportText();
};
this.exportText = () => loaded ? info.ace_exportText() : '(awaiting init)\n';
editor.getFrame = function () {
return info.frame || null;
};
this.getFrame = () => info.frame || null;
editor.getDebugProperty = function (prop) {
return info.ace_getDebugProperty(prop);
};
this.getDebugProperty = (prop) => info.ace_getDebugProperty(prop);
editor.getInInternationalComposition = function () {
if (!loaded) return false;
return info.ace_getInInternationalComposition();
};
this.getInInternationalComposition =
() => loaded ? info.ace_getInInternationalComposition() : false;
// prepareUserChangeset:
// 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).
// If this method returns a truthy value, then applyPreparedChangesetToBase can be called
// at some later point to consider these changes part of the base, after which prepareUserChangeset
// must be called again before applyPreparedChangesetToBase. Multiple consecutive calls
// to prepareUserChangeset will return an updated changeset that takes into account the
// latest user changes, and modify the changeset to be applied by applyPreparedChangesetToBase
// accordingly.
editor.prepareUserChangeset = function () {
if (!loaded) return null;
return info.ace_prepareUserChangeset();
};
// If this method returns a truthy value, then applyPreparedChangesetToBase can be called at some
// later point to consider these changes part of the base, after which prepareUserChangeset must
// be called again before applyPreparedChangesetToBase. Multiple consecutive calls to
// prepareUserChangeset will return an updated changeset that takes into account the latest user
// changes, and modify the changeset to be applied by applyPreparedChangesetToBase accordingly.
this.prepareUserChangeset = () => loaded ? info.ace_prepareUserChangeset() : null;
editor.getUnhandledErrors = function () {
if (!loaded) return [];
// returns array of {error: <browser Error object>, time: +new Date()}
return info.ace_getUnhandledErrors();
};
// returns array of {error: <browser Error object>, time: +new Date()}
this.getUnhandledErrors = () => loaded ? info.ace_getUnhandledErrors() : [];
function sortFilesByEmbeded(files) {
const sortFilesByEmbeded = (files) => {
const embededFiles = [];
let remoteFiles = [];
@ -156,43 +129,42 @@ function Ace2Editor() {
}
return {embeded: embededFiles, remote: remoteFiles};
}
function pushStyleTagsFor(buffer, files) {
};
const pushStyleTagsFor = (buffer, files) => {
const sorted = sortFilesByEmbeded(files);
const embededFiles = sorted.embeded;
const remoteFiles = sorted.remote;
if (embededFiles.length > 0) {
buffer.push('<style type="text/css">');
for (var i = 0, ii = embededFiles.length; i < ii; i++) {
var file = embededFiles[i];
for (const file of embededFiles) {
buffer.push((Ace2Editor.EMBEDED[file] || '').replace(/<\//g, '<\\/'));
}
buffer.push('<\/style>');
buffer.push('</style>');
}
for (var i = 0, ii = remoteFiles.length; i < ii; i++) {
var file = remoteFiles[i];
buffer.push(`<link rel="stylesheet" type="text/css" href="${encodeURI(file)}"\/>`);
for (const file of remoteFiles) {
buffer.push(`<link rel="stylesheet" type="text/css" href="${encodeURI(file)}"/>`);
}
}
};
editor.destroy = pendingInit(() => {
this.destroy = pendingInit(() => {
info.ace_dispose();
info.frame.parentNode.removeChild(info.frame);
delete ace2.registry[info.id];
info = null; // prevent IE 6 closure memory leaks
});
editor.init = function (containerId, initialCode, doneFunc) {
editor.importText(initialCode);
this.init = function (containerId, initialCode, doneFunc) {
this.importText(initialCode);
info.onEditorReady = function () {
info.onEditorReady = () => {
loaded = true;
doActionsPendingInit();
doneFunc();
};
(function () {
(() => {
const doctype = '<!doctype html>';
const iframeHTML = [];
@ -204,8 +176,8 @@ function Ace2Editor() {
// and compressed, putting the compressed code from the named file directly into the
// source here.
// these lines must conform to a specific format because they are passed by the build script:
var includedCSS = [];
var $$INCLUDE_CSS = function (filename) { includedCSS.push(filename); };
let includedCSS = [];
let $$INCLUDE_CSS = (filename) => { includedCSS.push(filename); };
$$INCLUDE_CSS('../static/css/iframe_editor.css');
// 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}`);
}
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
return path;
}
return `../static/plugins/${path}`;
});
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);
@ -253,7 +226,8 @@ plugins.ensure(function () {\n\
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
const gt = typeof globalThis === 'object' ? globalThis : window;
@ -287,23 +261,24 @@ window.onload = function () {\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 = [];
var $$INCLUDE_CSS = function (filename) { includedCSS.push(filename); };
includedCSS = [];
$$INCLUDE_CSS = (filename) => { includedCSS.push(filename); };
$$INCLUDE_CSS('../static/css/iframe_editor.css');
$$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
return path;
}
return `../static/plugins/${path}`;
}
);
});
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);
@ -334,8 +309,10 @@ window.onload = function () {\n\
editorDocument.close();
})();
};
};
return editor;
}
Ace2Editor.registry = {
nextId: 1,
};
exports.Ace2Editor = Ace2Editor;