arch_agent/aether-chronicles
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: const redeclaration bug + bare ctx references

Browse Source 
- Remove duplicate const TILE_HEIGHT/TILE_WIDTH in player.js and game.js
- Use var TILE_HEIGHT_PLAYER in player.js to avoid collision
- Fix bare ctx → this.ctx in monster render
- Fix ctx = this.ctx → const ctx = this.ctx in NPC render

This was causing a SyntaxError that prevented the entire game from loading.
This commit is contained in:
arch_agent
2026-07-17 20:42:39 +02:00
parent face8023a4
commit 3890395885
2 changed files with 15 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/js/game.js
+4 -7
View File
@@ -1,8 +1,5 @@
// game.js — Main Game Loop
const TILE_WIDTH = 64;
const TILE_HEIGHT = 32;
class Game {
constructor() {
this.canvas = document.getElementById('game-canvas');
@@ -336,7 +333,7 @@ class Game {
class_master: '#8a4a8a',
innkeeper: '#8a8a4a'
};
ctx = this.ctx;
const ctx = this.ctx;
ctx.fillStyle = colors[npc.type] || '#666';
ctx.fillRect(drawX - 5, drawY + TILE_HEIGHT/2 - 15, 10, 12);
ctx.fillStyle = '#e0b890';
@@ -374,9 +371,9 @@ class Game {
this.ctx.fillStyle = '#666';
this.ctx.fillRect(drawX - 6, drawY + TILE_HEIGHT/2 - 10, 12, 8);
this.ctx.fillStyle = '#555';
ctx.beginPath();
ctx.arc(drawX, drawY + TILE_HEIGHT/2 - 12, 5, 0, Math.PI * 2);
ctx.fill();
this.ctx.beginPath();
this.ctx.arc(drawX, drawY + TILE_HEIGHT/2 - 12, 5, 0, Math.PI * 2);
this.ctx.fill();
// Eyes (red)
this.ctx.fillStyle = '#ff3333';
frontend/js/player.js
+11 -12
View File
@@ -1,5 +1,7 @@
// player.js — Player character with stats
var TILE_HEIGHT_PLAYER = 32;
class Player {
constructor(x, y) {
this.x = x;
@@ -145,7 +147,7 @@ class Player {
// Shadow
ctx.fillStyle = 'rgba(0,0,0,0.3)';
ctx.beginPath();
ctx.ellipse(drawX, drawY + TILE_HEIGHT/2 + 4, 12, 4, 0, 0, Math.PI * 2);
ctx.ellipse(drawX, drawY + TILE_HEIGHT_PLAYER/2 + 4, 12, 4, 0, 0, Math.PI * 2);
ctx.fill();
// Body (simple character)
@@ -153,37 +155,37 @@ class Player {
// Legs
ctx.fillStyle = '#4a4a6a';
ctx.fillRect(drawX - 5, drawY + TILE_HEIGHT/2 - 8 + bobOffset, 4, 8);
ctx.fillRect(drawX + 1, drawY + TILE_HEIGHT/2 - 8 + bobOffset, 4, 8);
ctx.fillRect(drawX - 5, drawY + TILE_HEIGHT_PLAYER/2 - 8 + bobOffset, 4, 8);
ctx.fillRect(drawX + 1, drawY + TILE_HEIGHT_PLAYER/2 - 8 + bobOffset, 4, 8);
// Body
ctx.fillStyle = '#5566aa';
ctx.fillRect(drawX - 7, drawY + TILE_HEIGHT/2 - 18 + bobOffset, 14, 12);
ctx.fillRect(drawX - 7, drawY + TILE_HEIGHT_PLAYER/2 - 18 + bobOffset, 14, 12);
// Head
ctx.fillStyle = '#e0b890';
ctx.beginPath();
ctx.arc(drawX, drawY + TILE_HEIGHT/2 - 22 + bobOffset, 7, 0, Math.PI * 2);
ctx.arc(drawX, drawY + TILE_HEIGHT_PLAYER/2 - 22 + bobOffset, 7, 0, Math.PI * 2);
ctx.fill();
// Hair (black)
ctx.fillStyle = '#1a1a1a';
ctx.beginPath();
ctx.arc(drawX, drawY + TILE_HEIGHT/2 - 24 + bobOffset, 7, Math.PI, Math.PI * 2);
ctx.arc(drawX, drawY + TILE_HEIGHT_PLAYER/2 - 24 + bobOffset, 7, Math.PI, Math.PI * 2);
ctx.fill();
ctx.fillRect(drawX - 7, drawY + TILE_HEIGHT/2 - 22 + bobOffset, 14, 3);
ctx.fillRect(drawX - 7, drawY + TILE_HEIGHT_PLAYER/2 - 22 + bobOffset, 14, 3);
// Name label
ctx.fillStyle = '#ffcc44';
ctx.font = '11px sans-serif';
ctx.textAlign = 'center';
ctx.fillText(this.name, drawX, drawY + TILE_HEIGHT/2 - 32);
ctx.fillText(this.name, drawX, drawY + TILE_HEIGHT_PLAYER/2 - 32);
// HP bar above character
const hpPercent = this.hp / this.maxHp;
const barWidth = 24;
const barX = drawX - barWidth / 2;
const barY = drawY + TILE_HEIGHT/2 - 38;
const barY = drawY + TILE_HEIGHT_PLAYER/2 - 38;
ctx.fillStyle = '#333';
ctx.fillRect(barX, barY, barWidth, 3);
@@ -191,6 +193,3 @@ class Player {
ctx.fillRect(barX, barY, barWidth * hpPercent, 3);
}
}
// TILE_WIDTH constant for player rendering
const TILE_HEIGHT = 32;