|
|
|
|
@ -110,6 +110,63 @@ document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Ouvre / Ferme la popup de hierachie de famille
|
|
|
|
|
async function toggleHierachiPopup(id) {
|
|
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
const response = await fetch(`/emojis/${id}/getParents/`, {
|
|
|
|
|
method: 'GET',
|
|
|
|
|
headers: {
|
|
|
|
|
'Accept': 'application/json'
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
if (!response.ok) throw new Error("Erreur serveur : " + response.status);
|
|
|
|
|
|
|
|
|
|
const data = await response.json();
|
|
|
|
|
|
|
|
|
|
// Injection dynamique dans la popup
|
|
|
|
|
const parent1El = document.getElementById(`parent1-${id}`);
|
|
|
|
|
if (data.codeParent1 && data.codeParent1.includes('vercel')) {
|
|
|
|
|
parent1El.innerHTML = `<img src="${data.codeParent1}" alt="Parent 1" width="48" height="48">`;
|
|
|
|
|
} else {
|
|
|
|
|
parent1El.innerText = data.codeParent1 || '❓';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const parent2El = document.getElementById(`parent2-${id}`);
|
|
|
|
|
if (data.codeParent2 && data.codeParent2.includes('vercel')) {
|
|
|
|
|
parent2El.innerHTML = `<img src="${data.codeParent2}" alt="Parent 2" width="48" height="48">`;
|
|
|
|
|
} else {
|
|
|
|
|
parent2El.innerText = data.codeParent2 || '❓';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const childEl = document.getElementById(`child-${id}`);
|
|
|
|
|
if (data.codeEnfant && data.codeEnfant.includes('vercel')) {
|
|
|
|
|
childEl.innerHTML = `<img src="${data.codeEnfant}" alt="Emoji fusionné" width="64" height="64">`;
|
|
|
|
|
} else {
|
|
|
|
|
childEl.innerText = data.codeEnfant || '❓';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
document.getElementById(`name-parent1-${id}`).innerText = data.nameParent1 || 'inconnu';
|
|
|
|
|
document.getElementById(`name-parent2-${id}`).innerText = data.nameParent2 || 'inconnu';
|
|
|
|
|
document.getElementById(`name-child-${id}`).innerText = data.nameEnfant || 'inconnu';
|
|
|
|
|
console.log("Parents récupérés :", data);
|
|
|
|
|
|
|
|
|
|
// Affichage plein écran
|
|
|
|
|
const popup = document.getElementById(`popup-hiera-${id}`);
|
|
|
|
|
if (popup) popup.style.display = 'block';
|
|
|
|
|
|
|
|
|
|
} catch (error) {
|
|
|
|
|
console.error("Erreur lors de la récupération des parents :", error);
|
|
|
|
|
alert("Une erreur est survenue lors de l'affichage de la hiérarchie.");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function closeHierarchyPopup(id) {
|
|
|
|
|
const popup = document.getElementById(`popup-hiera-${id}`);
|
|
|
|
|
if (popup) popup.style.display = 'none';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Fermer les autres popups en cliquant ailleurs
|
|
|
|
|
document.addEventListener('click', function(e) {
|
|
|
|
|
document.querySelectorAll('.popup').forEach(p => {
|
|
|
|
|
@ -117,6 +174,16 @@ document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
|
p.style.display = 'none';
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// Partie pour fermer la popup de hiérarchie
|
|
|
|
|
document.querySelectorAll('.close-btn').forEach(btn => {
|
|
|
|
|
btn.addEventListener('click', (e) => {
|
|
|
|
|
const id = btn.dataset.id; // On récupère l'id depuis l'attribut data-id
|
|
|
|
|
const popup = document.getElementById(`popup-hiera-${id}`);
|
|
|
|
|
if (popup) popup.style.display = 'none';
|
|
|
|
|
e.stopPropagation(); // Empêche la propagation du clic
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// Fonction pour appliquer la recherche, les filtres et le tri
|
|
|
|
|
@ -168,6 +235,18 @@ document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// Appel Fonctionnalité de popup de hierachie de famille
|
|
|
|
|
document.querySelectorAll('.detail-icon-hierarchy').forEach(icon => {
|
|
|
|
|
icon.addEventListener('click', (e) => {
|
|
|
|
|
const card = icon.closest('.emoji-card');
|
|
|
|
|
const id = card?.dataset.id;
|
|
|
|
|
if (id) {
|
|
|
|
|
toggleHierachiPopup(id);
|
|
|
|
|
}
|
|
|
|
|
e.stopPropagation(); // évite que ça sélectionne la carte
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// Appliquer l'écouteur à toutes les cartes (base + collection)
|
|
|
|
|
document.querySelectorAll('.emoji-container').forEach(container => {
|
|
|
|
|
container.addEventListener('click', (e) => {
|
|
|
|
|
|
