FAZA 17: 2.5D Minecraft-Style Terrain + Y-Layer Stacking + Custom Sprites
COMPLETED FEATURES: Custom Sprite Integration: - Player, Zombie, Merchant sprites (0.2 scale) - 11 custom sprites + 5 asset packs loaded - Auto-transparency processing (white/brown removal) - Gravestone system with atlas extraction 2.5D Minecraft-Style Terrain: - Volumetric blocks with 25px thickness - Strong left/right side shading (30%/50% darker) - Minecraft-style texture patterns (grass, dirt, stone) - Crisp black outlines for definition Y-Layer Stacking System: - GRASS_FULL: All green (elevation > 0.7) - GRASS_TOP: Green top + brown sides (elevation 0.4-0.7) - DIRT: All brown (elevation < 0.4) - Dynamic terrain depth based on height Floating Island World Edge: - Stone cliff walls at map borders - 2-tile transition zone - Elevation flattening for cliff drop-off effect - 100x100 world with defined boundaries Performance & Polish: - Canvas renderer for pixel-perfect sharpness - CSS image-rendering: crisp-edges - willReadFrequently optimization - No Canvas2D warnings Technical: - 3D volumetric trees and rocks - Hybrid rendering (2.5D terrain + 2D characters) - Procedural texture generation - Y-layer aware terrain type selection
This commit is contained in:
42
index.html
42
index.html
@@ -4,6 +4,9 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<!-- Suppress Electron Security Warning for Dev -->
|
||||
<meta http-equiv="Content-Security-Policy"
|
||||
content="script-src 'self' 'unsafe-inline' 'unsafe-eval' blob: data:; object-src 'self';">
|
||||
<title>NovaFarma - 2.5D Survival Game</title>
|
||||
<style>
|
||||
* {
|
||||
@@ -24,12 +27,37 @@
|
||||
align-items: center;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
image-rendering: -moz-crisp-edges;
|
||||
image-rendering: -webkit-crisp-edges;
|
||||
image-rendering: pixelated;
|
||||
image-rendering: crisp-edges;
|
||||
}
|
||||
|
||||
canvas {
|
||||
image-rendering: -moz-crisp-edges;
|
||||
image-rendering: -webkit-crisp-edges;
|
||||
image-rendering: pixelated;
|
||||
image-rendering: crisp-edges;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="game-container"></div>
|
||||
<div id="debug-console"
|
||||
style="position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.8); color: red; pointer-events: none; z-index: 9999; white-space: pre-wrap;">
|
||||
</div>
|
||||
|
||||
<script>
|
||||
window.onerror = function (msg, url, lineNo, columnNo, error) {
|
||||
const container = document.getElementById('debug-console');
|
||||
if (container) {
|
||||
container.innerHTML += `ERROR: ${msg}\nAt: ${url}:${lineNo}:${columnNo}\n\n`;
|
||||
}
|
||||
console.error('Global Error:', msg, url, lineNo, error);
|
||||
return false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<!-- Phaser 3 -->
|
||||
<script src="node_modules/phaser/dist/phaser.js"></script>
|
||||
@@ -38,9 +66,21 @@
|
||||
<script src="src/utils/PerlinNoise.js"></script>
|
||||
<script src="src/utils/IsometricUtils.js"></script>
|
||||
<script src="src/utils/TextureGenerator.js"></script>
|
||||
<script src="src/utils/ObjectPool.js"></script>
|
||||
|
||||
<!-- Systems -->
|
||||
<script src="src/systems/TerrainSystem.js"></script>
|
||||
<script src="src/systems/SaveSystem.js"></script>
|
||||
<script src="src/systems/TimeSystem.js"></script>
|
||||
<script src="src/systems/StatsSystem.js"></script>
|
||||
<script src="src/systems/InventorySystem.js"></script>
|
||||
<script src="src/systems/InteractionSystem.js"></script>
|
||||
<script src="src/systems/FarmingSystem.js"></script>
|
||||
<script src="src/systems/BuildingSystem.js"></script>
|
||||
<script src="src/systems/WeatherSystem.js"></script>
|
||||
<script src="src/systems/DayNightSystem.js"></script>
|
||||
<script src="src/systems/SoundManager.js"></script>
|
||||
<script src="src/systems/ParallaxSystem.js"></script>
|
||||
|
||||
<!-- Entities -->
|
||||
<script src="src/entities/Player.js"></script>
|
||||
@@ -49,6 +89,8 @@
|
||||
<!-- Game Files -->
|
||||
<script src="src/scenes/BootScene.js"></script>
|
||||
<script src="src/scenes/PreloadScene.js"></script>
|
||||
<script src="src/scenes/UIScene.js"></script>
|
||||
<script src="src/scenes/StoryScene.js"></script>
|
||||
<script src="src/scenes/GameScene.js"></script>
|
||||
<script src="src/game.js"></script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user