Add QUICK_DEMO_GUIDE.md - Testing guide for all 4 new systems

Added comprehensive demo guide for:
-  Lighting System (shadows, torch, campfires)
-  Weather Enhancements (wind, transitions)
-  UI Polish (tooltips, animations)
-  Particle Effects (craft, harvest, dig, plant)

Includes:
- In-game testing instructions
- Console commands for manual testing
- Troubleshooting section
- All-in-one spectacular demo script
This commit is contained in:
2025-12-15 16:47:27 +01:00
parent 8c0cc90908
commit 0d78181479

199
docs/QUICK_DEMO_GUIDE.md Normal file
View File

@@ -0,0 +1,199 @@
# 🎮 QUICK DEMO GUIDE - NEW FEATURES
**Date:** 15.12.2025
**Systems:** Lighting, Weather, UI, Particles
---
## ✨ **HOW TO TEST ALL 4 NEW SYSTEMS:**
### 1⃣ **💡 Dynamic Lighting & Shadows**
**Player Shadow:**
- Move your player around
- **Watch:** Shadow follows beneath player
- **Notice:** Shadow is darker during day, lighter at night
**Auto-Torch at Night:**
1. Open console (F12)
2. Type: `this.scene.scenes[1].weatherSystem.gameTime = 21`
3. Press Enter
4. **Watch:** Warm flickering glow appears around player!
5. Reset: `this.scene.scenes[1].weatherSystem.gameTime = 12`
**Manual Light Test (Console):**
```javascript
// Create campfire
this.scene.scenes[1].lightingSystem.createCampfire(500, 300);
// Create custom light
this.scene.scenes[1].lightingSystem.createLight(600, 300, 120, 0xff00ff, 0.5, true);
```
---
### 2⃣ **🌬️ Wind-Affected Weather**
**Wind System:**
1. Press **R** key to toggle rain
2. **Watch:** Rain particles drift horizontally (not just straight down!)
3. Wait 5-10 seconds
4. **Notice:** Wind direction changes gradually
5. Rain angle shifts over time
**Check Wind Info (Console):**
```javascript
const wind = this.scene.scenes[1].weatherEnhancements.getWindInfo();
console.log(`Wind: ${wind.speedKmh} km/h from ${wind.directionName}`);
```
**Smooth Weather Transition (Console):**
```javascript
// Smooth fade from clear to rain
this.scene.scenes[1].weatherEnhancements.transitionWeather('clear', 'rain', () => {
console.log('Weather changed smoothly!');
});
```
---
### 3⃣ **🎨 Complete UI Animation Toolkit**
**Tooltip Test (Console):**
```javascript
const uiPolish = this.scene.scenes[1].uiPolish;
// Show tooltip
uiPolish.showTooltip(400, 300, "Hello World!\nThis is a tooltip!", {
backgroundColor: '#FF0000',
textColor: '#FFFFFF',
fontSize: '18px'
});
// Hide after 3 seconds
setTimeout(() => uiPolish.hideTooltip(), 3000);
```
**Number Animation (Console):**
```javascript
const scene = this.scene.scenes[1];
const text = scene.add.text(400, 200, '0', {
fontSize: '48px',
color: '#FFD700',
fontWeight: 'bold'
});
scene.uiPolish.animateNumber(text, 0, 1000, 2000, 'Score: ');
```
**Button Effects (Console):**
```javascript
// Create test button
const scene = this.scene.scenes[1];
const btn = scene.add.rectangle(400, 300, 150, 50, 0x4444ff);
btn.setInteractive();
scene.uiPolish.addButtonHover(btn, 1.2, 200);
// Try hovering over the blue rectangle!
```
**Pulse Effect (Console):**
```javascript
const scene = this.scene.scenes[1];
scene.uiPolish.pulse(scene.player.sprite, 0.95, 1.05, 1000);
```
---
### 4⃣ **✨ Enhanced Particle Effects**
**IN-GAME TESTS:**
**Craft Sparkles:**
1. Press **C** key (open crafting)
2. Craft any item (e.g., Wooden Fence)
3. **Watch:** Golden sparkle burst around player! ✨
**Dig Particles:**
1. Equip hoe (if available)
2. Click on grass tile
3. **Watch:** Brown soil particles spray upward! 💨
**Plant Sparkles:**
1. Plant seeds on tilled soil
2. **Watch:** Green sparkles appear! 🌱
**Harvest Burst:**
1. Wait for crop to grow (or speed up time)
2. Harvest mature crop
3. **Watch:** Colored particle burst! 🌾
- Wheat → Golden particles
- Carrot → Orange particles
**CONSOLE TESTS:**
```javascript
const particles = this.scene.scenes[1].particleEnhancements;
// Level up effect (spectacular!)
particles.levelUpEffect(400, 300);
// Damage impact (red burst)
particles.damageImpact(450, 300, 0xFF0000);
// Heal effect (rising green sparkles)
particles.healEffect(350, 300);
// Craft sparkles (golden)
particles.craftSparkles(400, 250);
// Harvest burst with different crops
particles.harvestBurst(500, 300, 'wheat'); // Golden
particles.harvestBurst(300, 300, 'carrot'); // Orange
```
---
## 🎯 **QUICK ALL-IN-ONE TEST:**
**Run this in console for a spectacular show:**
```javascript
const scene = this.scene.scenes[1];
// 1. Create lights
scene.lightingSystem.createCampfire(300, 250);
scene.lightingSystem.createCampfire(500, 250);
// 2. Start rain with wind
scene.weatherSystem.startRain(false);
// 3. Level up effect
scene.particleEnhancements.levelUpEffect(400, 300);
// 4. Create tooltip
setTimeout(() => {
scene.uiPolish.showTooltip(400, 200, "✨ ALL SYSTEMS ACTIVE! ✨", {
backgroundColor: '#4444ff',
textColor: '#ffffff',
fontSize: '24px'
});
}, 2000);
console.log("🎉 All 4 systems demonstrated!");
```
---
## 🐛 **TROUBLESHOOTING:**
**If effects don't appear:**
1. Check console for errors (F12)
2. Verify systems loaded:
```javascript
console.log(this.scene.scenes[1].lightingSystem ? '✅ Lighting' : '❌ Lighting');
console.log(this.scene.scenes[1].weatherEnhancements ? '✅ Weather' : '❌ Weather');
console.log(this.scene.scenes[1].uiPolish ? '✅ UI' : '❌ UI');
console.log(this.scene.scenes[1].particleEnhancements ? '✅ Particles' : '❌ Particles');
```
---
**Enjoy your enhanced game!** 🎮✨