From 0fb286e125656be0dd662f35e618e62bdb3a638a Mon Sep 17 00:00:00 2001
From: Lucie Bader <167515375+Lucie-Bdr@users.noreply.github.com>
Date: Tue, 28 Jan 2025 18:14:02 +0100
Subject: [PATCH] =?UTF-8?q?D=C3=A9calage=20affichage=20menu=20contextuel?=
 =?UTF-8?q?=20personnalis=C3=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 menu_contextuel/custom_context_menu.js | 22 +++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/menu_contextuel/custom_context_menu.js b/menu_contextuel/custom_context_menu.js
index 4bc69b7..4c1da22 100644
--- a/menu_contextuel/custom_context_menu.js
+++ b/menu_contextuel/custom_context_menu.js
@@ -28,7 +28,7 @@ function injectWhiteBox() {
     const getDefinitionWikiPath = browser.runtime.getURL("icons/definition_wiktionnaire.png");
     const loginPath = browser.runtime.getURL("icons/connexion.png");
 
-    // Construction du HTML avec interpolation
+    // Construction du HTML
     whiteBox.innerHTML = `
       <p id="selectedWord">Mot sélectionné : Aucun</p>
   <hr style="border: 0; height: 1px; background-color: #323046; margin: 8px 0;">
@@ -159,12 +159,20 @@ function showWhiteBox(event, selectedText) {
     // Met à jour l'affichage du mot sélectionné
     const selectedWordElement = document.getElementById("selectedWord");
     selectedWordElement.textContent = `${selectedText}`;
-
-    // Positionne la whiteBox près du clic
-    whiteBox.style.left = `${event.pageX}px`;
-    whiteBox.style.top = `${event.pageY}px`;
-    whiteBox.style.display = "block";
-    console.log("Affichage du menu contextuel avec le mot :", selectedText);
+    
+    // Récupère la position de la sélection
+    const selection = window.getSelection();
+    const range = selection.getRangeAt(0);
+    const rect = range.getBoundingClientRect(); // Obtenez la position et taille du mot sélectionné
+
+    // Calcule la position du menu en bas à droite du mot sélectionné
+    const top = rect.bottom + window.scrollY; // Bas du mot + défilement vertical
+    const left = rect.right + window.scrollX; // Droite du mot + défilement horizontal
+
+    // Positionne la whiteBox
+    whiteBox.style.left = `${left}px`;
+    whiteBox.style.top = `${top}px`;
+    whiteBox.style.display = "block";nsole.log("Affichage du menu contextuel avec le mot :", selectedText);
 
     // Mettre à jour la visibilité des boutons
     updateMenuVisibility();
-- 
GitLab