Skip to content

Latest commit

 

History

History
225 lines (175 loc) · 5.52 KB

File metadata and controls

225 lines (175 loc) · 5.52 KB

Collision System Troubleshooting Guide

Issue: Not Seeing Enemy Collisions

Quick Fixes

1. Hard Refresh Browser (Most Common Issue)

The browser may be caching the old JavaScript files.

Windows/Linux:

  • Press Ctrl + Shift + R or Ctrl + F5

Mac:

  • Press Cmd + Shift + R

Alternative:

  • Open DevTools (F12)
  • Right-click the refresh button
  • Select "Empty Cache and Hard Reload"

2. Verify Files Are Loaded

Open browser console (F12) and check for errors:

  • Look for 404 errors (file not found)
  • Look for import errors
  • Check if CollisionSystem.js is loaded

3. Check Console for Errors

// Open console and type:
console.log(window.location.href);
// Should show the correct URL

// Check if modules are loading

Verification Steps

Step 1: Verify File Structure

cd vampire-survivor
ls -la js/game/CollisionSystem.js
ls -la js/config/CollisionConfig.js

Both files should exist.

Step 2: Check Git Status

git status

Should show:

  • Modified: js/entities/Enemy.js
  • Modified: js/entities/NeutralEntity.js
  • Modified: js/main.js
  • Untracked: js/game/CollisionSystem.js
  • Untracked: js/config/CollisionConfig.js

Step 3: Verify Syntax

node --check vampire-survivor/js/game/CollisionSystem.js
node --check vampire-survivor/js/entities/Enemy.js
node --check vampire-survivor/js/main.js

All should pass without errors.

Step 4: Check Browser Console

  1. Open the game in browser
  2. Press F12 to open DevTools
  3. Go to Console tab
  4. Look for any red error messages
  5. Check Network tab to see if all files loaded (200 status)

Common Issues

Issue: "Failed to load module"

Cause: File path is incorrect or file doesn't exist Fix:

  • Verify file exists at correct path
  • Check import statement matches file location
  • Ensure file extension is .js

Issue: "Unexpected token" or syntax error

Cause: JavaScript syntax error in code Fix:

  • Run node --check on the file
  • Check for missing brackets, semicolons
  • Verify ES6 module syntax is correct

Issue: Collisions still not working after refresh

Possible causes:

  1. Service Worker caching

    • Open DevTools → Application → Service Workers
    • Unregister any service workers
    • Hard refresh again
  2. Configuration disabled

    • Check js/config/CollisionConfig.js
    • Verify performance.enabled: true
    • Verify neutral.enabled: true
  3. Enemies not close enough

    • Enemies need to overlap to collide
    • Wait for more enemies to spawn
    • Move player to group enemies together

Debug Mode

Add console logging to verify collision system is running:

In CollisionSystem.js (line 14):

static resolveEnemyCollisions(enemies) {
    console.log('Checking collisions for', enemies.length, 'enemies');
    
    if (!CollisionConfig.performance.enabled) {
        console.log('Collision system disabled');
        return;
    }
    // ... rest of code

In main.js (after collision calls):

// Resolve enemy-to-enemy collisions with momentum transfer
CollisionSystem.resolveEnemyCollisions(game.enemies);
console.log('Collision check complete');

Expected Behavior

When working correctly, you should see:

  1. Enemies moving toward player
  2. When 2+ enemies get close, they bounce apart
  3. Enemies spread out naturally instead of stacking
  4. Filled neutral entities block enemies
  5. Enemies bounce off neutral entities

Testing Checklist

  • Hard refreshed browser (Ctrl+Shift+R)
  • No errors in browser console
  • All files show 200 status in Network tab
  • At least 5-10 enemies spawned
  • Enemies are close enough to collide
  • CollisionConfig.performance.enabled is true
  • Tried moving player to group enemies

Manual Verification

Test 1: Check if velocity is working

Open console and type:

// This won't work in browser, but shows the concept
// Enemies should have vx and vy properties

Test 2: Increase collision visibility

Edit CollisionConfig.js:

enemy: {
    restitution: 0.95,  // Very bouncy - easier to see
    mass: 1.0,
    separationFactor: 1.0  // More aggressive separation
}

Test 3: Spawn more enemies

Edit GameState.js:

enemySpawner: {
    spawnInterval: 0.5,  // Spawn faster (was 2)
    maxEnemies: 50
}

Still Not Working?

If collisions still aren't visible after all troubleshooting:

  1. Check browser compatibility

    • Use Chrome, Firefox, or Edge (latest version)
    • ES6 modules required
  2. Verify server is serving files

    • If using file:// protocol, switch to HTTP server
    • Run: python3 -m http.server 8000
    • Access via http://localhost:8000
  3. Check for JavaScript errors

    • Any error will stop execution
    • Fix all console errors first
  4. Verify imports are correct

    • Check all import paths
    • Ensure case-sensitive paths match files

Contact Information

If issue persists, provide:

  1. Browser console screenshot (F12)
  2. Network tab screenshot showing loaded files
  3. Git status output
  4. Browser and OS version

Quick Test

To quickly verify the system is working:

  1. Open game
  2. Hard refresh (Ctrl+Shift+R)
  3. Wait for 10+ enemies to spawn
  4. Move player in circles
  5. Enemies should bounce off each other
  6. If not, check console for errors

Success Indicators

✅ No errors in console ✅ CollisionSystem.js loads (check Network tab) ✅ Enemies have velocity (they accelerate, not instant speed) ✅ Enemies bounce when they touch ✅ Neutrals block enemies when filled