Skip to content
Snippets Groups Projects
Commit fb0019b2 authored by Lucie Bader's avatar Lucie Bader
Browse files

Corrections affichage définitions lexiques

parent e38c4b81
No related branches found
No related tags found
1 merge request!4Définitions (lexiques de l'utilisateur + Wiktionnaire)
......@@ -167,7 +167,14 @@ async function getAllLexiconWords(authToken) {
for (const lexicon of lexicons) {
const entries = await getLexiconEntries(authToken, lexicon.id);
const allGraphies = entries.map(entry => entry.graphy);
allGraphiesByLexicon[lexicon.name] = allGraphies;
// Création d'un libellé unique pour le lexique
const lexiconName =
lexicon.category === "User"
? `Lexique personnel (${lexicon.user?.pseudo || "Inconnu"}) [${lexicon.id}]`
: `Lexique de groupe (${lexicon.group?.name || "Inconnu"}) [${lexicon.id}]`;
allGraphiesByLexicon[lexiconName] = allGraphies;
}
console.log("✅ Toutes les graphies récupérées :", allGraphiesByLexicon);
......@@ -178,6 +185,7 @@ async function getAllLexiconWords(authToken) {
}
}
// ─────────────────────────────────────────────────────────────────────────────
// ▌ Récupération de définition du Wiktionnaire
// ─────────────────────────────────────────────────────────────────────────────
......
......@@ -4,8 +4,9 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BaLex - Barre Latérale</title>
<script src="sidebar.js" defer></script>
<script src="../api.js" defer></script>
<script src="sidebar.js" defer></script>
<style>
/* Style global */
body {
......@@ -254,7 +255,7 @@
</div>
<div id="noLexiconDefinitionsContainer" style="display: none; color: #8d5c70;">
<p>Aucune définition trouvée dans vos lexiques.</p>
<p>Aucune définition trouvée dans les lexiques.</p>
</div>
<div id="noWiktionaryDefinitionsContainer" style="display: none; color: #8d5c70;">
......
......@@ -89,16 +89,15 @@ async function refreshSidebarState() {
toggleHighlightMessage(isLoggedIn);
if (isLoggedIn) {
await fetchLexicons();
await fetchLexicons();
} else {
const lexiquesContainer = document.getElementById("lexiques");
if (lexiquesContainer) {
lexiquesContainer.textContent = "Veuillez vous connecter pour voir vos lexiques.";
} else if (!lexiquesContainer) {
console.error("❌ Élément #lexiques introuvable dans le DOM.");
return;
}
return;
}
}
console.log("✅ Barre latérale actualisée. Utilisateur connecté :", isLoggedIn);
......@@ -288,8 +287,22 @@ async function handleAuthButtonClick() {
/**
* Récupère les définitions d'un mot dans les lexiques de l'utilisateur (ex. user_id=4),
* en faisant un appel séparé pour chaque lexique :
* GET /api/entry/search?graphy={word}&language=fr&target_lex={lexicon.id}
* en effectuant un appel global à l'API pour le mot recherché, puis en filtrant
* les entrées pour ne conserver que celles dont le lexicon.id est présent dans la liste
* des lexiques de l'utilisateur.
*
* Retourne un tableau d'objets { source, text } où:
* - source = nom du lexique (ou "Lexique #ID")
* - text = texte de la définition
*
* @param {string} word - Le mot recherché (ex. "chat").
* @returns {Promise<Array<{ source: string, text: string }>>}
*/
/**
* Récupère les définitions d'un mot dans les lexiques de l'utilisateur (ex. user_id=4),
* en effectuant un appel global à l'API pour le mot recherché, puis en filtrant
* les entrées pour ne conserver que celles dont le lexicon.id est présent dans la liste
* des lexiques de l'utilisateur.
*
* Retourne un tableau d'objets { source, text } où:
* - source = nom du lexique (ou "Lexique #ID")
......@@ -308,82 +321,97 @@ async function fetchLexiconDefinitions(word) {
}
// 1) Récupérer la liste complète des lexiques de l'utilisateur
// Par défaut : user_id=4 et language=fr
const userId = 4;
const lexUrl = `https://babalex.lezinter.net/api/lexicon/search?user_id=${userId}&language=fr`;
const lexResponse = await fetch(lexUrl, {
headers: { Authorization: `Bearer ${authToken}` }
});
if (!lexResponse.ok) {
throw new Error(`❌ Erreur API lors de la récupération des lexiques: ${lexResponse.statusText}`);
}
const userLexicons = await lexResponse.json();
console.log("🗂️ Lexiques de l'utilisateur :", userLexicons);
if (!Array.isArray(userLexicons) || userLexicons.length === 0) {
console.warn("⚠️ Aucuns lexiques trouvés pour cet utilisateur.");
console.warn("⚠️ Aucun lexique trouvé pour cet utilisateur.");
return [];
}
// 2) Pour chaque lexique, on va faire une requête
// GET /api/entry/search?graphy=word&language=fr&target_lex={lexicon.id}
let allDefinitions = [];
// Mise à jour de lexiconMap avec des libellés uniques (ajout de l'ID)
lexiconMap.clear();
userLexicons.forEach((lex) => {
const lexiconName =
lex.category === "User"
? `Lexique personnel (${lex.user?.pseudo || "Inconnu"})`
: `Lexique de groupe (${lex.group?.name || "Inconnu"})`;
lexiconMap.set(lex.id, lexiconName);
});
console.log("📌 LexiconMap :", lexiconMap);
for (const lex of userLexicons) {
const lexId = lex.id; // ID du lexique
const lexName = lex.name || `Lexique #${lexId}`;
// 2) Pour chaque lexique, rechercher le mot en ajoutant target_lex
const definitionsPromises = userLexicons.map(async (lex) => {
const searchUrl = `https://babalex.lezinter.net/api/entry/search?graphy=${encodeURIComponent(word)}&language=fr&target_lex=${lex.id}`;
console.log(`🔎 Appel API pour le lexique ${lex.id} avec l'URL : ${searchUrl}`);
const url = `https://babalex.lezinter.net/api/entry/search?graphy=${encodeURIComponent(word)}&language=fr&target_lex=${lexId}`;
console.log(`🔎 Appel API pour le lexique #${lexId} (${lexName}) => ${url}`);
const searchResponse = await fetch(searchUrl, {
headers: { Authorization: `Bearer ${authToken}` }
});
if (!searchResponse.ok) {
console.warn(`⚠️ Erreur pour le lexique ${lex.id} : ${searchResponse.statusText}`);
return { lexiconId: lex.id, entries: [] };
}
const entries = await searchResponse.json();
try {
const response = await fetch(url, {
headers: { Authorization: `Bearer ${authToken}` }
});
// Filtrage côté client : ne garder que les entrées dont entry.lexicon.id correspond exactement à lex.id
const filteredEntries = entries.filter(entry => {
if (!entry.lexicon) return false;
return Number(entry.lexicon.id) === Number(lex.id);
});
if (!response.ok) {
console.warn(`❌ Lexique ${lexId} : Erreur API (${response.status}): ${response.statusText}`);
continue;
}
console.log(`Pour le lexique ${lex.id} (${lexiconMap.get(lex.id)}), entrées filtrées :`, filteredEntries);
const data = await response.json();
if (!Array.isArray(data) || data.length === 0) {
continue;
}
return { lexiconId: lex.id, entries: filteredEntries };
});
// On parse pour extraire toutes les définitions
for (const entry of data) {
const items = entry.attributes?.Items;
if (!Array.isArray(items)) {
continue;
const results = await Promise.all(definitionsPromises);
// 3) Parcourir les résultats et extraire les définitions
let allDefinitions = [];
results.forEach(result => {
const lexiconId = result.lexiconId;
const sourceName = lexiconMap.get(lexiconId) || `Lexique #${lexiconId}`;
result.entries.forEach(entry => {
// Vérifier à nouveau que l'entrée appartient bien au lexique ciblé
if (!entry.lexicon || Number(entry.lexicon.id) !== Number(lexiconId)) return;
let items = entry.attributes?.Items;
// Si items n'est pas un tableau mais est un objet, convertir en tableau
if (!Array.isArray(items)) {
if (typeof items === 'object' && items !== null) {
items = Object.values(items);
} else {
return;
}
}
for (const subItem of items) {
const definitionsArray = subItem.Sense?.Definitions;
if (!Array.isArray(definitionsArray)) {
continue;
}
items.forEach(item => {
const definitionsArray = item.Sense?.Definitions;
if (!Array.isArray(definitionsArray)) return;
for (const defObj of definitionsArray) {
if (defObj.Def) {
const fullLexName = `${lex.name || `Lexique` } (#${lex.id})`;
allDefinitions.push({
source: fullLexName,
text: defObj.Def
});
}
definitionsArray.forEach(defObj => {
if (defObj.Def) {
allDefinitions.push({
source: sourceName,
text: defObj.Def
});
}
}
}
});
});
});
});
} catch (err) {
console.error(`Erreur lors de la requête pour le lexique #${lexId} :`, err);
}
}
console.log("Résultat final :", allDefinitions);
// 3) Retourne le tableau de toutes les définitions trouvées
console.log("Résultat final filtré :", allDefinitions);
return allDefinitions;
} catch (error) {
console.error("❌ Erreur générale lors de la récupération des définitions :", error);
......@@ -391,6 +419,7 @@ async function fetchLexiconDefinitions(word) {
}
}
/**
* Récupère la définition d'un mot depuis le Wiktionnaire (fr).
* Retourne un tableau d'objets : [{ source: 'Wiktionnaire', text: '...' }]
......@@ -463,26 +492,24 @@ function displayDefinitions(definitions) {
const noLexiconDefinitionsContainer = document.getElementById("noLexiconDefinitionsContainer");
const noWiktionaryDefinitionsContainer = document.getElementById("noWiktionaryDefinitionsContainer");
// On réinitialise les listes existantes
// Réinitialiser les listes existantes
mesLexiquesList.innerHTML = "";
wiktionnaireList.innerHTML = "";
// On masque d'emblée les messages d'erreur
// Masquer les messages d'erreur dès le départ
if (noLexiconDefinitionsContainer) noLexiconDefinitionsContainer.style.display = "none";
if (noWiktionaryDefinitionsContainer) noWiktionaryDefinitionsContainer.style.display = "none";
// Variables pour suivre la présence de définitions
let hasLexiconDefinitions = false;
let hasWiktionaryDefinitions = false;
// Objet pour regrouper les définitions par lexique
// Regrouper les définitions par lexique (source)
const lexiconGroups = {};
// Parcours de chaque définition
definitions.forEach(({ source, text }) => {
if (!source || !text) return;
// Création de l'élément <li> et gestion du "Lire la suite"
// Créer l'élément <li> pour la définition
const li = document.createElement("li");
let displayedText = text;
......@@ -499,20 +526,17 @@ function displayDefinitions(definitions) {
event.preventDefault();
openDefinitionPopup(text);
});
// On assemble le li
li.appendChild(document.createTextNode(displayedText));
li.appendChild(readMoreLink);
} else {
li.textContent = displayedText;
}
// Vérification de la source (Wiktionnaire / Lexiques)
// Vérifier la source : Wiktionnaire ou Lexiques
if (source === "Wiktionnaire") {
wiktionnaireList.appendChild(li);
hasWiktionaryDefinitions = true;
} else {
// Si on veut grouper par nom de lexique
if (!lexiconGroups[source]) {
lexiconGroups[source] = [];
}
......@@ -521,7 +545,7 @@ function displayDefinitions(definitions) {
}
});
// Création d'une structure pour les différents lexiques
// Créer une section pour chaque lexique
Object.entries(lexiconGroups).forEach(([lexiconName, definitionItems]) => {
const lexiconContainer = document.createElement("div");
lexiconContainer.className = "lexicon-section";
......@@ -529,13 +553,15 @@ function displayDefinitions(definitions) {
const lexiconHeader = document.createElement("div");
lexiconHeader.className = "lexicon-header";
lexiconHeader.textContent = lexiconName;
// Toggle d'affichage au clic
// Lorsque l'utilisateur clique sur le header, on bascule l'affichage
lexiconHeader.addEventListener("click", () => {
lexiconContent.classList.toggle("hidden");
});
// Création de la liste et ajout de la classe "hidden" pour qu'elle soit masquée par défaut
const lexiconContent = document.createElement("ul");
lexiconContent.className = "lexicon-content hidden";
definitionItems.forEach(li => lexiconContent.appendChild(li));
lexiconContainer.appendChild(lexiconHeader);
......@@ -543,27 +569,17 @@ function displayDefinitions(definitions) {
mesLexiquesList.appendChild(lexiconContainer);
});
// Condition : s'il n'y a AUCUNE définition dans les lexiques
// Gestion de l'affichage des messages d'erreur si aucune définition n'est trouvée
if (!hasLexiconDefinitions) {
console.warn("⚠️ Aucune définition trouvée dans les lexiques de l'utilisateur.");
if (noLexiconDefinitionsContainer) {
noLexiconDefinitionsContainer.style.display = "block";
}
if (noLexiconDefinitionsContainer) noLexiconDefinitionsContainer.style.display = "block";
}
// Condition : s'il n'y a AUCUNE définition Wiktionnaire
if (!hasWiktionaryDefinitions) {
console.warn("⚠️ Aucune définition trouvée dans le Wiktionnaire.");
if (noWiktionaryDefinitionsContainer) {
noWiktionaryDefinitionsContainer.style.display = "block";
}
if (noWiktionaryDefinitionsContainer) noWiktionaryDefinitionsContainer.style.display = "block";
}
// Affiche ou masque la section "Mes lexiques" selon l'existence de définitions
// Affichage ou masquage des sections en fonction de l'existence de définitions
document.getElementById("mesLexiquesContainer").style.display =
hasLexiconDefinitions ? "block" : "none";
// Affiche ou masque la section "Wiktionnaire" selon l'existence de définitions
document.getElementById("wiktionnaireContainer").style.display =
hasWiktionaryDefinitions ? "block" : "none";
}
......@@ -571,6 +587,10 @@ function displayDefinitions(definitions) {
function openDefinitionPopup(fullText) {
modalFullText.innerHTML = "<p>" + fullText.replace(/\n/g, "<br>") + "</p>";
modalOverlay.style.display = "flex";
......@@ -593,28 +613,36 @@ modalOverlay.addEventListener("click", (event) => {
async function showDefinitions(word) {
console.log(`📖 Recherche des définitions pour '${word}'...`);
// Sélection du conteneur d'erreur/message
const noDefinitionsContainer = document.getElementById("noDefinitionsContainer");
if (noDefinitionsContainer) {
// On indique clairement que la recherche est en cours
noDefinitionsContainer.textContent = "Chargement des définitions...";
noDefinitionsContainer.style.display = "block";
}
try {
// On lance en parallèle la récupération des définitions
const [lexiconDefinitions, wiktionaryDefinitions] = await Promise.all([
// Utilisation de Promise.allSettled pour récupérer les deux sources
const results = await Promise.allSettled([
fetchLexiconDefinitions(word),
fetchWiktionaryDefinition(word)
]);
// Extraction des résultats réussis
const lexiconDefinitions =
results[0].status === "fulfilled" ? results[0].value : [];
const wiktionaryDefinitions =
results[1].status === "fulfilled" ? results[1].value : [];
// Fusion des résultats
const allDefinitions = [...lexiconDefinitions, ...wiktionaryDefinitions];
console.log("📚 Définitions combinées :", allDefinitions);
// On délègue l'affichage final à displayDefinitions
// Affichage final
displayDefinitions(allDefinitions);
// Masquer le conteneur de message si tout s'est bien passé
if (noDefinitionsContainer) {
noDefinitionsContainer.style.display = "none";
}
} catch (error) {
console.error("❌ Erreur lors de la récupération des définitions :", error);
if (noDefinitionsContainer) {
......@@ -626,6 +654,7 @@ async function showDefinitions(word) {
}
// ─────────────────────────────────────────────────────────────────────────────
// ▌ Gestion des messages reçus (depuis le background ou ailleurs)
// ─────────────────────────────────────────────────────────────────────────────
......@@ -726,7 +755,10 @@ function displayLexiconResults(lexicons) {
}
// Récupérer le nom depuis lexiconMap
const lexiconName = lexiconMap.get(lexicon.id) || `Lexique #${lexicon.id} (Nom inconnu)`;
const lexiconName =
lex.category === "User"
? `Lexique personnel (${lex.user?.pseudo || "Inconnu"}) [${lex.id}]`
: `Lexique de groupe (${lex.group?.name || "Inconnu"}) [${lex.id}]`;
const li = document.createElement("li");
li.innerHTML = `<strong>${lexiconName}</strong> (${lexicon.id})`;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment