Revised the JavaScript to initialize the JournalEntryEditor in TransactionForm, so that the transaction form holds the JournalEntryEditor instance. The DebitCreditSideSubForm and JournalEntrySubForm instances can find the JournalEntryEditor instance from the parent form, without needing to invoke its static methods. Removed the redundant static methods from the JournalEntryEditor class.

src/accounting/static/js/journal-entry-editor.js

@@ -22,11 +22,6 @@
  */
 "use strict";
 
-// Initializes the page JavaScript.
-document.addEventListener("DOMContentLoaded", () => {
-    JournalEntryEditor.initialize();
-});
-
 /**
  * The journal entry editor.
  *
@@ -461,11 +456,11 @@ class JournalEntryEditor {
     }
 
     /**
-     * Adds a new journal entry.
+     * The callback when adding a new journal entry.
      *
      * @param side {DebitCreditSideSubForm} the debit or credit side sub-form
      */
-    #onAddNew(side) {
+    onAddNew(side) {
         this.entry = null;
         this.#side = side;
         this.entryType = this.#side.entryType;
@@ -498,7 +493,7 @@ class JournalEntryEditor {
     }
 
     /**
-     * Edits a journal entry.
+     * The callback when editing a journal entry.
      *
      * @param entry {JournalEntrySubForm} the journal entry sub-form
      * @param originalEntryId {string} the ID of the original entry
@@ -510,7 +505,7 @@ class JournalEntryEditor {
      * @param amount {string} the amount
      * @param amountMin {string} the minimal amount
      */
-    #onEdit(entry, originalEntryId, originalEntryDate, originalEntryText, summary, accountCode, accountText, amount, amountMin) {
+    onEdit(entry, originalEntryId, originalEntryDate, originalEntryText, summary, accountCode, accountText, amount, amountMin) {
         this.entry = entry;
         this.#side = entry.side;
         this.entryType = this.#side.entryType;
@@ -588,44 +583,4 @@ class JournalEntryEditor {
             this.#accountControl.classList.remove("accounting-clickable");
         }
     }
-
-    /**
-     * The journal entry editor
-     * @type {JournalEntryEditor}
-     */
-    static #editor;
-
-    /**
-     * Initializes the journal entry editor.
-     *
-     */
-    static initialize() {
-        this.#editor = new JournalEntryEditor();
-    }
-
-    /**
-     * Adds a new journal entry.
-     *
-     * @param side {DebitCreditSideSubForm} the debit or credit side sub-form
-     */
-    static addNew(side) {
-        this.#editor.#onAddNew(side);
-    }
-
-    /**
-     * Edits a journal entry.
-     *
-     * @param entry {JournalEntrySubForm} the journal entry sub-form
-     * @param originalEntryId {string} the ID of the original entry
-     * @param originalEntryDate {string} the date of the original entry
-     * @param originalEntryText {string} the text of the original entry
-     * @param summary {string} the summary
-     * @param accountCode {string} the account code
-     * @param accountText {string} the account text
-     * @param amount {string} the amount
-     * @param amountMin {string} the minimal amount
-     */
-    static edit(entry, originalEntryId, originalEntryDate, originalEntryText, summary, accountCode, accountText, amount, amountMin) {
-        this.#editor.#onEdit(entry, originalEntryId, originalEntryDate, originalEntryText, summary, accountCode, accountText, amount, amountMin);
-    }
 }

src/accounting/static/js/transaction-form.js

@@ -98,6 +98,12 @@ class TransactionForm {
      */
     #noteError;
 
+    /**
+     * The journal entry editor
+     * @type {JournalEntryEditor}
+     */
+    entryEditor;
+
     /**
      * Constructs the transaction form.
      *
@@ -115,6 +121,7 @@ class TransactionForm {
         this.#addCurrencyButton = document.getElementById("accounting-add-currency");
         this.#note = document.getElementById("accounting-note");
         this.#noteError = document.getElementById("accounting-note-error");
+        this.entryEditor = new JournalEntryEditor();
 
         this.#addCurrencyButton.onclick = () => {
             const newIndex = 1 + (this.#currencies.length === 0? 0: Math.max(...this.#currencies.map((currency) => currency.index)));
@@ -601,7 +608,7 @@ class DebitCreditSideSubForm {
         this.entries = Array.from(document.getElementsByClassName(this.#prefix)).map((element) => new JournalEntrySubForm(this, element));
         this.#total = document.getElementById(this.#prefix + "-total");
         this.#addEntryButton = document.getElementById(this.#prefix + "-add-entry");
-        this.#addEntryButton.onclick = () => JournalEntryEditor.addNew(this);
+        this.#addEntryButton.onclick = () => this.currency.form.entryEditor.onAddNew(this);
         this.#resetDeleteJournalEntryButtons();
         this.#initializeDragAndDropReordering();
     }
@@ -874,7 +881,7 @@ class JournalEntrySubForm {
         this.#amount = document.getElementById(this.#prefix + "-amount");
         this.#amountText = document.getElementById(this.#prefix + "-amount-text");
         this.deleteButton = document.getElementById(this.#prefix + "-delete");
-        this.#control.onclick = () => JournalEntryEditor.edit(this, this.#originalEntryId.value, this.#originalEntryId.dataset.date, this.#originalEntryId.dataset.text, this.#summary.value, this.#accountCode.value, this.#accountCode.dataset.text, this.#amount.value, this.#amount.dataset.min);
+        this.#control.onclick = () => this.side.currency.form.entryEditor.onEdit(this, this.#originalEntryId.value, this.#originalEntryId.dataset.date, this.#originalEntryId.dataset.text, this.#summary.value, this.#accountCode.value, this.#accountCode.dataset.text, this.#amount.value, this.#amount.dataset.min);
         this.deleteButton.onclick = () => {
             this.element.parentElement.removeChild(this.element);
             this.side.deleteJournalEntry(this);