Surlignage 1 lexique

57de4774 · Lucie Bader · b4a6a575 · 57de4774 · 57de4774 · 57de4774
Commit 57de4774 authored 5 months ago by Lucie Bader
--- a/manifest.json
+++ b/manifest.json
@@ -61,7 +61,9 @@
        "src/utils/definitions.js",
        "src/sidebar/sidebar.js",
        "src/context_menu/custom_context_menu.js",
-        "src/utils/stats.js"],
+        "src/utils/stats.js",
+        "src/utils/highlighting.js"
+      ],
      "css": ["src/context_menu/custom_context_menu.css"],
      "run_at": "document_idle"
    },

--- a/src/background/background.js
+++ b/src/background/background.js
@@ -167,7 +167,7 @@ async function saveToken(token) {
 }
 // ─────────────────────────────────────────────────────────────────────────────
-// Gestion des messages reçus (depuis popup, etc.)
+// Gestion des messages reçus 
 // ─────────────────────────────────────────────────────────────────────────────
 browser.runtime.onMessage.addListener(async (message, sender, sendResponse) => {
  log("📩 Message reçu dans background.js :", message);
@@ -217,6 +217,34 @@ browser.runtime.onMessage.addListener(async (message, sender, sendResponse) => {
      }
      break;
    }
+    case "toggleLexiconHighlight": {
+      const tabs = await browser.tabs.query({active: true, currentWindow: true});
+      if (tabs[0]) {
+        try {
+          // S'assurer que le script est injecté
+          await browser.scripting.executeScript({
+              target: { tabId: tabs[0].id },
+              files: ["src/utils/highlighting.js"]
+          });
+          // Envoyer le message d'activation
+          await browser.tabs.sendMessage(tabs[0].id, {
+            command: message.isActive ? "activate-highlighting" : "deactivate-highlighting",
+            lexiconId: message.lexiconId
+          });
+          log(`✅ Message de surlignage transmis à l'onglet ${tabs[0].id}`);
+        } catch (error) {
+          console.error("❌ Erreur lors de la gestion du surlignage:", error);
+        }
+      }
+      break;
+    }
+    case "register-highlighting-script": {
+      log("📝 Script de surlignage enregistré pour l'onglet", sender.tab.id);
+      break;
+    }
    default:
      break;
  }
@@ -543,3 +571,26 @@ function sendStoplistToWorker() {
 browser.runtime.onStartup.addListener(loadStoplist);
 browser.runtime.onInstalled.addListener(loadStoplist);
+async function handleHighlighting(command, lexiconId, tabId) {
+  console.log(`🎯 Gestion du surlignage: ${command} pour le lexique ${lexiconId}`);
+  try {
+      // S'assurer que le script est injecté
+      await browser.scripting.executeScript({
+          target: { tabId: tabId },
+          files: ["utils/highlighting.js"]
+      });
+      // Envoyer le message d'activation
+      const response = await browser.tabs.sendMessage(tabId, {
+          command: command,
+          lexiconId: lexiconId
+      });
+      console.log("✅ Réponse du content script:", response);
+      return response;
+  } catch (error) {
+      console.error("❌ Erreur lors de la gestion du surlignage:", error);
+      return false;
+  }
+}
\ No newline at end of file
--- a/src/sidebar/sidebar.html
+++ b/src/sidebar/sidebar.html
@@ -293,6 +293,16 @@
      transform: translateX(-50%) translateY(-5px);
    }
+    .lexicon-highlight {
+      background-color: rgba(255, 255, 0, 0.3);
+      border-bottom: 1px dashed #666;
+      transition: background-color 0.3s;
+    }
+    .lexicon-highlight:hover {
+      background-color: rgba(255, 255, 0, 0.5);
+    }
    .lexicon-section {
      margin-bottom: 10px;
    }

--- a/src/sidebar/sidebar.js
+++ b/src/sidebar/sidebar.js
@@ -116,8 +116,8 @@ async function refreshSidebarState() {
 }
 /**
- * Bascule l’affichage d’un bloc.
+ * Bascule l'affichage d'un bloc.
- * @param {string} blockId - L’ID du conteneur à basculer.
+ * @param {string} blockId - L'ID du conteneur à basculer.
 * @param {HTMLElement} btn - Le bouton qui déclenche la bascule, pour mettre à jour son texte.
 */
 function toggleBlock(blockId, btn) {
@@ -134,8 +134,8 @@ function toggleBlock(blockId, btn) {
 }
 /**
- * Ouvre un bloc s’il est fermé et met à jour le bouton de bascule.
+ * Ouvre un bloc s'il est fermé et met à jour le bouton de bascule.
- * @param {string} blockId - L’ID du conteneur à ouvrir.
+ * @param {string} blockId - L'ID du conteneur à ouvrir.
 * @param {HTMLElement} [btn] - (Optionnel) Le bouton de bascule à mettre à jour.
 */
 function openBlock(blockId, btn) {
@@ -301,12 +301,9 @@ async function displayLexiconsWithCheckbox(lexicons) {
      let currentState = highlightButton.dataset.active === "true";
      let newState = !currentState;
      try {
-        await browser.runtime.sendMessage({
+        await toggleLexiconHighlight(lexiconId, newState);
-          action: "toggleLexiconHighlight",
-          lexiconId,
-          isActive: newState,
-        });
        highlightButton.dataset.active = newState ? "true" : "false";
+        highlightButton.classList.toggle("active", newState);
      } catch (error) {
        console.error("Erreur lors du toggle de surlignage pour le lexique", lexiconId, ":", error);
      }
@@ -413,7 +410,7 @@ async function handleAddWordClick() {
    return;
  }
-  // 3) Vérifier si le mot existe déjà dans l’un des lexiques sélectionnés
+  // 3) Vérifier si le mot existe déjà dans l'un des lexiques sélectionnés
  let definitions = [];
  try {
    definitions = await fetchLexiconDefinitions(selectedWord);
@@ -445,7 +442,7 @@ async function handleAddWordClick() {
    return; 
  }
-  // 6) Envoi d’une seule requête pour tous les lexiques restants
+  // 6) Envoi d'une seule requête pour tous les lexiques restants
  try {
    log(`📡 Envoi de l'ajout du mot "${selectedWord}" dans les lexiques :`, lexiconsToAdd);
    const result = await window.AddWord(authToken, selectedWord, lexiconsToAdd, false);
@@ -464,9 +461,9 @@ async function handleAddWordClick() {
    }
  } catch (error) {
-    console.error("Erreur lors de l’ajout du mot :", error);
+    console.error("Erreur lors de l'ajout du mot :", error);
    if (lexiconResultElement) {
-      lexiconResultElement.textContent = "Erreur lors de l’ajout : " + error.message;
+      lexiconResultElement.textContent = "Erreur lors de l'ajout : " + error.message;
    }
  }
 }
@@ -476,95 +473,126 @@ async function handleAddWordClick() {
 // ─────────────────────────────────────────────────────────────────────────────
 browser.runtime.onMessage.addListener(async (message) => {
  log("📩 Message reçu dans sidebar.js :", message);
-  switch (message.action) {
-    case "refreshUI":
+  if (message.action === "refreshUI") {
-      log("🔄 Demande de rafraîchissement de la barre latérale.");
+    log("🔄 Demande de rafraîchissement de la barre latérale.");
-      await refreshSidebarState();
+    await refreshSidebarState();
-      break;
+    return;
+  }
-    case "mot_selectionne":
-      if (message.selectedText) {
+  if (message.command) {
-        log("🖋️ Mot sélectionné :", message.selectedText);
+    switch (message.command) {
-        const selectedWordElement = document.getElementById("motSelectionne");
+      case "activate-highlighting":
-        if (selectedWordElement) {
+        const highlightButton = document.querySelector(`[data-lexicon-id="${message.lexiconId}"] .lexique-highlight-toggle`);
-          selectedWordElement.textContent = message.selectedText;
+        if (highlightButton) {
-        } else {
+          highlightButton.dataset.active = "true";
-          console.warn("⚠️ Élément #motSelectionne introuvable.");
+          highlightButton.classList.add("active");
        }
-        const lexiconResultElement = document.getElementById("lexiconResult");
+        break;
-        if (lexiconResultElement) {
-          lexiconResultElement.innerHTML = "";
+      case "deactivate-highlighting":
+        const highlightButtonOff = document.querySelector(`[data-lexicon-id="${message.lexiconId}"] .lexique-highlight-toggle`);
+        if (highlightButtonOff) {
+          highlightButtonOff.dataset.active = "false";
+          highlightButtonOff.classList.remove("active");
        }
-        openBlock("etatContent");
+        break;
-      }
-      break;
+      case "mot_selectionne":
+        if (message.selectedText) {
-    case "getDefinition":
+          log("🖋️ Mot sélectionné :", message.selectedText);
-      if (message.selectedText) {
+          const selectedWordElement = document.getElementById("motSelectionne");
-        log("📖 Recherche des définitions pour :", message.selectedText);
+          if (selectedWordElement) {
-        openBlock("definitionContent");
+            selectedWordElement.textContent = message.selectedText;
-        await window.showDefinitions(message.selectedText);
+          } else {
-      }
+            console.warn("⚠️ Élément #motSelectionne introuvable.");
-      break;
+          }
+          const lexiconResultElement = document.getElementById("lexiconResult");
+          if (lexiconResultElement) {
+            lexiconResultElement.innerHTML = "";
+          }
+          openBlock("etatContent");
+        }
+        break;
-    case "showDefinitions":
+      case "getDefinition":
-      if (Array.isArray(message.definitions)) {
+        if (message.selectedText) {
-        window.displayDefinitions(message.definitions);
+          log("📖 Recherche des définitions pour :", message.selectedText);
-      }
+          openBlock("definitionContent");
-      break;
+          await window.showDefinitions(message.selectedText);
+        }
+        break;
-    case "fetchWiktionaryDefinitionResponse":
+      case "showDefinitions":
-      if (message.selectedText) {
+        if (Array.isArray(message.definitions)) {
-        log(`📖 Réception de la définition du Wiktionnaire pour '${message.selectedText}'`);
+          window.displayDefinitions(message.definitions);
-        window.displayDefinitions(message.definitions);
+        }
-      }
+        break;
-      break;
-    case "showLexiconResult":
+      case "fetchWiktionaryDefinitionResponse":
-      log("📚 Résultat des lexiques reçus :", message.lexicons);
+        if (message.selectedText) {
-      window.displayLexiconResults(message.lexicons);
+          log(`📖 Réception de la définition du Wiktionnaire pour '${message.selectedText}'`);
-      break;
+          window.displayDefinitions(message.definitions);
+        }
-    case "addWordResult":
+        break;
-      const lexiconResultElement = document.getElementById("lexiconResult");
-      if (lexiconResultElement) {
-        lexiconResultElement.innerHTML = message.lexicons;
-      }
-      break;
-    case "addToLexicon":
+      case "showLexiconResult":
-      handleAddWordClick();
+        log("📚 Résultat des lexiques reçus :", message.lexicons);
-      break;
+        window.displayLexiconResults(message.lexicons);
+        break;
-    case "openLexiconBlock":
-      openBlock("menuContent");
-      break;
-    case "toggleAuth":
+      case "addWordResult":
-      break;
+        const lexiconResultElement = document.getElementById("lexiconResult");
+        if (lexiconResultElement) {
-    case "authStatusChanged":
+          lexiconResultElement.innerHTML = message.lexicons;
-      break;
+        }
+        break;
-    case "updateUI":
-      await refreshSidebarState();
-      break;
-    case "pyodide-simplemma-ready":
-      return;
-    case "saveToken":
-      authToken = message.token;
-      break;
-    case "closeSidebarBlocks":
+      case "addToLexicon":
-      closeBlock("menuContent");
+        handleAddWordClick();
-      closeBlock("etatContent");
+        break;
-      closeBlock("definitionContent")
-      break;
+      case "openLexiconBlock":
+        openBlock("menuContent");
+        break;
+      case "toggleAuth":
+        break;
+      case "authStatusChanged":
+        break;
+      case "updateUI":
+        await refreshSidebarState();
+        break;
+      case "pyodide-simplemma-ready":
+        return;
+      case "saveToken":
+        authToken = message.token;
+        break;
+      case "closeSidebarBlocks":
+        closeBlock("menuContent");
+        closeBlock("etatContent");
+        closeBlock("definitionContent")
+        break;
+      case "register-stats-script":
+        break;
+      case "register-highlighting-script":
+        log("✅ Script de surlignage enregistré");
+        browser.runtime.sendMessage({ 
+          command: "updateAuthToken", 
+          token: authToken 
+        });
+        break;
-    default:
+      default:
-      console.warn("⚠️ Action inconnue reçue :", message.action);
+        console.warn("⚠️ Action inconnue reçue :", message.command);
+    }
  }
 });
@@ -677,3 +705,18 @@ document.addEventListener("DOMContentLoaded", async () => {
      }
    });
  });
+async function toggleLexiconHighlight(lexiconId, isActive) {
+  try {
+    await browser.tabs.query({ active: true, currentWindow: true }).then((tabs) => {
+      browser.tabs.sendMessage(tabs[0].id, {
+        command: isActive ? "activate-highlighting" : "deactivate-highlighting",
+        lexiconId: lexiconId
+      });
+    });
+    log(`✅ Surlignage ${isActive ? 'activé' : 'désactivé'} pour le lexique ${lexiconId}`);
+  } catch (error) {
+    console.error(`❌ Erreur lors du toggle du surlignage pour le lexique ${lexiconId}:`, error);
+  }
+}
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -15,7 +15,7 @@ document.addEventListener("mouseup", () => {
 });
 // ─────────────────────────────────────────────────────────────────────────────
-// ▌ Fonction utilitaire pour appeler l’API
+// ▌ Fonction utilitaire pour appeler l'API
 // ─────────────────────────────────────────────────────────────────────────────
 /**
 * Effectue une requête API (GET, POST, etc.) avec ou sans body JSON
@@ -54,7 +54,7 @@ async function callApi(url, authToken = null, method = 'GET', data = null) {
 // ─────────────────────────────────────────────────────────────────────────────
 /**
- * Récupère les lexiques de l’utilisateur,
+ * Récupère les lexiques de l'utilisateur,
 * en langue par défaut "fr".
 * 
 * @param {string} authToken - Le token d'authentification.
@@ -67,7 +67,7 @@ async function getLexicons(authToken) {
 }
 /**
- * Récupère tous les lexiques (catégories) de l’utilisateur
+ * Récupère tous les lexiques (catégories) de l'utilisateur
 */
 async function getAllCategoriesLexicons(authToken) {
  const categories = ["User", "Group", "Zero", "New words"];
@@ -118,7 +118,7 @@ async function getAllLexiconWords(authToken) {
    const lexicons = await getLexicons(authToken);
    if (!Array.isArray(lexicons) || lexicons.length === 0) {
-      console.warn("⚠️ Aucun lexique retourné par l’API pour ces paramètres.");
+      console.warn("⚠️ Aucun lexique retourné par l'API pour ces paramètres.");
      return {};
    }
@@ -127,6 +127,11 @@ async function getAllLexiconWords(authToken) {
    for (const lexicon of lexicons) {
      const entries = await getLexiconEntries(authToken, lexicon.id);
+      // Vérification que entries est bien un tableau
+      if (!Array.isArray(entries)) {
+        console.warn(`⚠️ Format invalide pour les entrées du lexique ${lexicon.id}:`, entries);
+        continue;
+      }
      const allGraphies = entries.map(entry => entry.graphy);
      // Création d'un libellé unique pour le lexique
@@ -187,13 +192,13 @@ async function getWiktionaryDefinition(word) {
 */
 async function AddWord(authToken, selectedWord, lexiconIds, force = false) {
  if (!authToken) {
-    throw new Error("Aucun token d’authentification fourni.");
+    throw new Error("Aucun token d'authentification fourni.");
  }
  if (!selectedWord) {
-    throw new Error("Aucun mot n’a été spécifié pour l’ajout.");
+    throw new Error("Aucun mot n'a été spécifié pour l'ajout.");
  }
  if (!Array.isArray(lexiconIds) || lexiconIds.length === 0) {
-    throw new Error("Aucun lexique sélectionné pour l’ajout.");
+    throw new Error("Aucun lexique sélectionné pour l'ajout.");
  }
  const url = "https://babalex.lezinter.net/api/entry/create"; 

--- a/src/utils/highlighting.js
+++ b/src/utils/highlighting.js