/**
 * Content Script - Chạy trên mọi web page
 * Nhiệm vụ:
 * 1. Auto-sync Clerk auth token khi đang ở trang OpenNotion
 * 2. Detect text selection → Space key → Auto save → Toast notification
 */

let selectedText = '';
let selectedUrl = '';
let selectedTitle = '';

// ========== AUTO CLERK TOKEN SYNC ==========

/**
 * Detect nếu đang ở trang OpenNotion frontend → auto lấy Clerk token
 * Clerk SDK loads async, nên cần poll chờ nó sẵn sàng
 */
async function tryExtractClerkToken(): Promise<string | null> {
  const maxRetries = 5;
  const retryDelay = 800; // ms

  for (let attempt = 0; attempt < maxRetries; attempt++) {
    try {
      const clerk = (window as any).Clerk;
      // Skip if Clerk loaded but user not signed in
      if (clerk && !clerk.user) return null;
      if (clerk?.session?.getToken) {
        const token = await clerk.session.getToken();
        if (token) return token;
      }
    } catch {
      // Clerk chưa ready, thử lại
    }

    if (attempt < maxRetries - 1) {
      await new Promise((resolve) => setTimeout(resolve, retryDelay));
    }
  }
  return null;
}

/**
 * Auto-sync: nếu đang ở trang OpenNotion, lấy Clerk token rồi gửi về background
 */
async function autoSyncClerkToken() {
  // Chỉ chạy trên domain OpenNotion (kiểm tra cả localhost dev và production)
  const hostname = window.location.hostname;
  const isOpenNotionDomain =
    hostname === '172.16.2.210' ||
    hostname === 'localhost' ||
    hostname.includes('opennotion') ||
    hostname.includes('cucunote') ||
    hostname.includes('cucu-note');

  if (!isOpenNotionDomain) return;

  const token = await tryExtractClerkToken();
  if (token) {
    // Gửi token về background service worker để lưu vào chrome.storage.local
    chrome.runtime.sendMessage({
      type: 'SYNC_AUTH',
      data: { clerkSessionToken: token },
    });
  }
}

// Chạy auto-sync khi content script load
autoSyncClerkToken();

// Cũng lắng nghe request từ popup để sync on-demand
chrome.runtime.onMessage.addListener((message, _sender, sendResponse) => {
  if (message.type === 'GET_CLERK_TOKEN') {
    tryExtractClerkToken().then((token) => {
      sendResponse({ token });
    });
    return true; // keep channel open for async
  }
});

// Listen khi user bôi đen text
document.addEventListener('mouseup', handleTextSelection);
document.addEventListener('keydown', async (e) => {
  // Nếu nhấn Space hoặc Enter sau khi đã bôi đen text → tự động lưu ngay
  if ((e.key === ' ' || e.key === 'Enter') && selectedText.length > 0) {
    // Chỉ prevent default nếu không phải trong input/textarea
    const target = e.target as HTMLElement;
    if (!target || (target.tagName !== 'INPUT' && target.tagName !== 'TEXTAREA' && !target.isContentEditable)) {
      e.preventDefault();
      e.stopPropagation();
      await handleAutoSave();
      return;
    }
  }
});
document.addEventListener('keyup', handleTextSelection);

function handleTextSelection() {
  try {
    // Delay một chút để đảm bảo selection đã hoàn tất
    setTimeout(() => {
      const selection = window.getSelection();

      if (!selection || selection.rangeCount === 0) {
        selectedText = '';
        removeQuickHint();
        return;
      }

      const text = selection.toString().trim();

      if (text.length === 0) {
        selectedText = '';
        removeQuickHint();
        return;
      }

      // Lưu text đã chọn + metadata
      selectedText = text;
      selectedUrl = window.location.href;
      selectedTitle = document.title;

      // Hiện hint nhỏ để user biết có thể nhấn Space/Enter
      showQuickHint();
    }, 50);
  } catch {
    // Silently ignore selection errors
  }
}

async function handleAutoSave() {
  if (!selectedText) return;

  try {
    // Show loading toast
    showToast('Đang lưu...', 'loading');

    // Gửi message đến background để save
    chrome.runtime.sendMessage({
      type: 'SAVE_NOTE',
      data: {
        text: selectedText,
        url: selectedUrl,
        title: selectedTitle,
      },
    }, (response) => {
      if (chrome.runtime.lastError) {
        showToast(`❌ Lỗi: ${chrome.runtime.lastError.message || 'Extension error'}`, 'error');
        return;
      }

      if (response?.success) {
        showToast('✅ Đã lưu vào CuCu Note!', 'success');
        // Clear selection
        window.getSelection()?.removeAllRanges();
        selectedText = '';
        removeQuickHint();
      } else {
        const reason = response?.error || 'Không thể lưu note';
        showToast(`❌ ${reason}`, 'error');
      }
    });
  } catch (err: any) {
    showToast(`❌ ${err?.message || 'Lỗi khi lưu note'}`, 'error');
  }
}

function showQuickHint() {
  // Hiện hint nhỏ "Nhấn Space để lưu" với gradient đẹp
  removeQuickHint();

  const hint = document.createElement('div');
  hint.id = 'cucu-quick-hint';
  hint.textContent = '💡 Nhấn Space hoặc Enter để lưu nhanh';

  // Gradient màu đẹp
  hint.style.cssText = `
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: linear-gradient(135deg, #a0845c 0%, #8b6914 100%);
    color: white;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    z-index: 999999;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    animation: cucuSlideUp 0.3s ease-out;
    pointer-events: none;
  `;

  // Inject animation CSS
  if (!document.getElementById('cucu-hint-style')) {
    const style = document.createElement('style');
    style.id = 'cucu-hint-style';
    style.textContent = `
      @keyframes cucuSlideUp {
        from {
          opacity: 0;
          transform: translateY(20px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
    `;
    document.head.appendChild(style);
  }

  try {
    document.body.appendChild(hint);
  } catch (e) {
    document.documentElement.appendChild(hint);
  }

  // Auto ẩn sau 3 giây
  setTimeout(() => {
    removeQuickHint();
  }, 3000);
}

function removeQuickHint() {
  const hint = document.getElementById('cucu-quick-hint');
  if (hint) {
    try {
      hint.remove();
    } catch (e) {
      // Ignore
    }
  }
}

function showToast(message: string, type: 'success' | 'error' | 'loading' = 'success') {
  // Remove toast cũ nếu có
  const oldToast = document.getElementById('cucu-toast');
  if (oldToast) {
    try {
      oldToast.remove();
    } catch (e) {
      // Ignore
    }
  }

  const toast = document.createElement('div');
  toast.id = 'cucu-toast';
  toast.textContent = message;

  // Màu sắc đẹp theo type (gradient)
  const colors = {
    success: 'linear-gradient(135deg, #10b981 0%, #059669 100%)',
    error: 'linear-gradient(135deg, #ef4444 0%, #dc2626 100%)',
    loading: 'linear-gradient(135deg, #a0845c 0%, #8b6914 100%)',
  };

  toast.style.cssText = `
    position: fixed;
    top: 20px;
    right: 20px;
    background: ${colors[type]};
    color: white;
    padding: 16px 24px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 500;
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
    z-index: 999999;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    animation: cucuToastSlide 0.4s ease-out;
    max-width: 350px;
    word-wrap: break-word;
  `;

  // Inject animation CSS
  if (!document.getElementById('cucu-toast-style')) {
    const style = document.createElement('style');
    style.id = 'cucu-toast-style';
    style.textContent = `
      @keyframes cucuToastSlide {
        from {
          opacity: 0;
          transform: translateX(100%);
        }
        to {
          opacity: 1;
          transform: translateX(0);
        }
      }
    `;
    try {
      document.head.appendChild(style);
    } catch (e) {
      // Ignore
    }
  }

  try {
    document.body.appendChild(toast);
  } catch (e) {
    try {
      document.documentElement.appendChild(toast);
    } catch (e2) {
      return;
    }
  }

  // Auto ẩn sau 3 giây (trừ loading)
  if (type !== 'loading') {
    setTimeout(() => {
      if (toast.parentNode) {
        toast.style.animation = 'cucuToastSlide 0.3s ease-out reverse';
        setTimeout(() => {
          try {
            toast.remove();
          } catch (e) {
            // Ignore
          }
        }, 300);
      }
    }, 3000);
  }
}
