morgane/EverShelf
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

Actualiser test.html
CI / PHP Syntax Check (push) Has been cancelled
Details
CI / JavaScript Lint (push) Has been cancelled
Details
CI / Docker Build Test (push) Has been cancelled
Details
CI / Validate Translation Files (push) Has been cancelled
Details
CI / Auto-merge develop → main (push) Has been cancelled
Details
CI / Create GitHub Release (push) Has been cancelled
Details

Browse Source
This commit is contained in:
morgane
2026-06-17 17:33:07 +00:00
parent df8211c8ac
commit eaf9ebc52e
1 changed files with 36 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
test.html
+31 -45
View File
@@ -2,63 +2,49 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>⚡ Sandbox - Découverte de Table</title> <title>⚡ Récupération Dynamique Totale</title>
<style>
body { font-family: sans-serif; background: #333; padding: 50px; color: white; }
.modal { background: white; padding: 20px; border-radius: 12px; width: 400px; margin: 0 auto; color: black; }
.debug-panel { margin-top: 20px; padding: 15px; background: #222; border-radius: 8px; font-family: monospace; }
.btn { padding: 10px 20px; border-radius: 8px; border: none; cursor: pointer; margin: 5px; background: #1976d2; color: white; }
</style>
</head> </head>
<body> <body>
<h3>Catégories récupérées en temps réel :</h3>
<div class="modal"> <select id="dynamic-select" style="width:100%; padding:10px;"></select>
<h3>Découverte automatique</h3>
<button class="btn" onclick="discoverCategories()">Lancer la lecture de la table</button>
<div id="result-area"></div>
</div>
<div class="debug-panel">
<strong>Table des catégories trouvées :</strong>
<pre id="table-display">En attente...</pre>
</div>
<script> <script>
async function discoverCategories() { async function fetchRealCategories() {
try { // 1. On récupère le fichier app.js
// On lit le fichier source directement depuis le serveur
const response = await fetch('/assets/js/app.js'); const response = await fetch('/assets/js/app.js');
const text = await response.text(); const scriptText = await response.text();
// On cherche la définition de CATEGORY_LABELS par regex // 2. On crée un "bac à sable" (iframe) pour exécuter le code sans erreurs
const match = text.match(/const CATEGORY_LABELS = ({[\s\S]*?});/); const iframe = document.createElement('iframe');
iframe.style.display = 'none';
document.body.appendChild(iframe);
if (match) { // 3. On définit un mock pour la fonction de traduction 't' qui bloquait tout
// On transforme le bloc trouvé en objet JS iframe.contentWindow.t = (key) => key.split('.').pop();
const categoryObject = eval('(' + match[1] + ')');
// Affichage dans le panneau de debug // 4. On injecte le code
document.getElementById('table-display').innerText = JSON.stringify(categoryObject, null, 2); const script = iframe.contentDocument.createElement('script');
script.textContent = scriptText;
iframe.contentDocument.body.appendChild(script);
// Génération du menu déroulant // 5. On attend un instant que la variable soit déclarée et on la récupère
renderDropdown(categoryObject); setTimeout(() => {
} else { const cats = iframe.contentWindow.CATEGORY_LABELS;
document.getElementById('table-display').innerText = "Erreur : Table CATEGORY_LABELS introuvable dans app.js."; if (cats) {
} const select = document.getElementById('dynamic-select');
} catch (e) { Object.entries(cats).forEach(([key, val]) => {
document.getElementById('table-display').innerText = "Erreur de lecture : " + e.message; const opt = document.createElement('option');
opt.value = key;
opt.textContent = val;
select.appendChild(opt);
});
} }
document.body.removeChild(iframe);
}, 500);
} }
function renderDropdown(data) { // On lance la découverte au chargement
const area = document.getElementById('result-area'); fetchRealCategories();
const options = Object.entries(data).map(([k, v]) => `<option value="${k}">${v}</option>`).join('');
area.innerHTML = `
<select style="width:100%; padding:10px; margin-top:10px;">
${options}
</select>
`;
}
</script> </script>
</body> </body>
</html> </html>