Projets
/
map-generator


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
							<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Diagnostic des assets Map Generator</title>
    <style>
        body { font-family: sans-serif; margin: 2em; }
        .ok { color: green; }
        .fail { color: red; }
        .warn { color: orange; }
        table { border-collapse: collapse; margin-top: 1em; }
        th, td { border: 1px solid #ccc; padding: 0.5em 1em; }
    </style>
</head>
<body>
    <h1>Diagnostic des assets Map Generator</h1>
    <p>Ce diagnostic vérifie la présence des fichiers JS/CSS essentiels et signale les doublons ou inclusions non conditionnelles.</p>
    <table>
        <thead>
            <tr><th>Asset</th><th>Statut</th><th>Remarque</th></tr>
        </thead>
        <tbody id="assets-table"></tbody>
    </table>
    <script>
    const assets = [
        '/assets/bootstrap.bundle.min.js',
        '/assets/bootstrap.min.js',
        '/assets/jquery.min.js',
        '/assets/js/pages/projects.js',
        '/assets/js/editor/map-editor.js',
        '/assets/js/loader.js',
        '/assets/js/core/dom-ready.js',
        '/assets/js/ui/header.js',
        '/assets/styles.css',
        '/assets/bootstrap-icons.min.css',
    ];
    function checkAsset(url, cb) {
        var xhr = new XMLHttpRequest();
        xhr.open('HEAD', url);
        xhr.onload = function() {
            cb(xhr.status === 200);
        };
        xhr.onerror = function() {
            cb(false);
        };
        xhr.send();
    }
    function addRow(asset, ok, note) {
        var tr = document.createElement('tr');
        var td1 = document.createElement('td'); td1.textContent = asset;
        var td2 = document.createElement('td'); td2.textContent = ok ? 'Présent' : 'Manquant'; td2.className = ok ? 'ok' : 'fail';
        var td3 = document.createElement('td'); td3.textContent = note || '';
        tr.appendChild(td1); tr.appendChild(td2); tr.appendChild(td3);
        document.getElementById('assets-table').appendChild(tr);
    }
    (function(){
        assets.forEach(function(asset){
            checkAsset(asset, function(ok){
                let note = '';
                if (asset === '/assets/bootstrap.min.js' && ok) note = 'Doit charger le bundle, wrapper présent.';
                if (asset === '/assets/bootstrap.bundle.min.js' && !ok) note = 'Indispensable pour le modal Bootstrap.';
                addRow(asset, ok, note);
            });
        });
    })();
    </script>
    <hr>
    <h2>Conseils</h2>
    <ul>
        <li>Vérifiez que chaque asset "Présent" est bien chargé dans le HTML (onglet Network).</li>
        <li>Si un asset est "Manquant", vérifiez le chemin et la présence sur le disque.</li>
        <li>Pour le JS d'édition de carte, assurez-vous que <code>map-editor.js</code> n'est inclus que sur les pages où <code>#mapCanvas</code> existe.</li>
        <li>Pour le CSS, vérifiez que <code>styles.css</code> et <code>bootstrap-icons.min.css</code> sont bien chargés.</li>
    </ul>
</body>
</html>