164 lines
5.5 KiB
JavaScript
164 lines
5.5 KiB
JavaScript
/**
|
|
* EXPANSION SYSTEM
|
|
* - Manages Unlockable Zones (Farm, Forest, City...)
|
|
* - Fog of War logic (Visual blocking)
|
|
* - Unlock costs and requirements
|
|
*/
|
|
class ExpansionSystem {
|
|
constructor(scene) {
|
|
this.scene = scene;
|
|
|
|
// Define Zones
|
|
this.zones = {
|
|
'farm': {
|
|
id: 'farm',
|
|
name: 'Starter Farm',
|
|
x: 0, y: 0, w: 40, h: 40, // 0-40 coordinates
|
|
unlocked: true,
|
|
cost: 0,
|
|
color: 0x00FF00
|
|
},
|
|
'forest': {
|
|
id: 'forest',
|
|
name: 'Dark Forest',
|
|
x: 40, y: 0, w: 60, h: 40, // Right of farm
|
|
unlocked: true,
|
|
cost: 100, // 100 Gold Coins
|
|
req: 'None',
|
|
color: 0x006400
|
|
},
|
|
'city': {
|
|
id: 'city',
|
|
name: 'Ruined City',
|
|
x: 0, y: 40, w: 100, h: 60, // Below farm & forest
|
|
unlocked: true,
|
|
cost: 500,
|
|
req: 'Kill Boss',
|
|
color: 0x808080
|
|
}
|
|
};
|
|
|
|
// Fog Graphics
|
|
this.fogGraphics = this.scene.add.graphics();
|
|
this.fogGraphics.setDepth(9999); // Very high depth
|
|
this.fogGraphics.setScrollFactor(1); // Moves with camera? No, world coordinates.
|
|
// wait, graphics draw in world coords? Yes if not scrollFactor 0
|
|
// We want it to cover the world terrain.
|
|
|
|
this.drawFog();
|
|
}
|
|
|
|
/**
|
|
* Unlock a zone
|
|
*/
|
|
unlockZone(zoneId) {
|
|
const zone = this.zones[zoneId];
|
|
if (!zone) return false;
|
|
if (zone.unlocked) return false; // Already unlocked
|
|
|
|
// Check Logic (Payment) would be here or called before.
|
|
// For now, just unlock logic.
|
|
|
|
zone.unlocked = true;
|
|
console.log(`🗺️ Zone Unlocked: ${zone.name}`);
|
|
|
|
// Visual feedback
|
|
this.scene.events.emit('show-floating-text', {
|
|
x: this.scene.player.sprite.x,
|
|
y: this.scene.player.sprite.y - 100,
|
|
text: `UNLOCKED: ${zone.name}`,
|
|
color: '#FFFFFF'
|
|
});
|
|
|
|
// Sound
|
|
if (this.scene.soundManager) this.scene.soundManager.playSuccess(); // Assuming sound exists
|
|
|
|
this.drawFog(); // Redraw fog
|
|
return true;
|
|
}
|
|
|
|
/**
|
|
* Check if player is in an unlocked zone
|
|
* Used for restricting movement or camera
|
|
*/
|
|
isPointUnlocked(x, y) {
|
|
for (const key in this.zones) {
|
|
const z = this.zones[key];
|
|
if (x >= z.x && x < z.x + z.w && y >= z.y && y < z.y + z.h) {
|
|
return z.unlocked;
|
|
}
|
|
}
|
|
return false; // Default blocked
|
|
}
|
|
|
|
/**
|
|
* Draw Fog of War over locked zones
|
|
*/
|
|
drawFog() {
|
|
this.fogGraphics.clear();
|
|
|
|
// Fill semi-transparent black over locked zones
|
|
this.fogGraphics.fillStyle(0x000000, 0.7); // 70% opacity black fog
|
|
|
|
for (const key in this.zones) {
|
|
const z = this.zones[key];
|
|
if (!z.unlocked) {
|
|
// Convert grid coords to world coords logic
|
|
// Isometric conversion might be tricky for rectangular fog on isometric grid.
|
|
// But for simplicity let's assume raw screen overlay or draw huge loose shapes?
|
|
// Actually, our map coordinates (gridX, gridY) map to iso.
|
|
|
|
// Let's try drawing tile-by-tile or chunks? Too slow.
|
|
// Better approach: Draw a huge rectangle? No, iso is diamond shape.
|
|
|
|
// Hack: Just draw simple polygons for now, or use the tile tinting system?
|
|
// Real Fog of War in Iso is complex.
|
|
// Let's stick to "Tinting" locked tiles or something simpler first.
|
|
// Or: Render a shape that covers the locked area logic.
|
|
|
|
// Since our world is 100x100 grid.
|
|
// Zone Forest: x:40, y:0, w:60, h:40.
|
|
|
|
// Let's just draw 'clouds' or text over locked areas?
|
|
// Or simplified: Just don't let player walk there.
|
|
|
|
// Let's skip heavy graphics fog for now and just add Floating Text Labels
|
|
// "LOCKED AREA: FOREST" over the center.
|
|
|
|
// Drawing 4 points of the zone in iso:
|
|
const p1 = this.scene.iso.toScreen(z.x, z.y);
|
|
const p2 = this.scene.iso.toScreen(z.x + z.w, z.y);
|
|
const p3 = this.scene.iso.toScreen(z.x + z.w, z.y + z.h);
|
|
const p4 = this.scene.iso.toScreen(z.x, z.y + z.h);
|
|
|
|
const offX = this.scene.terrainOffsetX;
|
|
const offY = this.scene.terrainOffsetY;
|
|
|
|
const poly = new Phaser.Geom.Polygon([
|
|
p1.x + offX, p1.y + offY,
|
|
p2.x + offX, p2.y + offY,
|
|
p3.x + offX, p3.y + offY,
|
|
p4.x + offX, p4.y + offY
|
|
]);
|
|
|
|
this.fogGraphics.fillPoints(poly.points, true);
|
|
|
|
// Add label? (We'd need to manage text objects separately, simple redraw is easier)
|
|
}
|
|
}
|
|
}
|
|
|
|
update(delta) {
|
|
// Maybe check if player tries to enter locked zone and push back?
|
|
if (this.scene.player) {
|
|
const p = this.scene.player;
|
|
if (!this.isPointUnlocked(p.gridX, p.gridY)) {
|
|
// Player is in locked zone! Push back!
|
|
// Simple bounce back logic
|
|
// Or just show warning
|
|
// console.log("Player in locked zone!");
|
|
}
|
|
}
|
|
}
|
|
}
|