init()

in mail/components/addrbook/content/aboutAddressBook.js [2461:2681]
196 lines of code
22 McCabe index (conditional complexity)

  init() {
    const booksSplitter = document.getElementById("booksSplitter");
    const booksSplitterWidth = XULStoreUtils.getValue(
      "addressBook",
      "booksSplitter",
      "width"
    );
    if (booksSplitterWidth) {
      booksSplitter.width = booksSplitterWidth;
    }
    booksSplitter.addEventListener("splitter-resized", () =>
      XULStoreUtils.setValue(
        "addressBook",
        "booksSplitter",
        "width",
        booksSplitter.width
      )
    );

    const isTableLayout = document.body.classList.contains("layout-table");
    updateSharedSplitter(isTableLayout);

    this.splitter = document.getElementById("sharedSplitter");
    const sharedSplitterWidth = XULStoreUtils.getValue(
      "addressBook",
      "sharedSplitter",
      "width"
    );
    if (sharedSplitterWidth) {
      this.splitter.width = sharedSplitterWidth;
    }
    const sharedSplitterHeight = XULStoreUtils.getValue(
      "addressBook",
      "sharedSplitter",
      "height"
    );
    if (sharedSplitterHeight) {
      this.splitter.height = sharedSplitterHeight;
    }
    this.splitter.addEventListener("splitter-resized", () => {
      if (isTableLayout) {
        XULStoreUtils.setValue(
          "addressBook",
          "sharedSplitter",
          "height",
          this.splitter.height
        );
        return;
      }
      XULStoreUtils.setValue(
        "addressBook",
        "sharedSplitter",
        "width",
        this.splitter.width
      );
    });

    this.node = document.getElementById("detailsPane");
    this.actions = document.getElementById("detailsActions");
    this.writeButton = document.getElementById("detailsWriteButton");
    this.eventButton = document.getElementById("detailsEventButton");
    this.searchButton = document.getElementById("detailsSearchButton");
    this.newListButton = document.getElementById("detailsNewListButton");
    this.editButton = document.getElementById("editButton");
    this.selectedCardsSection = document.getElementById("selectedCards");
    this.form = document.getElementById("editContactForm");
    this.vCardEdit = this.form.querySelector("vcard-edit");
    this.deleteButton = document.getElementById("detailsDeleteButton");
    this.addContactBookList = document.getElementById("addContactBookList");
    this.cancelEditButton = document.getElementById("cancelEditButton");
    this.saveEditButton = document.getElementById("saveEditButton");

    this.actions.addEventListener("click", this);
    document.getElementById("detailsFooter").addEventListener("click", this);

    const photoImage = document.getElementById("viewContactPhoto");
    photoImage.addEventListener("error", () => {
      if (!detailsPane.currentCard) {
        return;
      }

      const vCard = detailsPane.currentCard.getProperty("_vCard", "");
      const match = /^PHOTO.*/im.exec(vCard);
      if (match) {
        console.warn(
          `Broken contact photo, vCard data starts with: ${match[0]}`
        );
      } else {
        console.warn(`Broken contact photo, source is: ${photoImage.src}`);
      }
    });

    this.form.addEventListener("input", event => {
      const { type, checked, value, _originalValue } = event.target;
      let changed;
      if (type == "checkbox") {
        changed = checked != _originalValue;
      } else {
        changed = value != _originalValue;
      }
      if (changed) {
        this.dirtyFields.add(event.target);
      } else {
        this.dirtyFields.delete(event.target);
      }

      // If there are no dirty fields, clear the flag, otherwise set it.
      this.isDirty = this.dirtyFields.size > 0;
    });
    this.form.addEventListener("keypress", event => {
      // Prevent scrolling of the html tag when space is used on a button or
      // checkbox.
      dump("xxxmagnus keypress event.key=" + event.key+ "\n");
     // dump("xxxmagnus open? " + this._dialog.open+ "\n");
      if (
        event.key == " " &&
        ["button", "checkbox"].includes(document.activeElement.type)
      ) {
        event.preventDefault();
      }

      if (event.key != "Escape") {
        return;
      }

      event.preventDefault();
      this.form.reset();
    }, { capture: true });
    this.form.addEventListener("reset", async event => {
      event.preventDefault();
      if (this.isDirty) {
        const [title, message] = await document.l10n.formatValues([
          { id: `about-addressbook-unsaved-changes-prompt-title` },
          { id: `about-addressbook-unsaved-changes-prompt` },
        ]);

        const buttonPressed = Services.prompt.confirmEx(
          window,
          title,
          message,
          Ci.nsIPrompt.BUTTON_TITLE_SAVE * Ci.nsIPrompt.BUTTON_POS_0 +
            Ci.nsIPrompt.BUTTON_TITLE_CANCEL * Ci.nsIPrompt.BUTTON_POS_1 +
            Ci.nsIPrompt.BUTTON_TITLE_DONT_SAVE * Ci.nsIPrompt.BUTTON_POS_2,
          null,
          null,
          null,
          null,
          {}
        );
        if (buttonPressed === 0) {
          // Don't call this.form.submit, the submit event won't fire.
          this.validateBeforeSaving();
          return;
        } else if (buttonPressed === 1) {
          return;
        }
      }
      this.isEditing = false;
      if (this.currentCard) {
        // Refresh the card from the book to get exactly what was saved.
        const book = MailServices.ab.getDirectoryFromUID(
          this.currentCard.directoryUID
        );
        const card = book.childCards.find(c => c.UID == this.currentCard.UID);
        this.displayContact(card);
        if (this._focusOnCardsList) {
          cardsPane.cardsList.table.body.focus();
        } else {
          this.editButton.focus();
        }
      } else {
        this.displayCards(cardsPane.selectedCards);
        if (this._focusOnCardsList) {
          cardsPane.cardsList.table.body.focus();
        } else {
          cardsPane.searchInput.focus();
        }
      }
    });
    this.form.addEventListener("submit", event => {
      event.preventDefault();
      this.validateBeforeSaving();
    });

    this.photoInput = document.getElementById("photoInput");
    // NOTE: We put the paste handler on the button parent because the
    // html:button will not be targeted by the paste event.
    this.photoInput.addEventListener("paste", photoDialog);
    this.photoInput.addEventListener("dragover", photoDialog);
    this.photoInput.addEventListener("drop", photoDialog);

    const photoButton = document.getElementById("photoButton");
    photoButton.addEventListener("click", () => {
      if (this._photoDetails.sourceURL) {
        photoDialog.showWithURL(
          this._photoDetails.sourceURL,
          this._photoDetails.cropRect,
          true
        );
      } else {
        photoDialog.showEmpty();
      }
    });

    this.cancelEditButton.addEventListener("keypress", event => {
      // Prevent scrolling of the html tag when space is used on this button.
      if (event.key == " ") {
        event.preventDefault();
      }
    });
    this.saveEditButton.addEventListener("keypress", event => {
      // Prevent scrolling of the html tag when space is used on this button.
      if (event.key == " ") {
        event.preventDefault();
      }
    });

    for (const topic of this._notifications) {
      Services.obs.addObserver(this, topic);
    }
  },