# 🗺️ TESTIRANJE TILED MAPE V IGRI

**Cilj:** Naložiti `micro_farm_128x128.tmx` mapo v Phaser igro za testiranje

---

## 📋 KORAKI:

### 1. **EXPORT MAPE V JSON**

Da lahko Phaser naloži mapo, moraš:

```
Tiled → File → Open → micro_farm_128x128.tmx
File → Export As... → micro_farm_128x128.json
Lokacija: assets/maps/micro_farm_128x128.json
```

---

### 2. **DODAJ V PRELOAD SCENE**

Uredi `src/scenes/PreloadScene.js`:

```javascript
// Dodaj pod linijo 35 (farm_map):
this.load.tilemapTiledJSON('micro_farm_128x128', 'assets/maps/micro_farm_128x128.json');
```

---

### 3. **MOŽNOST A: Testna Scena (Najhitrejše)**

Ustvari novo sceno `src/scenes/TiledTestScene.js`:

```javascript
class TiledTestScene extends Phaser.Scene {
    constructor() {
        super({ key: 'TiledTestScene' });
    }

    create() {
        console.log('🗺️ Tiled Test Scene: Loading micro farm...');

        // Set background color
        this.cameras.main.setBackgroundColor('#87CEEB');

        // Load the tilemap
        const map = this.make.tilemap({ key: 'micro_farm_128x128' });

        // Add tilesets (imena morajo biti ENAKA kot v .tmx!)
        const grassTileset = map.addTilesetImage('grass', 'tileset_grass');
        const dirtTileset = map.addTilesetImage('dirt', 'tileset_dirt');
        const waterTileset = map.addTilesetImage('water', 'tileset_water');
        // Dodaj ostale tilesets po potrebi...

        // Create tile layers
        const groundLayer = map.createLayer('Ground', [grassTileset, dirtTileset, waterTileset], 0, 0);
        
        // Dodaj ostale layerje...
        // const fenceLayer = map.createLayer('Fences', [...tilesets], 0, 0);

        // Set camera bounds
        this.cameras.main.setBounds(0, 0, map.widthInPixels, map.heightInPixels);
        this.cameras.main.setZoom(0.5); // Zoom out za 128x128

        // Camera controls
        const cursors = this.input.keyboard.createCursorKeys();
        this.cursors = cursors;

        console.log('✅ Micro Farm loaded!');
    }

    update() {
        // Camera movement
        const speed = 8;
        if (this.cursors.left.isDown) {
            this.cameras.main.scrollX -= speed;
        } else if (this.cursors.right.isDown) {
            this.cameras.main.scrollX += speed;
        }
        if (this.cursors.up.isDown) {
            this.cameras.main.scrollY -= speed;
        } else if (this.cursors.down.isDown) {
            this.cameras.main.scrollY += speed;
        }
    }
}
```

Dodaj v `src/game.js`:
```javascript
const config = {
    // ...
    scene: [
        PreloadScene,
        TiledTestScene,  // ← DODAJ TO
        StoryScene,
        GameScene,
        UIScene
    ]
};
```

Začasno spremeni `PreloadScene.create()`:
```javascript
create() {
    console.log('✅ PreloadScene: Assets loaded!');
    window.gameState.currentScene = 'PreloadScene';

    // ZAČASNO: Gre naravnost v TiledTestScene
    this.time.delayedCall(500, () => {
        console.log('🗺️ Starting TiledTestScene...');
        this.scene.start('TiledTestScene');  // ← SPREMENI TO
    });
}
```

---

### 4. **MOŽNOST B: Debug Način v GameScene**

Dodaj gumb za toggle v `GameScene.create()`:

```javascript
// Debug: Load Tiled map instead of procedural terrain
this.input.keyboard.on('keydown-M', () => {
    this.loadTiledMap();
});
```

Dodaj metodo v `GameScene`:

```javascript
loadTiledMap() {
    console.log('🗺️ Loading Tiled Map: micro_farm_128x128...');
    
    // Hide procedural terrain
    if (this.terrainSystem && this.terrainSystem.container) {
        this.terrainSystem.container.setVisible(false);
    }

    // Load tilemap
    const map = this.make.tilemap({ key: 'micro_farm_128x128' });
    
    // Add tilesets
    const grassTileset = map.addTilesetImage('grass', 'tileset_grass');
    
    // Create layers
    const groundLayer = map.createLayer('Ground', grassTileset, 0, 0);
    
    // Set camera
    this.cameras.main.setZoom(0.5);
    
    console.log('✅ Tiled map loaded! Press M again to toggle.');
}
```

---

## 🎯 **PRIPOROČILO:**

**Uporabi MOŽNOST A** (Testna scena) - najhitrejše in najčistejše za testiranje!

1. Exportaj JSON iz Tiled
2. Ustvari `TiledTestScene.js`
3. Dodaj v `game.js`
4. Zaženi igro

Takrat boš videl samo svojo micro farm mapo brez ostalih sistemov! 🎉

---

## ✅ **KO DELUJE:**

Ko vidiš mapo:
- Premakni kamero s puščicami
- Preveri, da se prikazujejo vsi tilesets
- Preveri layerje (ograda, tla, player, etc.)

Potem lahko nazaj preklopiš na GameScene ali integriraš Tiled v glavni game!