203 lines
4.9 KiB
JavaScript
203 lines
4.9 KiB
JavaScript
// ADVANCED BUILD MODE - IMPLEMENTATION
|
|
// Dodaj te metode v BuildSystem.js
|
|
|
|
// 1. ROTATION (R key)
|
|
rotatePreview() {
|
|
this.rotation = (this.rotation + 90) % 360;
|
|
|
|
if (this.previewSprite) {
|
|
this.previewSprite.setAngle(this.rotation);
|
|
}
|
|
|
|
// Sound effect
|
|
if (this.scene.soundManager) {
|
|
this.scene.soundManager.beepUIClick();
|
|
}
|
|
|
|
console.log(`🔄 Building rotated: ${this.rotation}°`);
|
|
}
|
|
|
|
// 2. CONFIRM PLACEMENT (E key)
|
|
confirmPlacement() {
|
|
if (!this.buildMode || !this.previewSprite) return;
|
|
|
|
const gridPos = this.scene.iso.toGrid(
|
|
this.previewSprite.x,
|
|
this.previewSprite.y
|
|
);
|
|
|
|
// Try to place building
|
|
const success = this.placeBuilding(gridPos.x, gridPos.y);
|
|
|
|
if (success) {
|
|
console.log('✅ Building placed!');
|
|
|
|
// Keep build mode active for multiple placements
|
|
this.createPreview();
|
|
}
|
|
}
|
|
|
|
// 3. CANCEL PLACEMENT (ESC key)
|
|
cancelPlacement() {
|
|
if (!this.buildMode) return;
|
|
|
|
this.toggleBuildMode(); // Exit build mode
|
|
|
|
console.log('❌ Build mode cancelled');
|
|
}
|
|
|
|
// 4. BUILDING INVENTORY UI
|
|
showBuildUI() {
|
|
const uiScene = this.scene.scene.get('UIScene');
|
|
if (!uiScene) return;
|
|
|
|
const panelX = 20;
|
|
const panelY = 250;
|
|
const panelWidth = 200;
|
|
|
|
// Background
|
|
this.buildPanel = uiScene.add.graphics();
|
|
this.buildPanel.fillStyle(0x000000, 0.8);
|
|
this.buildPanel.fillRoundedRect(panelX, panelY, panelWidth, 400, 8);
|
|
this.buildPanel.setScrollFactor(0);
|
|
this.buildPanel.setDepth(1000);
|
|
|
|
// Title
|
|
this.buildTitle = uiScene.add.text(
|
|
panelX + panelWidth / 2,
|
|
panelY + 10,
|
|
'🏗️ BUILDINGS',
|
|
{
|
|
fontSize: '16px',
|
|
fontStyle: 'bold',
|
|
color: '#ffff00'
|
|
}
|
|
);
|
|
this.buildTitle.setOrigin(0.5, 0);
|
|
this.buildTitle.setScrollFactor(0);
|
|
this.buildTitle.setDepth(1001);
|
|
|
|
// Building list
|
|
this.buildingButtons = [];
|
|
let yOffset = 40;
|
|
|
|
Object.entries(this.buildings).forEach(([id, building]) => {
|
|
// Button background
|
|
const btn = uiScene.add.rectangle(
|
|
panelX + panelWidth / 2,
|
|
panelY + yOffset,
|
|
panelWidth - 20,
|
|
40,
|
|
this.selectedBuilding === id ? 0x00ff00 : 0x333333
|
|
);
|
|
btn.setInteractive({ useHandCursor: true });
|
|
btn.setScrollFactor(0);
|
|
btn.setDepth(1001);
|
|
|
|
// Building name
|
|
const name = uiScene.add.text(
|
|
panelX + 15,
|
|
panelY + yOffset - 15,
|
|
building.name,
|
|
{
|
|
fontSize: '14px',
|
|
color: '#ffffff'
|
|
}
|
|
);
|
|
name.setScrollFactor(0);
|
|
name.setDepth(1002);
|
|
|
|
// Cost
|
|
const costText = Object.entries(building.cost)
|
|
.map(([res, amt]) => `${amt} ${res}`)
|
|
.join(', ');
|
|
|
|
const cost = uiScene.add.text(
|
|
panelX + 15,
|
|
panelY + yOffset + 5,
|
|
costText,
|
|
{
|
|
fontSize: '10px',
|
|
color: '#aaaaaa'
|
|
}
|
|
);
|
|
cost.setScrollFactor(0);
|
|
cost.setDepth(1002);
|
|
|
|
// Click handler
|
|
btn.on('pointerdown', () => {
|
|
this.selectBuilding(id);
|
|
this.hideBuildUI();
|
|
this.showBuildUI(); // Refresh
|
|
});
|
|
|
|
this.buildingButtons.push({ btn, name, cost });
|
|
yOffset += 50;
|
|
});
|
|
|
|
// Instructions
|
|
this.buildInstructions = uiScene.add.text(
|
|
panelX + panelWidth / 2,
|
|
panelY + 380,
|
|
'R: Rotate\nE: Place\nESC: Cancel',
|
|
{
|
|
fontSize: '12px',
|
|
color: '#ffff00',
|
|
align: 'center'
|
|
}
|
|
);
|
|
this.buildInstructions.setOrigin(0.5, 0);
|
|
this.buildInstructions.setScrollFactor(0);
|
|
this.buildInstructions.setDepth(1001);
|
|
|
|
console.log('🏗️ Build UI shown');
|
|
}
|
|
|
|
hideBuildUI() {
|
|
if (this.buildPanel) {
|
|
this.buildPanel.destroy();
|
|
this.buildPanel = null;
|
|
}
|
|
|
|
if (this.buildTitle) {
|
|
this.buildTitle.destroy();
|
|
this.buildTitle = null;
|
|
}
|
|
|
|
if (this.buildInstructions) {
|
|
this.buildInstructions.destroy();
|
|
this.buildInstructions = null;
|
|
}
|
|
|
|
if (this.buildingButtons) {
|
|
this.buildingButtons.forEach(({ btn, name, cost }) => {
|
|
btn.destroy();
|
|
name.destroy();
|
|
cost.destroy();
|
|
});
|
|
this.buildingButtons = [];
|
|
}
|
|
}
|
|
|
|
// POSODOBI toggleBuildMode() metodo:
|
|
toggleBuildMode() {
|
|
this.buildMode = !this.buildMode;
|
|
console.log(`Build Mode: ${this.buildMode ? 'ON' : 'OFF'}`);
|
|
|
|
// Show/hide preview
|
|
if (this.buildMode) {
|
|
this.createPreview();
|
|
this.showBuildUI(); // Dodaj UI
|
|
} else {
|
|
this.destroyPreview();
|
|
this.hideBuildUI(); // Skrij UI
|
|
}
|
|
|
|
return this.buildMode;
|
|
}
|
|
|
|
// DODAJ V constructor():
|
|
// this.rotation = 0;
|
|
// this.buildPanel = null;
|
|
// this.buildingButtons = [];
|