/**
 * 帅库之家Cookie管理 - 设置页面脚本
 */

// DOM元素
let form;
let messageEl;

/**
 * 初始化
 */
document.addEventListener('DOMContentLoaded', async () => {
  form = document.getElementById('config-form');
  messageEl = document.getElementById('message');

  // 绑定事件
  form.addEventListener('submit', handleSubmit);
  document.getElementById('btn-toggle-key').addEventListener('click', toggleKeyVisibility);
  document.getElementById('btn-test').addEventListener('click', testConnection);

  // 加载配置
  await loadConfig();
});

/**
 * 加载配置
 */
async function loadConfig() {
  try {
    const response = await sendMessage({ action: 'getConfig' });
    const config = response.data;

    document.getElementById('serverUrl').value = config.serverUrl || '';
    document.getElementById('apiKey').value = config.apiKey || '';
    document.getElementById('pollInterval').value = config.pollInterval || '5';
  } catch (error) {
    showMessage('加载配置失败: ' + error.message, 'error');
  }
}

/**
 * 处理表单提交
 */
async function handleSubmit(event) {
  event.preventDefault();

  const config = {
    serverUrl: document.getElementById('serverUrl').value.trim().replace(/\/$/, ''),
    apiKey: document.getElementById('apiKey').value.trim(),
    pollInterval: parseInt(document.getElementById('pollInterval').value)
  };

  try {
    await sendMessage({ action: 'saveConfig', config });
    showMessage('设置已保存', 'success');
  } catch (error) {
    showMessage('保存失败: ' + error.message, 'error');
  }
}

/**
 * 切换API Key可见性
 */
function toggleKeyVisibility() {
  const input = document.getElementById('apiKey');
  const btn = document.getElementById('btn-toggle-key');

  if (input.type === 'password') {
    input.type = 'text';
    btn.textContent = '隐藏';
  } else {
    input.type = 'password';
    btn.textContent = '显示';
  }
}

/**
 * 测试连接
 */
async function testConnection() {
  const btn = document.getElementById('btn-test');
  const originalText = btn.textContent;

  const serverUrl = document.getElementById('serverUrl').value.trim().replace(/\/$/, '');
  const apiKey = document.getElementById('apiKey').value.trim();

  if (!serverUrl || !apiKey) {
    showMessage('请先填写服务器地址和API Key', 'error');
    return;
  }

  try {
    btn.disabled = true;
    btn.textContent = '测试中...';

    const response = await fetch(`${serverUrl}/api/crawler/cookie/status`, {
      method: 'GET',
      headers: {
        'X-API-Key': apiKey,
        'Content-Type': 'application/json'
      }
    });

    if (!response.ok) {
      if (response.status === 401 || response.status === 403) {
        throw new Error('API Key无效');
      }
      throw new Error(`服务器返回 ${response.status}`);
    }

    const data = await response.json();
    if (data.code === 200) {
      showMessage('连接成功！服务器正常', 'success');
    } else {
      throw new Error(data.msg || '未知错误');
    }
  } catch (error) {
    showMessage('连接失败: ' + error.message, 'error');
  } finally {
    btn.textContent = originalText;
    btn.disabled = false;
  }
}

/**
 * 显示消息
 */
function showMessage(text, type) {
  messageEl.textContent = text;
  messageEl.className = `message ${type}`;
  messageEl.style.display = 'block';

  setTimeout(() => {
    messageEl.style.display = 'none';
  }, 5000);
}

/**
 * 发送消息到后台
 */
function sendMessage(message) {
  return new Promise((resolve, reject) => {
    chrome.runtime.sendMessage(message, (response) => {
      if (chrome.runtime.lastError) {
        reject(new Error(chrome.runtime.lastError.message));
      } else {
        resolve(response);
      }
    });
  });
}