// /app/static/js/gallery-series-editor.js
// Series editor wired into the bulk-editor panel on series-filtered gallery views.
// No-ops when the page has no series context.

document.addEventListener('DOMContentLoaded', () => {
  const seriesInfo = window.galleryState && window.galleryState.seriesInfo;
  if (!seriesInfo) return;

  const startPageInput = document.getElementById('startPageInput');
  const bulkAddToSeriesBtn = document.getElementById('bulkAddToSeriesBtn');
  const feedbackEl = document.getElementById('seriesEditorFeedback');
  if (!startPageInput || !bulkAddToSeriesBtn || !feedbackEl) return;

  const seriesTagId = seriesInfo.tag_id;

  function updateAddButtonState() {
    const selectedCount = window.selectedImages ? window.selectedImages.size : 0;
    bulkAddToSeriesBtn.disabled = selectedCount === 0;
    bulkAddToSeriesBtn.textContent = selectedCount > 0
      ? `Add ${selectedCount} to Series`
      : 'Add to Series';
  }

  document.addEventListener('selectionChanged', updateAddButtonState);

  bulkAddToSeriesBtn.addEventListener('click', async () => {
    if (!window.selectedImages || window.selectedImages.size === 0) return;

    const imageIds = window.selectionOrder ? [...window.selectionOrder] : Array.from(window.selectedImages);
    const startPage = parseInt(startPageInput.value) || 1;

    bulkAddToSeriesBtn.disabled = true;
    bulkAddToSeriesBtn.textContent = 'Adding...';
    feedbackEl.innerHTML = '';

    try {
      const r = await fetch(`/api/series/${seriesTagId}/pages/bulk-add`, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ image_ids: imageIds, start_page: startPage })
      });
      const data = await r.json();

      if (data.ok) {
        let msg = `Added ${data.added.length} image(s) to series.`;
        if (data.skipped.length > 0) {
          msg += ` Skipped ${data.skipped.length}.`;
        }
        feedbackEl.innerHTML = `<div class="feedback-success">${msg}</div>`;

        if (data.added.length > 0) {
          const lastPage = data.added[data.added.length - 1].page_number;
          startPageInput.value = lastPage + 1;
        }

        if (window.clearSelection) {
          window.clearSelection();
        }

        const pageCountEl = document.getElementById('seriesPageCount');
        if (pageCountEl) {
          const currentCount = parseInt(pageCountEl.textContent) || 0;
          pageCountEl.textContent = `${currentCount + data.added.length} pages`;
        }

        // "Read Series" button only renders when page_count > 0. If this was the first
        // batch of pages added, reload so the button appears.
        const readBtn = document.querySelector('.series-header-actions .primary-btn');
        if (!readBtn && data.added.length > 0) {
          location.reload();
        }
      } else {
        feedbackEl.innerHTML = `<div class="feedback-error">${data.error}</div>`;
      }
    } catch (e) {
      feedbackEl.innerHTML = `<div class="feedback-error">Error: ${e.message}</div>`;
    } finally {
      updateAddButtonState();
    }
  });

  updateAddButtonState();
});