popup.js

document.addEventListener('DOMContentLoaded', function() {
  const activateBtn = document.getElementById('activateBtn');
  const pauseBtn = document.getElementById('pauseBtn');
  const resetBtn = document.getElementById('resetBtn');
  const increaseThreatBtn = document.getElementById('increaseThreatBtn');
  const message = document.getElementById('message');
  const threatLevel = document.getElementById('threatLevel');
  const indicator = document.querySelector('.indicator');

  // Function to send message to background script
  function sendMessageToBackground(command, callback) {
    chrome.runtime.sendMessage({ command: command }, function(response) {
      if (response && response.success) {
        callback(true, response);
      } else {
        callback(false);
      }
    });
  }

  // Function to update threat level UI
  function updateThreatLevelUI(level) {
    const levels = ['Low', 'Medium', 'High'];
    const colors = ['green', 'orange', 'red'];
    threatLevel.textContent = `Threat Level: ${levels[level]}`;
    indicator.style.backgroundColor = colors[level];
  }

  // Event listeners for buttons
  activateBtn.addEventListener('click', function() {
    sendMessageToBackground('activateProtection', function(success) {
      if (success) {
        message.textContent = 'Protection activated!';
        message.style.color = '#ff8c1a'; // Change color to match gradient
        activateBtn.style.display = 'none'; // Hide activate button after activation
        pauseBtn.style.display = 'inline-block'; // Show pause button after activation
      } else {
        message.textContent = 'Failed to activate protection.';
        message.style.color = 'red'; // Error message color
      }
    });
  });

  pauseBtn.addEventListener('click', function() {
    sendMessageToBackground('pauseProtection', function(success) {
      if (success) {
        message.textContent = 'Protection paused.';
        message.style.color = '#ff8c1a'; // Change color to match gradient
        pauseBtn.style.display = 'none'; // Hide pause button after pausing
        activateBtn.style.display = 'inline-block'; // Show activate button after pausing
      } else {
        message.textContent = 'Failed to pause protection.';
        message.style.color = 'red'; // Error message color
      }
    });
  });

  resetBtn.addEventListener('click', function() {
    sendMessageToBackground('resetProtection', function(success) {
      if (success) {
        message.textContent = 'Protection reset.';
        message.style.color = '#ff8c1a'; // Change color to match gradient
        activateBtn.style.display = 'inline-block'; // Show activate button after reset
        pauseBtn.style.display = 'none'; // Hide pause button after reset
      } else {
        message.textContent = 'Failed to reset protection.';
        message.style.color = 'red'; // Error message color
      }
    });
  });

  increaseThreatBtn.addEventListener('click', function() {
    sendMessageToBackground('increaseThreatLevel', function(success, response) {
      if (success) {
        updateThreatLevelUI(response.threatLevel);
        message.textContent = 'Threat level increased.';
        message.style.color = '#ff8c1a'; // Change color to match gradient
      } else {
        message.textContent = 'Failed to increase threat level.';
        message.style.color = 'red'; // Error message color
      }
    });
  });

  // Function to update threat level text and indicator color
  function updateThreatLevel() {
    chrome.storage.local.get(['threatLevel'], function(result) {
      const level = result.threatLevel || 0;
      switch (level) {
        case 0:
          threatLevel.textContent = 'Threat Level: Low';
          indicator.style.backgroundColor = 'green';
          break;
        case 1:
          threatLevel.textContent = 'Threat Level: Medium';
          indicator.style.backgroundColor = 'orange';
          break;
        case 2:
          threatLevel.textContent = 'Threat Level: High';
          indicator.style.backgroundColor = 'red';
          break;
        default:
          threatLevel.textContent = 'Threat Level: Unknown';
          indicator.style.backgroundColor = 'gray'; // Default color for unknown level
      }
    });
  }

  // Initialize threat level on popup open
  updateThreatLevel();
});