Commit 677320c2 authored by Mahmoud Aglan's avatar Mahmoud Aglan

fix: chess board init — sequential script loading + DOM verification

The board was empty because:
1. Scripts cached from previous nav resolved immediately
2. Board/Game singletons kept stale DOM references
3. Race condition between DOM render and script execution

Fix:
- Remove existing script tags before re-adding (forces re-execution)
- Load scripts SEQUENTIALLY (chess.min → openings → board → game)
- requestAnimationFrame before script loading (DOM settle)
- Explicit document.getElementById('board') check before Board.init
Co-Authored-By: 's avatarClaude Opus 4.6 <noreply@anthropic.com>
parent b4e41050
......@@ -393,14 +393,22 @@ defineScreen('/game', function gameScreen() {
</div>
`;
function loadS(src){return new Promise((r,j)=>{if(document.querySelector('script[src="'+src+'"]')){r();return;}const s=document.createElement('script');s.src=src;s.onload=r;s.onerror=j;document.body.appendChild(s);});}
function loadS(src){return new Promise((r,j)=>{
const existing = document.querySelector('script[src="'+src+'"]');
if(existing){existing.remove();} // Remove old script to force re-execute
const s=document.createElement('script');s.src=src;s.onload=r;s.onerror=j;document.body.appendChild(s);
});}
Promise.all([
loadS('/public/js/chess.min.js'),
loadS('/public/js/openings.js'),
loadS('/public/js/board.js'),
loadS('/public/js/game.js')
]).then(() => {
// Wait for DOM to settle, then load scripts sequentially
requestAnimationFrame(() => {
loadS('/public/js/chess.min.js')
.then(() => loadS('/public/js/openings.js'))
.then(() => loadS('/public/js/board.js'))
.then(() => loadS('/public/js/game.js'))
.then(() => {
// Verify #board exists before init
const boardEl = document.getElementById('board');
if (!boardEl) { console.error('Board element not found!'); return; }
if (window.Board) Board.init('board', { flipped: params.color === 'b', playerColor: params.color || 'w' });
if (window.Game) Game.start({
color: params.color || 'w',
......@@ -409,6 +417,8 @@ defineScreen('/game', function gameScreen() {
increment: parseInt(params.inc) || 0,
rated: params.rated !== 'false'
});
})
.catch(e => console.error('Script load error:', e));
});
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment