Update: Island System Phase 1, Ocean Visualization, UI Visibility, Electron Build Fixes

This commit is contained in:
2026-02-08 07:55:00 +01:00
parent e0be842c85
commit 019a28e7e4
10 changed files with 164 additions and 67 deletions

Binary file not shown.

View File

@@ -58,3 +58,21 @@
### Dokumentacija
* **SESSION_DIARY.md:** Zapisan dnevnik seje (25. Jan 2026) - Asset Marathon.
* **COLLECTORS_ALBUM_SYSTEM.md:** Definiran sistem za Zbirateljski Album (Rastline, Ribe, Insekti, Rude, Zombiepedia).
## [2026-02-08] - Island System & Electron Build Fixes
### Spremenjeno / Dodano
* **Island System Phase 1:**
* **Otok:** Igralno območje omejeno na otok velikosti 20x20 ploščic.
* **Ocean:** Implementiran kot programsko narisan pravokotnik (`this.add.rectangle`) temno modre barve (`0x004488`), brez uporabe zunanjih slik za vodo.
* **Vizualni Rob (Cliff):** Dodan rob otoka z uporabo `tileSprite` (tekstura `ground_base`, obarvana temno rjavo `0x5C4033`) za videz zemlje/visoke pečine.
* **Senca:** Dodana senca pod otokom za 3D učinek lebdenja nad vodo.
* **Omejitve:** Dodane fizikalne meje (World Bounds), ki preprečujejo hojo v vodo.
* **Čiščenje Scene (Clean Slate):**
* **Odstranjeno:** Popolnoma odstranjena koda za stare ribnike (spodaj), realistična drevesa in ozadje z "lužami" (`water_clean_patch`).
* **Vegetacija:** Onemogočena trava in drevesa za čist začetek.
* **UI Izboljšave:**
* **Vidljivost:** Povečan `scale` (1.0) in `padding` (60px) za vse UI elemente (Health, Weather, Minimap, Hotbar), da so bolje vidni na namizni aplikaciji.
* **Electron Build Fixes:**
* **Stabilnost:** Dodani flagi `disableHardwareAcceleration`, `no-sandbox`, `disable-gpu` v `electron-main.cjs` za preprečevanje "Black Screen" težav na macOS.
* **Loading:** Prehod na `file://` protokol z absolutnimi potmi za zanesljivo nalaganje assetov v build verziji.
* **ASAR:** Onemogočen (`asar: false`) v `package.json` za lažje debugiranje in dostop do datotek.

View File

@@ -0,0 +1,49 @@
# Master Game Bible - Nova Farma
## 1. Game Overview
**Title:** Nova Farma
**Genre:** Survival / Farming Simulation / Isometric RPG
**Platform:** Desktop (Electron/Phaser 3)
**Visual Style:** Pixel Art (Isometric/Top-Down Hybrid)
## 2. Core World System: The Island
The game world has been refactored from a continuous map to an **Island System**.
- **Playable Area:** A central island (20x20 tiles) defined by coordinate bounds.
- **Boundaries:** Hard collision limits prevent the player from walking off into the ocean.
- **Ocean:**
- Code-drawn deep blue rectangle (`0x004488`) surrounds the island.
- No external image assets are used for the water background to keep it clean and procedural.
- **Elevation:**
- A visual "cliff" effect is created using a dark brown (`0x5C4033`) tileSprite (`ground_base`) shifted 15px down.
- A shadow rectangle (`0x000000`, alpha 0.3) simulates height above the water.
## 3. Characters
- **Kai:** Main protagonist. Uses a spritesheet for animations.
- **Gronk:** Secondary character/NPC. Uses a dedicated spritesheet.
## 4. UI & UX
- **HUD:**
- Health Bar (Top Left)
- Weather Widget (Top Right)
- Minimap (Bottom Right)
- Hotbar (Bottom Center)
- **Visibility:** All UI elements have increased padding (60px) and scale (1.0) for better readability on desktop screens.
## 5. Technical Stack
- **Engine:** Phaser 3
- **Wrapper:** Electron (v28.3.3)
- **Build System:** electron-builder
- **Critical Configurations:**
- `disableHardwareAcceleration`: Enabled to prevent black screen issues on macOS.
- `no-sandbox` & `disable-gpu`: Added for stability.
- `asar: false`: Disabled to prevent file loading issues with local assets.
- File Loading: Uses `file://` protocol with absolute paths in `electron-main.cjs`.
## 6. Asset Management
- **Vegetation:** Realistic trees and dense grass have been disabled/removed per "Clean Slate" approach.
- **Water:** Ponds and puddles removed. Only the surrounding ocean exists.
- **Ground:** Uses `ground_base` (dirt/grass hybrid) as the primary floor tile.
## 7. Future Expansion (Planned)
- **Bridge Hook:** Coordinates reserved on the right edge of the island for a future bridge to "The City" or other islands.
- **Interaction:** "Look at Ocean" idle animation to be implemented when approaching the edge.

Binary file not shown.

Binary file not shown.

View File

@@ -1,6 +1,13 @@
const { app, BrowserWindow } = require('electron');
const path = require('path');
// --- STABILITY FIXES ---
// Fix for "GPU process exited unexpectedly" and black screen issues
// app.disableHardwareAcceleration(); // CAUSES GARBAGE TEXT?
app.commandLine.appendSwitch('no-sandbox');
app.commandLine.appendSwitch('disable-gpu'); // Try just disabling GPU
// app.commandLine.appendSwitch('disable-software-rasterizer');
function createWindow() {
const win = new BrowserWindow({
width: 1280,
@@ -14,7 +21,16 @@ function createWindow() {
icon: path.join(__dirname, 'assets/DEMO_FAZA1/Characters/gronk_walk_sheet.png')
});
win.loadFile('index.html');
// Revert to relative path which usually works better in ASAR
// win.loadFile('index.html');
// Robust file loading using loadURL and absolute path
win.loadURL('file://' + path.join(__dirname, 'index.html'));
// Redirect renderer logs to terminal
win.webContents.on('console-message', (event, level, message, line, sourceId) => {
console.log(`[Renderer] ${message} (${sourceId}:${line})`);
});
// Uncomment to open DevTools by default
win.webContents.openDevTools();

View File

@@ -25,4 +25,4 @@
<script type="module" src="./src/game.js"></script>
</body>
</html>
</html>

View File

@@ -29,6 +29,7 @@
"target": ["dmg", "zip"],
"icon": "assets/DEMO_FAZA1/Characters/gronk_walk_sheet.png"
},
"asar": false,
"win": {
"target": "nsis",
"icon": "assets/DEMO_FAZA1/Characters/gronk_walk_sheet.png"

View File

@@ -12,7 +12,7 @@ export default class GrassSceneClean extends Phaser.Scene {
// 2. Vodni kanali (Water)
this.load.image('water_clean_patch', 'DEMO_FAZA1/Environment/water_clean_patch.png');
// this.load.image('river_tile_seamless', 'DEMO_FAZA1/Environment/river_tile_seamless.png');
this.load.image('river_tile_seamless', 'DEMO_FAZA1/Environment/river_tile_seamless.png');
// 3. Foliage
// "Divja trava" - samo visoka trava
@@ -80,56 +80,75 @@ export default class GrassSceneClean extends Phaser.Scene {
holeGfx.generateTexture('hole', 128, 128);
}
// --- WORLD CONFIGURATION ---
// --- WORLD CONFIGURATION (ISLAND SYSTEM) ---
const TILE_SIZE = 128; // Standard grid size
const MAP_WIDTH_TILES = 250;
const MAP_HEIGHT_TILES = 250;
const WORLD_W = MAP_WIDTH_TILES * TILE_SIZE; // 32000 px
const WORLD_H = MAP_HEIGHT_TILES * TILE_SIZE; // 32000 px
// Island Dimensions (Playable Area)
const ISLAND_WIDTH_TILES = 20;
const ISLAND_HEIGHT_TILES = 20;
const ISLAND_W = ISLAND_WIDTH_TILES * TILE_SIZE; // 2560 px
const ISLAND_H = ISLAND_HEIGHT_TILES * TILE_SIZE; // 2560 px
this.physics.world.setBounds(0, 0, WORLD_W, WORLD_H);
// World/Ocean Dimensions (Large Buffer)
const WORLD_W = 10000;
const WORLD_H = 10000;
const ISLAND_X = (WORLD_W - ISLAND_W) / 2;
const ISLAND_Y = (WORLD_H - ISLAND_H) / 2;
// Set World Bounds to Island only (Hard Stop)
this.physics.world.setBounds(ISLAND_X, ISLAND_Y, ISLAND_W, ISLAND_H);
// Camera Bounds allow seeing deep water
this.cameras.main.setBounds(0, 0, WORLD_W, WORLD_H);
this.cameras.main.setBackgroundColor('#3a5f0b'); // Grass Green Background
this.cameras.main.setBackgroundColor('#001d3d'); // Deep Blue Ocean
// --- ZOOM CONTROL ---
this.cameras.main.setZoom(0.8); // Default start zoom (Wider view per user request)
this.cameras.main.setZoom(0.8);
this.input.on('wheel', (pointer, gameObjects, deltaX, deltaY, deltaZ) => {
// MACBOOK OPTIMIZATION: Prevent Zoom when hovering over Editor Sidebar
/* REMOVED - Editor disabled
if (this.editorEnabled) {
const SIDEBAR_W = 320;
const PALETTE_X = this.scale.width - SIDEBAR_W;
if (pointer.x > PALETTE_X) {
return; // Stop processing zoom if over sidebar
}
}
*/
// Zoom In/Out based on wheel delta
// deltaY > 0 means scroll down (zoom out), deltaY < 0 means scroll up (zoom in)
const zoomFactor = -0.001;
const newZoom = this.cameras.main.zoom + deltaY * zoomFactor;
// Clamp zoom to reasonable limits (Extended range)
this.cameras.main.setZoom(Phaser.Math.Clamp(newZoom, 0.2, 5.0));
});
// --- 1. PODLAGA (The Foundation) ---
// ZAMENJANO: Zelena barva ozadja + trava tekstura
// --- 1. OCEAN (Background) ---
// DRAWN via Code (Rectangle) - No Image/Sprite used per user request ("ne dodajaj slik... ti narisal")
this.ocean = this.add.rectangle(
WORLD_W/2, WORLD_H/2,
WORLD_W, WORLD_H,
0x004488 // Deep Blue Color
);
this.ocean.setDepth(-200);
// --- 2. ISLAND BASE (The Land) ---
// 1. Nastavimo barvo ozadja na temno zeleno (da se ujema s travo)
this.cameras.main.setBackgroundColor('#2d4c1e');
// FIX: Ensure background covers max zoom out (0.2)
// Viewport at 0.2 zoom is 5x larger (1920 * 5 = 9600)
const BG_W = this.scale.width * 6; // Safety margin
const BG_H = this.scale.height * 6;
// 2. Uporabimo novo sliko za tileSprite (Grass Base)
this.ground = this.add.tileSprite(this.scale.width / 2, this.scale.height / 2, BG_W, BG_H, 'ground_base');
this.ground.setScrollFactor(0); // Sticks to camera
// A. Shadow (Senca na vodi) - Depth perception (Distance from water)
this.islandShadow = this.add.rectangle(
WORLD_W/2 + 40, WORLD_H/2 + 40, // Larger offset for height
ISLAND_W, ISLAND_H,
0x000000, 0.3 // User requested alpha 0.3
);
this.islandShadow.setDepth(-120);
// B. Cliff/Thickness (Rob/Višina) - The physical side of the island
// Changed to tileSprite with Earth Tint per user request ("naredi zemljo")
this.islandCliff = this.add.tileSprite(
WORLD_W/2, WORLD_H/2 + 15, // Shifted down more (15px) for visible cliff face
ISLAND_W, ISLAND_H,
'ground_base'
);
this.islandCliff.setTint(0x5C4033); // Dark Brown / Earth Textures
this.islandCliff.setDepth(-110);
// C. The Actual Ground (Trava)
this.ground = this.add.tileSprite(WORLD_W/2, WORLD_H/2, ISLAND_W, ISLAND_H, 'ground_base');
this.ground.setDepth(-100);
this.ground.setTileScale(1.0);
// --- BRIDGE HOOK (Expansion Architecture) ---
// Placeholder for future bridge connection
// const bridgeX = ISLAND_X + ISLAND_W; // Right edge
// const bridgeY = ISLAND_Y + ISLAND_H / 2;
// --- SCALE TEST ---
// Za testiranje velikosti teksture:
@@ -146,11 +165,8 @@ export default class GrassSceneClean extends Phaser.Scene {
// --- 2. RIVER SYSTEM (REMOVED) ---
// --- NEW: STATIC WATER POND (Ribnik) ---
// Dodano nazaj na zahtevo uporabnika (posodobljen asset)
this.pond = this.add.image(WORLD_W / 2 + 400, WORLD_H / 2 + 200, 'water_clean_patch');
this.pond.setDepth(-45); // Malo nad tlemi
this.pond.setScale(1.5);
this.physics.add.existing(this.pond, true); // Static physics body
// Removed permanently per user request
// --- CELLAR ENTRANCE (Hole) ---
// Na poziciji Kai-a (WORLD_W / 2, WORLD_H / 2)
@@ -217,7 +233,7 @@ export default class GrassSceneClean extends Phaser.Scene {
// --- INTRO SEQUENCE STATE ---
this.introStarted = false;
const GRASS_COUNT = 2000; // Restored per user request
const GRASS_COUNT = 0; // Disabled per user request (was 2000)
const SPREAD = 4000; // 4000px radius okoli centra
// Parametri za izločanje trave (Pond & Hole)
@@ -270,7 +286,7 @@ export default class GrassSceneClean extends Phaser.Scene {
}
// --- TREE PLANTATION (Initial Phase) ---
const TREE_COUNT = 50;
const TREE_COUNT = 0; // Disabled per user request (was 50)
for (let i = 0; i < TREE_COUNT; i++) {
let x = (WORLD_W / 2) + (Math.random() * SPREAD * 2 - SPREAD);
let y = (WORLD_H / 2) + (Math.random() * SPREAD * 2 - SPREAD);
@@ -733,8 +749,8 @@ export default class GrassSceneClean extends Phaser.Scene {
}
// --- AMNESIA INIT ---
// 1. PostFX Blur (Keep it for extra effect)
this.amnesiaBlur = this.cameras.main.postFX.addBlur(0, 2, 2, 1);
// 1. PostFX Blur (Disabled to prevent black screen issues)
// this.amnesiaBlur = this.cameras.main.postFX.addBlur(0, 2, 2, 1);
// 2. Overlay Texture (Megla Pozabe)
/*
@@ -791,17 +807,12 @@ export default class GrassSceneClean extends Phaser.Scene {
// --- AMNESIA SYSTEM ---
clearAmnesia() {
if (this.amnesiaBlur) {
this.tweens.add({
targets: [this.amnesiaBlur, this.amnesiaOverlay], // Fade both
strength: 0, // For blur
alpha: 0, // For overlay
duration: 2000,
onComplete: () => {
this.cameras.main.postFX.remove(this.amnesiaBlur);
this.amnesiaBlur = null;
if (this.amnesiaOverlay) this.amnesiaOverlay.destroy();
}
});
this.cameras.main.postFX.remove(this.amnesiaBlur);
this.amnesiaBlur = null;
}
if (this.amnesiaOverlay) {
this.amnesiaOverlay.destroy();
this.amnesiaOverlay = null;
}
}
@@ -810,11 +821,13 @@ export default class GrassSceneClean extends Phaser.Scene {
update(time, delta) {
// --- PARALLAX & SCROLLING ---
// 1. Ground Infinite Scroll
// 1. Ground Infinite Scroll (REMOVED for Static Island)
/*
if (this.ground) {
this.ground.tilePositionX = this.cameras.main.scrollX;
this.ground.tilePositionY = this.cameras.main.scrollY;
}
*/
// 2. River Flow Animation (REMOVED)
/* Removed for cleanup */

View File

@@ -18,28 +18,28 @@ export default class UIScene extends Phaser.Scene {
// Simple UI Layout
const width = this.cameras.main.width;
const height = this.cameras.main.height;
const PAD = 20;
const PAD = 60; // Increased padding for better visibility
// 0. TRIAL BADGE (Top Center - The "Hook")
this.add.image(width / 2, PAD, 'ui_badge_trial')
.setOrigin(0.5, 0)
.setScale(0.8)
.setScale(1.0) // Increased scale
.setDepth(100); // Ensure it's on top
// 1. Health (Top Left)
let health = this.add.image(PAD, PAD, 'ui_health_bar').setOrigin(0, 0).setScale(0.8);
let health = this.add.image(PAD, PAD, 'ui_health_bar').setOrigin(0, 0).setScale(1.0);
// 2. Weather (Top Right)
let weather = this.add.image(width - PAD, PAD, 'ui_weather_widget').setOrigin(1, 0).setScale(0.8);
let weather = this.add.image(width - PAD, PAD, 'ui_weather_widget').setOrigin(1, 0).setScale(1.0);
// 3. Minimap (Bottom Right)
let minimap = this.add.image(width - PAD, height - PAD, 'ui_minimap').setOrigin(1, 1).setScale(0.7);
let minimap = this.add.image(width - PAD, height - PAD, 'ui_minimap').setOrigin(1, 1).setScale(0.9);
// 4. Hotbar (Bottom Center)
let hotbar = this.add.image(width / 2, height - PAD, 'ui_hotbar').setOrigin(0.5, 1).setScale(0.8);
let hotbar = this.add.image(width / 2, height - PAD, 'ui_hotbar').setOrigin(0.5, 1).setScale(1.0);
// 5. Action Button (Right of Hotbar)
let action = this.add.image(width / 2 + 350, height - 30, 'ui_action_btn').setOrigin(0.5, 1).setScale(0.8);
let action = this.add.image(width / 2 + 400, height - PAD, 'ui_action_btn').setOrigin(0.5, 1).setScale(1.0);
// Debug Text
this.add.text(width / 2, 50, 'HUD LAYER ACTIVE', {