// /kngil/js/qa/qa_write.js

document.addEventListener('DOMContentLoaded', () => {

  /* ==========================
   * 1. CKEditor 초기화
   * ========================== */
  let editorInstance = null;

  const contentEl = document.querySelector('#content');
  if (contentEl) {
    ClassicEditor
      .create(contentEl, {
        toolbar: [
          'heading','|',
          'bold','italic','link',
          'bulletedList','numberedList','|',
          'fontColor','fontBackgroundColor','fontSize',
          '|','blockQuote','insertTable','imageUpload',
          'undo','redo'
        ],
        language: 'ko',
        ckfinder: {
          uploadUrl: '/kngil/bbs/qa_img_upload.php'
        }
      })
      .then(editor => {
        editorInstance = editor;
      })
      .catch(err => console.error(err));
  }

  /* ==========================
   * 2. 폼 submit 검증
   * ========================== */
  const form = document.getElementById('qaForm');
  if (form) {
    form.addEventListener('submit', (e) => {
      if (!editorInstance) return;

      const data = editorInstance.getData().trim();
      if (!data) {
        e.preventDefault();
        alert('내용을 입력해주세요.');
        editorInstance.editing.view.focus();
        return;
      }

      contentEl.value = data; // textarea에 반영
    });
  }

  /* ==========================
   * 3. 첨부파일 Drag & Drop
   * ========================== */
  const dropZone  = document.getElementById('drop-zone');
  const fileInput = document.getElementById('attach');
  const fileList  = document.getElementById('file-list');

  if (dropZone && fileInput && fileList) {

    let uploadFiles = [];

    dropZone.addEventListener('click', () => fileInput.click());

    dropZone.addEventListener('dragover', (e) => {
      e.preventDefault();
      dropZone.classList.add('dragover');
    });

    dropZone.addEventListener('dragleave', () => {
      dropZone.classList.remove('dragover');
    });

    dropZone.addEventListener('drop', (e) => {
      e.preventDefault();
      dropZone.classList.remove('dragover');
      addFiles(e.dataTransfer.files);
    });

    fileInput.addEventListener('change', () => {
      addFiles(fileInput.files);
    });

    function addFiles(files) {
      for (const file of files) {
        uploadFiles.push(file);
      }
      render();
      syncInput();
    }

    function render() {
      fileList.innerHTML = '';
      uploadFiles.forEach(file => {
        const li = document.createElement('li');
        li.textContent = `${file.name} (${(file.size / 1024).toFixed(1)} KB)`;
        fileList.appendChild(li);
      });
    }

    function syncInput() {
      const dt = new DataTransfer();
      uploadFiles.forEach(f => dt.items.add(f));
      fileInput.files = dt.files;
    }
  }

});