MediaWiki:MarcEditorDynamicLinks.js

/* jshint esversion: 8 */
function main() {
  // calling main functions
  makeMarcFieldHelpLink();
  authorityLinks();
  rmCarriageReturn();
  rmHtmlTags();

  // when clicking adding field...
  // const addBtn = document.body.querySelector('.multipleTemplateAdder');
  // addBtn.addEventListener('click', () => {
  //   makeMarcFieldHelpLink();
  //   console.log('adding btm');
  // });

  // Como instâncias do formulário são criadas pelo botão "Adicionar campo",
  // é necessário observar o DOM a partir da classe ".multipleTemplateList".
  // Toda vez que o DOM é alterado (mais especificamente, quando uma nova
  // child de ".multipleTemplateList" é criada), as funções
  // makeMarcFieldHelpLink() e authorityLinks() são novamente chamadas.
  // https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

  // create an observer instance
  const observer = new MutationObserver((mutations) => {
    mutations.forEach((mutation) => {
      const newNodes = mutation.addedNodes; // DOM NodeList
      if (newNodes.length !== 0) {
        // if there are new nodes added
        console.log('observer before:', newNodes.length);
        makeMarcFieldHelpLink();
        authorityLinks();
        console.log('observer after');
      }
    });
  });

  // select the target node
  const target = document.querySelector('.multipleTemplateList');

  // configuration of the observer
  const config = {
    childList: true,
    attributes: false,
    subtree: false,
  };

  // pass in the target node, as well as the observer options
  observer.observe(target, config);

  // when clicking save...
  const saveBtn = document.body.querySelector('#wpSave');
  saveBtn.addEventListener('click', () => {
    observer.disconnect();
    rmTxtFromHiddenFields();
    rmCarriageReturn();
    rmHtmlTags();
    normalizeInput();
  });
}

// if (document.readyState === 'complete' || document.readyState !== 'loading') {
//   main();
//   console.log(document.readyState);
// } else {
//   document.addEventListener('DOMContentLoaded', main);
//   console.log('DOMContentLoaded');
// }

document.addEventListener("DOMContentLoaded", function(event) {
  main();
});

// for no obvious reason to me, the first call to the "main" function is not
// occurring, so wait 3 seconds and call it anyway.
// setTimeout(main, 3000);