import { useEffect, useCallback } from "react";
import { notesApi } from "../api/notesApi";

interface UseMarkdownOptions {
  onNoteUpdate?: () => void;
}

export const useMarkdown = (options?: UseMarkdownOptions) => {
  const initializeHandlers = useCallback(() => {
    // Обработчики спойлеров
    const spoilers = document.querySelectorAll(".spoiler");
    spoilers.forEach((spoiler) => {
      if (!(spoiler as any)._clickHandler) {
        const handler = function (this: HTMLElement, event: Event) {
          if (this.classList.contains("revealed")) return;
          event.stopPropagation();
          this.classList.add("revealed");
        };
        (spoiler as any)._clickHandler = handler;
        spoiler.addEventListener("click", handler);
      }
    });

    // Обработчики внешних ссылок
    const externalLinks = document.querySelectorAll(".external-link");
    externalLinks.forEach((link) => {
      if (!(link as any)._externalClickHandler) {
        const handler = function (this: HTMLAnchorElement, event: Event) {
          if (
            window.matchMedia("(display-mode: standalone)").matches ||
            (window.navigator as any).standalone === true
          ) {
            event.preventDefault();
            window.open(this.href, "_blank", "noopener,noreferrer");
          }
        };
        (link as any)._externalClickHandler = handler;
        link.addEventListener("click", handler);
      }
    });

    // Обработчики чекбоксов
    const checkboxes = document.querySelectorAll(
      ".note-preview-content input[type='checkbox'], .textNote input[type='checkbox']"
    );
    checkboxes.forEach((checkbox) => {
      if (!(checkbox as any)._checkboxHandler) {
        const handler = async function (this: HTMLInputElement) {
          // В предпросмотре просто позволяем переключаться без сохранения
          if (this.closest(".note-preview-content")) {
            return;
          }

          // Для заметок - сохраняем состояние
          const noteElement = this.closest("[data-note-id]") as HTMLElement;
          if (!noteElement) return;

          const noteId = parseInt(
            noteElement.getAttribute("data-note-id") || "0"
          );
          if (!noteId) return;

          const textNoteElement = noteElement.querySelector(
            ".textNote"
          ) as HTMLElement;
          if (!textNoteElement) return;

          const originalContent = textNoteElement.getAttribute(
            "data-original-content"
          );
          if (!originalContent) return;

          try {
            // Находим все чекбоксы в этой заметке
            const allCheckboxes = Array.from(
              textNoteElement.querySelectorAll("input[type='checkbox']")
            );
            const checkboxIndex = allCheckboxes.indexOf(this);

            if (checkboxIndex === -1) return;

            // Обновляем markdown контент
            const lines = originalContent.split("\n");
            let currentCheckboxIndex = 0;
            let updatedContent = "";

            for (let i = 0; i < lines.length; i++) {
              const line = lines[i];
              const uncheckedMatch = line.match(/^(\s*)- \[ \] (.*)$/);
              const checkedMatch = line.match(/^(\s*)- \[x\] (.*)$/i);

              if (uncheckedMatch || checkedMatch) {
                if (currentCheckboxIndex === checkboxIndex) {
                  // Это наш чекбокс - переключаем состояние
                  if (uncheckedMatch) {
                    updatedContent += `${uncheckedMatch[1]}- [x] ${uncheckedMatch[2]}\n`;
                  } else if (checkedMatch) {
                    updatedContent += `${checkedMatch[1]}- [ ] ${checkedMatch[2]}\n`;
                  }
                } else {
                  updatedContent += line + "\n";
                }
                currentCheckboxIndex++;
              } else {
                updatedContent += line + "\n";
              }
            }

            // Убираем последний перенос строки, если его не было в оригинале
            if (!originalContent.endsWith("\n")) {
              updatedContent = updatedContent.slice(0, -1);
            }

            // Сохраняем в БД с флагом skipTimestamp (не считается редактированием)
            await notesApi.update(noteId, updatedContent, true);

            // Обновляем атрибут с оригинальным контентом
            textNoteElement.setAttribute(
              "data-original-content",
              updatedContent
            );

            // Вызываем колбэк для обновления списка заметок
            if (options?.onNoteUpdate) {
              options.onNoteUpdate();
            }
          } catch (error) {
            console.error("Ошибка сохранения чекбокса:", error);
            // Откатываем изменение визуально
            this.checked = !this.checked;
          }
        };
        (checkbox as any)._checkboxHandler = handler;
        checkbox.addEventListener("change", handler);
      }
    });
  }, [options]);

  useEffect(() => {
    // Используем MutationObserver для отслеживания изменений DOM
    const observer = new MutationObserver(() => {
      initializeHandlers();
    });

    // Наблюдаем за изменениями в body
    observer.observe(document.body, {
      childList: true,
      subtree: true,
    });

    // Инициализируем обработчики сразу
    initializeHandlers();

    return () => {
      observer.disconnect();
    };
  }, [initializeHandlers]);
};
