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() { ...@@ -393,14 +393,22 @@ defineScreen('/game', function gameScreen() {
</div> </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([ // Wait for DOM to settle, then load scripts sequentially
loadS('/public/js/chess.min.js'), requestAnimationFrame(() => {
loadS('/public/js/openings.js'), loadS('/public/js/chess.min.js')
loadS('/public/js/board.js'), .then(() => loadS('/public/js/openings.js'))
loadS('/public/js/game.js') .then(() => loadS('/public/js/board.js'))
]).then(() => { .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.Board) Board.init('board', { flipped: params.color === 'b', playerColor: params.color || 'w' });
if (window.Game) Game.start({ if (window.Game) Game.start({
color: params.color || 'w', color: params.color || 'w',
...@@ -409,6 +417,8 @@ defineScreen('/game', function gameScreen() { ...@@ -409,6 +417,8 @@ defineScreen('/game', function gameScreen() {
increment: parseInt(params.inc) || 0, increment: parseInt(params.inc) || 0,
rated: params.rated !== 'false' 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