popravki
This commit is contained in:
@@ -81,6 +81,7 @@
|
||||
<script src="src/systems/InventorySystem.js"></script>
|
||||
<script src="src/systems/LootSystem.js"></script>
|
||||
<script src="src/systems/InteractionSystem.js"></script>
|
||||
<script src="src/utils/InventoryIcons.js"></script> <!-- 2D Flat Icons -->
|
||||
<script src="src/systems/FarmingSystem.js"></script>
|
||||
<script src="src/systems/BuildingSystem.js"></script>
|
||||
<script src="src/systems/WeatherSystem.js"></script>
|
||||
|
||||
@@ -17,6 +17,7 @@ class LootChest {
|
||||
// Create chest sprite (using existing chest texture)
|
||||
this.sprite = this.scene.add.sprite(x, y, 'chest');
|
||||
this.sprite.setOrigin(0.5, 1);
|
||||
this.sprite.setScale(0.1); // Tiny size!
|
||||
this.sprite.setDepth(this.scene.iso.getDepth(this.gridX, this.gridY, this.scene.iso.LAYER_OBJECTS));
|
||||
|
||||
// Golden glow for unopened chests
|
||||
|
||||
@@ -21,6 +21,7 @@ class ZombieSpawner {
|
||||
// Spawner sprite (dark portal/grave)
|
||||
this.sprite = this.scene.add.sprite(x, y, 'gravestone');
|
||||
this.sprite.setOrigin(0.5, 1);
|
||||
this.sprite.setScale(0.1); // Tiny size!
|
||||
this.sprite.setDepth(this.scene.iso.getDepth(this.gridX, this.gridY, this.scene.iso.LAYER_OBJECTS));
|
||||
this.sprite.setTint(0x440044); // Purple tint for spawner
|
||||
|
||||
|
||||
@@ -20,6 +20,7 @@ class GameScene extends Phaser.Scene {
|
||||
|
||||
// Generate procedural textures
|
||||
new TextureGenerator(this).generateAll();
|
||||
InventoryIcons.create(this); // Override with flat 2D inventory icons
|
||||
window.gameState.currentScene = 'GameScene';
|
||||
|
||||
const width = this.cameras.main.width;
|
||||
|
||||
@@ -362,25 +362,28 @@ class UIScene extends Phaser.Scene {
|
||||
// Draw Sprite
|
||||
const sprite = this.add.sprite(x + size / 2, y + size / 2, textureKey);
|
||||
|
||||
// Scale to fit slot (32px slot, maybe 24px icon)
|
||||
const scale = (size - 8) / Math.max(sprite.width, sprite.height);
|
||||
sprite.setScale(scale);
|
||||
// Larger scale for better visibility (fill most of the slot)
|
||||
const scale = (size - 4) / Math.max(sprite.width, sprite.height);
|
||||
sprite.setScale(scale * 1.2); // 20% bigger!
|
||||
|
||||
// Crisp 2D rendering
|
||||
sprite.setTexture(textureKey);
|
||||
|
||||
slotGraphics.itemSprite = sprite;
|
||||
} else {
|
||||
// Fallback Text
|
||||
// Fallback Text - bigger and bolder
|
||||
const text = this.add.text(x + size / 2, y + size / 2,
|
||||
type.substring(0, 2).toUpperCase(),
|
||||
{ fontSize: '12px', align: 'center', color: '#ffff00', stroke: '#000', strokeThickness: 2 }
|
||||
type.substring(0, 3).toUpperCase(),
|
||||
{ fontSize: '16px', align: 'center', color: '#ffff00', stroke: '#000', strokeThickness: 3, fontStyle: 'bold' }
|
||||
).setOrigin(0.5);
|
||||
slotGraphics.itemText = text;
|
||||
}
|
||||
|
||||
// Draw Count (if > 1)
|
||||
// Draw Count (if > 1) - bigger and bolder
|
||||
if (slots[i].count > 1) {
|
||||
const countText = this.add.text(x + size - 2, y + size - 2,
|
||||
slots[i].count.toString(),
|
||||
{ fontSize: '10px', align: 'right', color: '#ffffff', stroke: '#000', strokeThickness: 2 }
|
||||
{ fontSize: '14px', align: 'right', color: '#ffffff', stroke: '#000', strokeThickness: 3, fontStyle: 'bold' }
|
||||
).setOrigin(1, 1);
|
||||
slotGraphics.countText = countText;
|
||||
}
|
||||
|
||||
@@ -331,4 +331,21 @@ class InteractionSystem {
|
||||
update(delta) {
|
||||
// No logic needed here anymore (loot pickup handled by LootSystem)
|
||||
}
|
||||
|
||||
spawnLoot(gridX, gridY, itemType, count = 1) {
|
||||
// Add items directly to inventory instead of spawning physical loot
|
||||
if (this.scene.inventorySystem) {
|
||||
const added = this.scene.inventorySystem.addItem(itemType, count);
|
||||
if (added) {
|
||||
// Visual feedback
|
||||
this.scene.events.emit('show-floating-text', {
|
||||
x: gridX * 48,
|
||||
y: gridY * 48,
|
||||
text: `+${count} ${itemType}`,
|
||||
color: '#00FF00'
|
||||
});
|
||||
console.log(`📦 Spawned ${count}x ${itemType} at ${gridX},${gridY}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
123
src/utils/InventoryIcons.js
Normal file
123
src/utils/InventoryIcons.js
Normal file
@@ -0,0 +1,123 @@
|
||||
// Simple 2D Flat Inventory Icons
|
||||
class InventoryIcons {
|
||||
static create(scene) {
|
||||
const s = 48;
|
||||
|
||||
// Remove old textures
|
||||
const items = ['item_axe', 'item_pickaxe', 'item_hoe', 'item_watering_can',
|
||||
'item_wood', 'item_stone', 'item_seeds', 'item_wheat'];
|
||||
items.forEach(key => {
|
||||
if (scene.textures.exists(key)) scene.textures.remove(key);
|
||||
});
|
||||
|
||||
// AXE - Simple flat brown handle + silver blade
|
||||
const c1 = scene.textures.createCanvas('item_axe', s, s);
|
||||
const ctx1 = c1.getContext();
|
||||
ctx1.fillStyle = '#654321'; // handle
|
||||
ctx1.fillRect(20, 6, 8, 36);
|
||||
ctx1.fillStyle = '#C0C0C0'; // blade
|
||||
ctx1.fillRect(8, 16, 32, 10);
|
||||
ctx1.fillStyle = '#FFFFFF'; // shine
|
||||
ctx1.fillRect(10, 18, 12, 3);
|
||||
c1.refresh();
|
||||
|
||||
// PICKAXE - Brown handle + gray horizontal pick
|
||||
const c2 = scene.textures.createCanvas('item_pickaxe', s, s);
|
||||
const ctx2 = c2.getContext();
|
||||
ctx2.fillStyle = '#654321';
|
||||
ctx2.fillRect(20, 16, 8, 26);
|
||||
ctx2.fillStyle = '#808080';
|
||||
ctx2.fillRect(4, 20, 40, 8);
|
||||
ctx2.fillRect(2, 22, 3, 4); // left point
|
||||
ctx2.fillRect(43, 22, 3, 4); // right point
|
||||
c2.refresh();
|
||||
|
||||
// HOE - L-shape (vertical handle + horizontal blade)
|
||||
const c3 = scene.textures.createCanvas('item_hoe', s, s);
|
||||
const ctx3 = c3.getContext();
|
||||
ctx3.fillStyle = '#654321';
|
||||
ctx3.fillRect(20, 12, 8, 30);
|
||||
ctx3.fillStyle = '#808080';
|
||||
ctx3.fillRect(20, 10, 22, 6);
|
||||
c3.refresh();
|
||||
|
||||
// WATERING CAN - Blue can
|
||||
const c4 = scene.textures.createCanvas('item_watering_can', s, s);
|
||||
const ctx4 = c4.getContext();
|
||||
ctx4.fillStyle = '#4682B4';
|
||||
ctx4.fillRect(12, 20, 24, 18);
|
||||
ctx4.strokeStyle = '#36648B';
|
||||
ctx4.lineWidth = 4;
|
||||
ctx4.beginPath();
|
||||
ctx4.arc(24, 16, 10, 0, Math.PI, true);
|
||||
ctx4.stroke();
|
||||
ctx4.fillStyle = '#4682B4';
|
||||
ctx4.fillRect(36, 26, 8, 4);
|
||||
ctx4.fillStyle = '#00BFFF';
|
||||
ctx4.fillRect(44, 30, 2, 2);
|
||||
ctx4.fillRect(44, 34, 2, 2);
|
||||
c4.refresh();
|
||||
|
||||
// WOOD - Brown log stack
|
||||
const c5 = scene.textures.createCanvas('item_wood', s, s);
|
||||
const ctx5 = c5.getContext();
|
||||
for (let i = 0; i < 3; i++) {
|
||||
ctx5.fillStyle = '#8B4513';
|
||||
ctx5.fillRect(8 + i * 12, 14 + i * 7, 22, 12);
|
||||
ctx5.fillStyle = '#D2691E';
|
||||
ctx5.beginPath();
|
||||
ctx5.arc(10 + i * 12, 20 + i * 7, 5, 0, Math.PI * 2);
|
||||
ctx5.fill();
|
||||
}
|
||||
c5.refresh();
|
||||
|
||||
// STONE - Gray rock pile
|
||||
const c6 = scene.textures.createCanvas('item_stone', s, s);
|
||||
const ctx6 = c6.getContext();
|
||||
ctx6.fillStyle = '#808080';
|
||||
ctx6.beginPath();
|
||||
ctx6.arc(18, 22, 11, 0, Math.PI * 2);
|
||||
ctx6.fill();
|
||||
ctx6.beginPath();
|
||||
ctx6.arc(30, 20, 8, 0, Math.PI * 2);
|
||||
ctx6.fill();
|
||||
ctx6.beginPath();
|
||||
ctx6.arc(24, 34, 9, 0, Math.PI * 2);
|
||||
ctx6.fill();
|
||||
c6.refresh();
|
||||
|
||||
// SEEDS - Beige seed packet
|
||||
const c7 = scene.textures.createCanvas('item_seeds', s, s);
|
||||
const ctx7 = c7.getContext();
|
||||
ctx7.fillStyle = '#F5DEB3';
|
||||
ctx7.fillRect(10, 8, 28, 34);
|
||||
ctx7.fillStyle = '#228B22';
|
||||
ctx7.fillRect(10, 30, 28, 10);
|
||||
ctx7.fillStyle = '#8B7355';
|
||||
for (let i = 0; i < 6; i++) {
|
||||
ctx7.beginPath();
|
||||
ctx7.arc(15 + (i % 3) * 9, 14 + Math.floor(i / 3) * 8, 2, 0, Math.PI * 2);
|
||||
ctx7.fill();
|
||||
}
|
||||
c7.refresh();
|
||||
|
||||
// WHEAT - Golden wheat bundle
|
||||
const c8 = scene.textures.createCanvas('item_wheat', s, s);
|
||||
const ctx8 = c8.getContext();
|
||||
ctx8.strokeStyle = '#DAA520';
|
||||
ctx8.lineWidth = 3;
|
||||
for (let i = 0; i < 5; i++) {
|
||||
ctx8.beginPath();
|
||||
ctx8.moveTo(16 + i * 4, 38);
|
||||
ctx8.lineTo(16 + i * 4, 14);
|
||||
ctx8.stroke();
|
||||
}
|
||||
ctx8.fillStyle = '#FFD700';
|
||||
for (let i = 0; i < 5; i++) {
|
||||
ctx8.fillRect(14 + i * 4, 10, 5, 10);
|
||||
}
|
||||
c8.refresh();
|
||||
|
||||
console.log('✅ 2D Flat inventory icons created!');
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user