client: Refactor and add documentation

src/public/app/widgets/type_widgets/abstract_code_type_widget.js

@@ -2,13 +2,26 @@ import TypeWidget from "./type_widget.js";
 import libraryLoader from "../../services/library_loader.js";
 import options from "../../services/options.js";
 
+/**
+ * An abstract {@link TypeWidget} which implements the CodeMirror editor, meant to be used as a parent for
+ * widgets requiring the editor.
+ * 
+ * The widget handles the loading and initialization of the CodeMirror editor, as well as some common
+ * actions.
+ * 
+ * The derived class must:
+ * 
+ * - Define `$editor` in the constructor.
+ * - Call `super.doRender()` in the extended class.
+ * - Call `this._update(note, content)` in `#doRefresh(note)`.
+ */
 export default class AbstractCodeTypeWidget extends TypeWidget {
 
     doRender() {
-        this.initialized = this.initEditor();
+        this.initialized = this.#initEditor();
     }
 
-    async initEditor() {
+    async #initEditor() {
         await libraryLoader.requireLibrary(libraryLoader.CODE_MIRROR);
 
         // these conflict with backward/forward navigation shortcuts
@@ -35,14 +48,32 @@ export default class AbstractCodeTypeWidget extends TypeWidget {
         this.onEditorInitialized();
     }
 
+    /**
+     * Can be extended in derived classes to add extra options to the CodeMirror constructor. The options are appended
+     * at the end, so it is possible to override the default values introduced by the abstract editor as well. 
+     * 
+     * @returns the extra options to be passed to the CodeMirror constructor.
+     */
     getExtraOpts() {
         return {};
     }
 
+    /**
+     * Called as soon as the CodeMirror library has been loaded and the editor was constructed. Can be extended in
+     * derived classes to add additional functionality or to register event handlers.
+     * 
+     * By default, it does nothing.
+     */
     onEditorInitialized() {
-
+        // Do nothing by default.
     }
 
+    /**
+     * Must be called by the derived classes in `#doRefresh(note)` in order to react to changes.
+     * 
+     * @param {*} note the note that was changed.
+     * @param {*} content the new content of the note.
+     */
     _update(note, content) {
         // CodeMirror breaks pretty badly on null, so even though it shouldn't happen (guarded by a consistency check)
         // we provide fallback

src/public/app/widgets/type_widgets/editable_code.js

@@ -1,7 +1,7 @@
 import { t } from "../../services/i18n.js";
 import keyboardActionService from "../../services/keyboard_actions.js";
 import options from "../../services/options.js";
-import AbstractCodeTypeWidget from "./code_widget_base.js";
+import AbstractCodeTypeWidget from "./abstract_code_type_widget.js";
 
 const TPL = `
 <div class="note-detail-code note-detail-printable">

src/public/app/widgets/type_widgets/read_only_code.js

@@ -1,4 +1,4 @@
-import AbstractCodeTypeWidget from "./code_widget_base.js";
+import AbstractCodeTypeWidget from "./abstract_code_type_widget.js";
 
 const TPL = `
 <div class="note-detail-readonly-code note-detail-printable">