// Barre de chargement à injecter
function createLoadingBar(percentage) {
  const existingBar = document.getElementById('socialTimeBar');
  if (existingBar) {
    existingBar.style.width = `${percentage}%`;
    return;
  }

  const barContainer = document.createElement('div');
  barContainer.style.position = 'fixed';
  barContainer.style.top = '0'; // Barre en haut de la page
  barContainer.style.left = '0';
  barContainer.style.width = '100%';
  barContainer.style.height = '6px'; // Barre 3 fois moins épaisse
  barContainer.style.backgroundColor = 'lightgray';
  barContainer.style.zIndex = '9999';

  const bar = document.createElement('div');
  bar.id = 'socialTimeBar';
  bar.style.height = '100%';
  bar.style.width = `${percentage}%`;
  bar.style.backgroundColor = 'green'; // Couleur verte

  // Ajout de graduations à 25%, 50%, 75%
  for (let i = 25; i <= 75; i += 25) {
    const marker = document.createElement('div');
    marker.style.position = 'absolute';
    marker.style.height = '100%';
    marker.style.width = '1px'; // Largeur des marques ajustée
    marker.style.backgroundColor = 'black'; // Couleur des marques
    marker.style.left = `${i}%`; // Position à chaque 25%
    barContainer.appendChild(marker);
  }

  barContainer.appendChild(bar);
  document.body.appendChild(barContainer);
}

// Fonction pour récupérer le temps passé et mettre à jour la barre
function updateLoadingBar() {
  chrome.storage.local.get(['timeSpent', 'timeLimit'], function(data) {
    if (chrome.runtime.lastError) {
      console.error("Erreur de récupération chrome.storage:", chrome.runtime.lastError);
      return;
    }

    const totalTimeSpent = data.timeSpent || 0;
    const timeLimit = data.timeLimit || 4 * 60 * 60; // 4 heures en secondes par défaut
    const percentage = Math.min((totalTimeSpent / timeLimit) * 100, 100);

    createLoadingBar(percentage);
  });
}

// Mettre à jour la barre toutes les 30 secondes
setInterval(updateLoadingBar, 30000);

// Mettre à jour la barre au chargement initial
updateLoadingBar();