// 服务器状态组件 - 显示CPU使用率和查询统计

// 全局变量
let serverStatusUpdateTimer = null;
let previousServerData = {
  cpu: 0,
  queries: 0
};

// 初始化服务器状态组件
function initServerStatusWidget() {
  // 确保DOM元素存在
  const widget = document.getElementById('server-status-widget');
  if (!widget) return;
  
  // 初始化页面类型检测
  updateWidgetDisplayByPageType();
  
  // 设置页面切换事件监听
  handlePageSwitchEvents();
  
  // 设置WebSocket监听（如果可用）
  setupWebSocketListeners();
  
  // 立即加载一次数据
  loadServerStatusData();
  
  // 设置定时更新（每5秒更新一次）
  serverStatusUpdateTimer = setInterval(loadServerStatusData, 5000);
}

// 判断当前页面是否为仪表盘
function isCurrentPageDashboard() {
  // 方法1：检查侧边栏激活状态
  const dashboardLink = document.querySelector('.sidebar a[href="#dashboard"]');
  if (dashboardLink && dashboardLink.classList.contains('active')) {
    return true;
  }
  
  // 方法2：检查仪表盘特有元素
  const dashboardElements = [
    '#dashboard-container',
    '.dashboard-summary',
    '#dashboard-stats'
  ];
  
  for (const selector of dashboardElements) {
    if (document.querySelector(selector)) {
      return true;
    }
  }
  
  // 方法3：检查URL哈希值
  if (window.location.hash === '#dashboard' || window.location.hash === '') {
    return true;
  }
  
  return false;
}

// 根据页面类型更新组件显示
function updateWidgetDisplayByPageType() {
  const additionalStats = document.getElementById('server-additional-stats');
  if (!additionalStats) return;
  
  // 如果当前页面是仪表盘，隐藏额外统计指标
  if (isCurrentPageDashboard()) {
    additionalStats.classList.add('hidden');
  } else {
    // 非仪表盘页面，显示额外统计指标
    additionalStats.classList.remove('hidden');
  }
}

// 处理页面切换事件
function handlePageSwitchEvents() {
  // 监听哈希变化（导航切换）
  window.addEventListener('hashchange', updateWidgetDisplayByPageType);
  
  // 监听侧边栏点击事件
  const sidebarLinks = document.querySelectorAll('.sidebar a');
  sidebarLinks.forEach(link => {
    link.addEventListener('click', function() {
      // 延迟检查，确保页面已切换
      setTimeout(updateWidgetDisplayByPageType, 100);
    });
  });
  
  // 监听导航菜单点击事件
  const navLinks = document.querySelectorAll('nav a');
  navLinks.forEach(link => {
    link.addEventListener('click', function() {
      setTimeout(updateWidgetDisplayByPageType, 100);
    });
  });
}

// 监控WebSocket连接状态
function monitorWebSocketConnection() {
  // 如果存在WebSocket连接，监听消息
  if (window.socket) {
    window.socket.addEventListener('message', function(event) {
      try {
        const data = JSON.parse(event.data);
        if (data.type === 'status_update') {
          updateServerStatusWidget(data.payload);
        }
      } catch (error) {
        console.error('解析WebSocket消息失败:', error);
      }
    });
  }
}

// 设置WebSocket监听器
function setupWebSocketListeners() {
  // 如果WebSocket已经存在
  if (window.socket) {
    monitorWebSocketConnection();
  } else {
    // 监听socket初始化事件
    window.addEventListener('socketInitialized', function() {
      monitorWebSocketConnection();
    });
  }
}

// 加载服务器状态数据
async function loadServerStatusData() {
  try {
    // 使用现有的API获取系统状态
    const api = window.api || {};
    const getStatusFn = api.getStatus || function() { return Promise.resolve({}); };
    const statusData = await getStatusFn();
    if (statusData && !statusData.error) {
      updateServerStatusWidget(statusData);
    }
  } catch (error) {
    console.error('加载服务器状态数据失败:', error);
  }
}

// 更新服务器状态组件
function updateServerStatusWidget(stats) {
  // 确保组件存在
  const widget = document.getElementById('server-status-widget');
  if (!widget) return;
  
  // 确保stats存在
  stats = stats || {};
  
  // 提取CPU使用率
  let cpuUsage = 0;
  if (stats.system && typeof stats.system.cpu === 'number') {
    cpuUsage = stats.system.cpu;
  } else if (typeof stats.cpuUsage === 'number') {
    cpuUsage = stats.cpuUsage;
  }
  
  // 提取查询统计数据
  let totalQueries = 0;
  let blockedQueries = 0;
  let allowedQueries = 0;
  
  if (stats.dns) {
    const allowed = typeof stats.dns.Allowed === 'number' ? stats.dns.Allowed : 0;
    const blocked = typeof stats.dns.Blocked === 'number' ? stats.dns.Blocked : 0;
    const errors = typeof stats.dns.Errors === 'number' ? stats.dns.Errors : 0;
    totalQueries = allowed + blocked + errors;
    blockedQueries = blocked;
    allowedQueries = allowed;
  } else {
    totalQueries = typeof stats.totalQueries === 'number' ? stats.totalQueries : 0;
    blockedQueries = typeof stats.blockedQueries === 'number' ? stats.blockedQueries : 0;
    allowedQueries = typeof stats.allowedQueries === 'number' ? stats.allowedQueries : 0;
  }
  
  // 更新CPU使用率
  const cpuValueElement = document.getElementById('server-cpu-value');
  if (cpuValueElement) {
    cpuValueElement.textContent = cpuUsage.toFixed(1) + '%';
  }
  
  const cpuBarElement = document.getElementById('server-cpu-bar');
  if (cpuBarElement) {
    cpuBarElement.style.width = Math.min(cpuUsage, 100) + '%';
    
    // 根据CPU使用率改变颜色
    if (cpuUsage > 80) {
      cpuBarElement.className = 'h-full bg-danger rounded-full';
    } else if (cpuUsage > 50) {
      cpuBarElement.className = 'h-full bg-warning rounded-full';
    } else {
      cpuBarElement.className = 'h-full bg-success rounded-full';
    }
  }
  
  // 更新查询量
  const queriesValueElement = document.getElementById('server-queries-value');
  if (queriesValueElement) {
    queriesValueElement.textContent = formatNumber(totalQueries);
  }
  
  // 计算查询量百分比（假设最大查询量为10000）
  const queryPercentage = Math.min((totalQueries / 10000) * 100, 100);
  const queriesBarElement = document.getElementById('server-queries-bar');
  if (queriesBarElement) {
    queriesBarElement.style.width = queryPercentage + '%';
  }
  
  // 更新额外统计指标
  const totalQueriesElement = document.getElementById('server-total-queries');
  if (totalQueriesElement) {
    totalQueriesElement.textContent = formatNumber(totalQueries);
  }
  
  const blockedQueriesElement = document.getElementById('server-blocked-queries');
  if (blockedQueriesElement) {
    blockedQueriesElement.textContent = formatNumber(blockedQueries);
  }
  
  const allowedQueriesElement = document.getElementById('server-allowed-queries');
  if (allowedQueriesElement) {
    allowedQueriesElement.textContent = formatNumber(allowedQueries);
  }
  
  // 添加光晕提示效果
  if (previousServerData.cpu !== cpuUsage || previousServerData.queries !== totalQueries) {
    addGlowEffect();
  }
  
  // 更新服务器状态指示器
  const statusIndicator = document.getElementById('server-status-indicator');
  if (statusIndicator) {
    // 检查系统状态
    if (stats.system && stats.system.status === 'error') {
      statusIndicator.className = 'inline-block w-2 h-2 bg-danger rounded-full';
    } else {
      statusIndicator.className = 'inline-block w-2 h-2 bg-success rounded-full';
    }
  }
  
  // 保存当前数据用于下次比较
  previousServerData = {
    cpu: cpuUsage,
    queries: totalQueries
  };
}

// 添加光晕提示效果
function addGlowEffect() {
  const widget = document.getElementById('server-status-widget');
  if (!widget) return;
  
  // 添加光晕类
  widget.classList.add('glow-effect');
  
  // 2秒后移除光晕
  setTimeout(function() {
    widget.classList.remove('glow-effect');
  }, 2000);
}

// 格式化数字
function formatNumber(num) {
  // 显示完整数字的最大长度阈值
  const MAX_FULL_LENGTH = 5;
  
  // 先获取完整数字字符串
  const fullNumStr = num.toString();
  
  // 如果数字长度小于等于阈值，直接返回完整数字
  if (fullNumStr.length <= MAX_FULL_LENGTH) {
    return fullNumStr;
  }
  
  // 否则使用缩写格式
  if (num >= 1000000) {
    return (num / 1000000).toFixed(1) + 'M';
  } else if (num >= 1000) {
    return (num / 1000).toFixed(1) + 'K';
  }
  
  return fullNumStr;
}

// 在DOM加载完成后初始化
window.addEventListener('DOMContentLoaded', function() {
  // 延迟初始化，确保页面完全加载
  setTimeout(initServerStatusWidget, 500);
});

// 在页面卸载时清理资源
window.addEventListener('beforeunload', function() {
  if (serverStatusUpdateTimer) {
    clearInterval(serverStatusUpdateTimer);
    serverStatusUpdateTimer = null;
  }
});

// 导出函数供其他模块使用
window.serverStatusWidget = {
  init: initServerStatusWidget,
  update: updateServerStatusWidget
};