(function () {
  const mounts = document.querySelectorAll('[data-mm-editor="tiptap"]');

  if (!mounts.length) {
    return;
  }

  const runFallback = (mount) => {
    if (!mount || mount.querySelector('.ProseMirror') || mount.getAttribute('data-mm-fallback-ready') === '1') {
      return;
    }

    const textareaId = mount.getAttribute('data-textarea-id');

    if (!textareaId) {
      return;
    }

    const textarea = document.getElementById(textareaId);

    if (!textarea) {
      return;
    }

    const toolbar = document.querySelector('[data-mm-editor-toolbar="' + textareaId + '"]');
    const form = textarea.closest('form');

    mount.setAttribute('contenteditable', 'true');
    mount.setAttribute('data-mm-fallback-ready', '1');
    mount.classList.add('mm-fallback-editor');
    mount.innerHTML = textarea.value || '<p></p>';
    textarea.style.display = 'none';

    const syncState = () => {
      textarea.value = mount.innerHTML;
    };

    const focusMount = () => {
      mount.focus();
    };

    mount.addEventListener('input', syncState);
    mount.addEventListener('blur', syncState);

    if (toolbar) {
      toolbar.addEventListener('click', (event) => {
        const target = event.target.closest('button[data-action]');

        if (!target || target.disabled) {
          return;
        }

        event.preventDefault();

        const action = target.getAttribute('data-action');

        focusMount();

        switch (action) {
          case 'paragraph':
            document.execCommand('formatBlock', false, 'p');
            break;
          case 'h2':
            document.execCommand('formatBlock', false, 'h2');
            break;
          case 'h3':
            document.execCommand('formatBlock', false, 'h3');
            break;
          case 'bold':
            document.execCommand('bold', false);
            break;
          case 'italic':
            document.execCommand('italic', false);
            break;
          case 'underline':
            document.execCommand('underline', false);
            break;
          case 'bulletList':
            document.execCommand('insertUnorderedList', false);
            break;
          case 'orderedList':
            document.execCommand('insertOrderedList', false);
            break;
          case 'indent':
            document.execCommand('indent', false);
            break;
          case 'outdent':
            document.execCommand('outdent', false);
            break;
          case 'undo':
            document.execCommand('undo', false);
            break;
          case 'redo':
            document.execCommand('redo', false);
            break;
          default:
            break;
        }

        syncState();
      });
    }

    if (form) {
      form.addEventListener('submit', syncState);
    }
  };

  window.setTimeout(() => {
    mounts.forEach(runFallback);
  }, 900);
})();