Asset Generation: Campfire, Tent, Sleeping Bag, UI Elements (Health, Inventory, Dialog). Cleaned GrassScene.

This commit is contained in:
2026-01-28 07:45:24 +01:00
parent b686be33ab
commit 94565adffc
69 changed files with 5208 additions and 122 deletions

View File

@@ -6,158 +6,80 @@ export default class GrassSceneClean extends Phaser.Scene {
preload() {
this.load.path = 'assets/';
// --- CORE ASSETS ---
this.load.image('trava_osnova', 'tiles/trava_osnova.png');
this.load.image('blato', 'environment/blato.png');
this.load.image('cesta', 'environment/cesta_svetla.png');
this.load.image('voda_cista', 'environment/voda_cista.png');
this.load.image('potok_segment', 'environment/potok_segment.png');
// --- ASSETS ---
// 1. Podlaga (Foundation)
this.load.image('ground_base', 'DEMO_FAZA1/Ground/tla_trava_tekstura.png');
// --- VEGETATION ---
this.load.image('trava_zelena', 'vegetation/trava_zelena.png');
this.load.image('trava_suha', 'vegetation/trava_suha.png');
this.load.image('trava_divja', 'vegetation/trava_divja.png');
this.load.image('drevo', 'vegetation/drevo_navadno.png');
// 2. Vodni kanali (Water)
this.load.image('stream_water', 'DEMO_FAZA1/Environment/stream_water.png');
// 3. Foliage
this.load.image('grass_dense', 'DEMO_FAZA1/Vegetation/grass_cluster_dense.png');
this.load.image('grass_tall', 'DEMO_FAZA1/Vegetation/visoka_trava.png');
// 4. Items & Charts
this.load.image('hay', 'DEMO_FAZA1/Items/hay_drop_0.png');
this.load.image('kai', 'characters/kai.png');
this.load.image('campfire', 'items/campfire.png');
this.load.image('sleeping_bag', 'items/sleeping_bag.png');
// Eraser brush (dynamically created if needed, or use blato)
}
create() {
const WORLD_W = 2500;
const WORLD_H = 2500;
this.physics.world.setBounds(0, 0, WORLD_W, WORLD_H);
this.cameras.main.setBounds(0, 0, WORLD_W, WORLD_H);
this.cameras.main.setBackgroundColor('#2e3b20'); // Dark earthy background for the "hole"
this.cameras.main.setBackgroundColor('#1a1a1a');
// --- GROUPS ---
this.waterLayer = this.add.group(); // Z: 0
this.groundLayer = this.add.group(); // Z: 1 (The Masked Layer)
this.objectLayer = this.add.group(); // Z: 2
// --- 1. PODLAGA (The Foundation) ---
// Level 0, Locked to Z = -100
this.ground = this.add.tileSprite(WORLD_W / 2, WORLD_H / 2, WORLD_W, WORLD_H, 'ground_base');
this.ground.setTileScale(1, 1);
this.ground.setDepth(-100);
// --- 1. WATER LAYER (The "Bottom" of the Trench) ---
// We calculate the path first so we know where to put water
const startX = 0, startY = 800;
const endX = 2500, endY = 1800;
const dist = Phaser.Math.Distance.Between(startX, startY, endX, endY);
const count = Math.ceil(dist / 60); // High density for smoothness
// --- 2. VODNI KANALI (Water Integration) ---
// Removed as requested
// Place water along the path (at depth 0)
for (let i = 0; i <= count; i++) {
let t = i / count;
let x = Phaser.Math.Linear(startX, endX, t);
let y = Phaser.Math.Linear(startY, endY, t);
y += Math.sin(t * 12) * 60; // Meander
// --- 3. FOLIAGE (Trava - Šopi) ---
// Removed as requested
// Water Segment
let seg = this.add.image(x, y, 'potok_segment');
seg.setScale(0.9);
seg.setDepth(1); // Layer 1 internally
seg.setAlpha(0.7); // Transparency
seg.setBlendMode(Phaser.BlendModes.NORMAL);
this.waterLayer.add(seg);
// --- 4. ITEMS (Seno) ---
// Removed as requested
// Mud Underlay (Darker depth)
let mud = this.add.image(x, y + 10, 'blato');
mud.setScale(1.0);
mud.setTint(0x1a1a0d); // Very dark/black
mud.setDepth(0); // Layer 0
this.waterLayer.add(mud);
}
// --- 2. GROUND LAYER (The "Top" with a Hole) ---
// We use a RenderTexture to "Stamp out" the river
let rt = this.add.renderTexture(0, 0, WORLD_W, WORLD_H);
rt.setDepth(100); // Visually above water
// Fill RT with the grass tile texture
// Since clear+fill with tileSprite isn't direct in RT, we draw a huge tileSprite once
let hugeBg = this.make.tileSprite({ x: WORLD_W / 2, y: WORLD_H / 2, width: WORLD_W, height: WORLD_H, key: 'trava_osnova' }, false);
hugeBg.setTileScale(0.15);
hugeBg.setTint(0xccffcc);
rt.draw(hugeBg, WORLD_W / 2, WORLD_H / 2);
// NOW ERASE THE RIVER CHANNEL
// "Subtract Mask" logic using erase()
for (let i = 0; i <= count; i++) {
let t = i / count;
let x = Phaser.Math.Linear(startX, endX, t);
let y = Phaser.Math.Linear(startY, endY, t);
y += Math.sin(t * 12) * 60;
// We use 'blato' sprite as an eraser brush because it has a soft alpha shape
let eraser = this.make.image({ x: 0, y: 0, key: 'blato' }, false);
eraser.setScale(0.7); // Slightly narrower than water to show bank edge?
// Actually, if we erase slightly LESS than the water width, the water "slides under" the ground -> Bank Effect!
rt.erase(eraser, x, y);
// Add a visual "Shadow" on top of the cut edge to simulate depth
let shadow = this.add.image(x, y - 5, 'blato');
shadow.setScale(0.8);
shadow.setTint(0x000000);
shadow.setAlpha(0.4);
shadow.setDepth(101); // Right on top of the RT hole
shadow.setBlendMode(Phaser.BlendModes.MULTIPLY);
// This shadow needs to be masked too? No, it sits in the trench.
this.waterLayer.add(shadow);
}
// --- 3. OBJECT LAYER (Y-Sorted) ---
// --- 5. CHAR (Kai) ---
this.kai = this.physics.add.sprite(WORLD_W / 2, WORLD_H / 2, 'kai');
this.kai.setScale(64 / this.kai.height);
this.kai.setCollideWorldBounds(true);
this.kai.setOrigin(0.5, 0.9); // Anchor at feet
this.kai.body.setSize(24, 20);
this.kai.body.setOffset(this.kai.width / 2 - 12, this.kai.height - 20);
this.kai.setOrigin(0.5, 0.9);
this.objectLayer.add(this.kai);
// Camera
this.cameras.main.startFollow(this.kai, true, 0.08, 0.08);
this.cameras.main.setZoom(1.3);
// Control Keys
this.cameras.main.startFollow(this.kai, true, 0.1, 0.1);
this.cameras.main.setZoom(1.5);
this.cursors = this.input.keyboard.createCursorKeys();
// Debug Text
this.add.text(20, 20, 'VISUAL FIX APPLIED:\nSubtraction Mask (RenderTexture Erase)', {
font: '16px Monospace', fill: '#00ff00', backgroundColor: '#000000aa'
}).setScrollFactor(0).setDepth(2000);
// Info
this.add.text(20, 20, 'PROBNA FARMA: Base Only', {
font: '16px Monospace', fill: '#ffffff', backgroundColor: '#000000aa'
}).setScrollFactor(0).setDepth(3000);
}
update() {
// Depth Sort Objects
this.objectLayer.children.each(child => {
child.setDepth(child.y + 2000); // Ensure objects are always above the ground RT (Depth 100)
});
// Controls
const speed = 250;
this.kai.setVelocity(0);
if (this.cursors.left.isDown) this.kai.setVelocityX(-speed);
else if (this.cursors.right.isDown) this.kai.setVelocityX(speed);
if (this.cursors.up.isDown) this.kai.setVelocityY(-speed);
else if (this.cursors.down.isDown) this.kai.setVelocityY(speed);
this.kai.body.velocity.normalize().scale(speed);
// Sunken Legs Logic
// Check overlap with water layer images (crude but effective)
let inWater = false;
this.waterLayer.children.each(w => {
if (this.physics.world.overlap(this.kai, w)) {
// Wait, water images don't have bodies. Use distance.
if (Phaser.Math.Distance.Between(this.kai.x, this.kai.y, w.x, w.y) < 40) inWater = true;
}
});
if (inWater) {
this.kai.setOrigin(0.5, 0.75); // Sunken
this.kai.setTint(0xaaccff);
} else {
this.kai.setOrigin(0.5, 0.9);
this.kai.clearTint();
if (this.kai.body.velocity.length() > 0) {
this.kai.body.velocity.normalize().scale(speed);
}
// --- Z-SORTING SYSTEM ---
// Player
this.kai.setDepth(this.kai.y);
}
}