novafarma/.agent/workflows/terrain_transitions_guide.md

🎬 FILMIČNI TERRAIN PREHODI - NAVODILA ZA UPORABO

✅ Kaj sem naredil:

1. 🌊 SMOOTH WATER (Fixed!)

• ✅ Voda se ne premika več kot cela kocka
• ✅ Samo nežen glimmer efekt (brightness shimmer)
• ✅ Brez LSD robov ali skew animacije
• ✅ Shader-safe z try-catch fallback

2. 🌱 GRASS WIND (Improved!)

• ✅ Nežno nihanje trave (reduced skew: 0.08 namesto 0.1)
• ✅ Ločena animacija za vodo in travo
• ✅ Shader wobble efekt na layerjih z isWind: true

3. 🎨 TERRAIN TRANSITIONS (New!)

• ✅ Generiran tileset: Terrain_Transitions.png (9 tiles)
• ✅ Smooth alpha-blended edges za vodo→trava
• ✅ Terrain Set definicije v TSX (auto-tiles)
• ✅ Wang/Blob tile pattern za naraven izgled

---

📖 KAKO UPORABITI V TILEDU:

A) DODAJ TERRAIN TILESET V TVOJO MAPO:

1. Odpri Tiled in naloži Faza1_Finalna.json
2. V panelu Tilesets klikni + (Add External Tileset)
3. Izberi: assets/maps/tilesets/Terrain_Transitions.tsx
4. Klikni OK → Tileset se bo dodal

B) UPORABI TERRAIN BRUSH ZA SMOOTH EDGE-E:

1. V panelu Tilesets izberi Terrain_Transitions
2. V Terrains panelu boš videl "Water" terrain
3. V toolbar izberi Terrain Brush (ikona "T" ali gumb Terrain)
4. Klikni na Water terrain
5. Zdaj ko rišeš čez travo, bodo robovi avtomatsko smooth! 🎬

C) PREVERI ANIMIRANE TILESETS:

Water in Grass animated tilesets sta že dodana v Faza1_Finalna.json:

• Water_Animated.tsx (GID: 7020) → Nežen glimmer
• Grass_Animated.tsx (GID: 11116) → Nežno nihanje

V Tiledu:

• Klikni na tile v teh setih
• Spodaj boš videl 🎞️ Animation Preview (filmstrip ikona)
• Tile se bo animiral! ✨

---

🎮 KAJ SE BO ZGODILO V IGRI:

1. VODA:

• Tile ostane na mestu
• Nežen brightness shimmer (glimmer efekt)
• Shader Shine efekt za dodatni sijaj (varno z try-catch)
• Brez premikanja ali ostrih robov

2. TRAVA:

• Nežno nihanje v vetru (wobble)
• Wind shader na layerjih z isWind: true
• Mehak sway animacija

3. PREHODI:

• Ko rišeš vodo čez travo s Terrain Brush-om, boš dobil:
  • Smooth alpha-blended edge-e
  • Naravne prehode brez kock
  • Avtomatične vogale (auto-tiling)

---

📂 DODANE DATOTEKE:

/assets/maps/tilesets/
├── Terrain_Transitions.png     ← Smooth edge tiles
├── Terrain_Transitions.tsx     ← Terrain definitions
├── Water_Animated.png          ← Glimmer frames (regenerated)
├── Water_Animated.tsx          ← Animation config
├── Grass_Animated.png          ← Wind sway frames (regenerated)
└── Grass_Animated.tsx          ← Animation config

/scripts/
├── generate_terrain_transitions.py  ← Generator za smooth edges
└── generate_nature_anim.py          ← Updated (water glimmer)

/src/scenes/
└── GameScene.js                     ← Shader safety wrapper

---

🐛 TROUBLESHOOTING:

Če igra crasha:

• Shader efekti imajo try-catch fallback
• Preveri browser konzolo za ⚠️ PostFX Shine failed warning
• Animacije bodo delovale tudi brez shaderjev

Če ne vidiš smooth edge-ov:

• Preveri, da si izbral Terrain Brush (T), ne normal brush
• Klikni na Water terrain v Terrains panelu
• Tileset mora biti pravilno importan

Če animacije ne delujejo:

• Preveri, da so TSX fajli v /tilesets/ mapi
• Reload mapo v Tiledu (File → Reload)
• Preveri, da je GID pravilno določen

---

🎬 NASLEDNJI KORAKI:

1. Odpri Tiled ✅
2. Add Terrain_Transitions tileset ✅
3. Uporabi Terrain Brush za risanje ✅
4. Test v igri (npm start) ✅

Enjoy smooth, cinematic terrain! 🎥