Combat enabled

This commit is contained in:
vesta 2025-09-12 23:32:53 +02:00
parent a82cabac15
commit b27b5ea041
3 changed files with 1451 additions and 944 deletions

View file

@ -303,7 +303,7 @@
</div>
</div>
</div>
<script src="../js/scriptalpha.js"></script>
<script src="../js/script.js"></script>
</body>
</html>

File diff suppressed because it is too large Load diff

View file

@ -1,19 +1,18 @@
document.addEventListener('DOMContentLoaded', () => {
const BIOME_TYPE = {
WATER_DEEP: { sprite:null, design: {frames: 8,duration: 200, drawer: drawDeepWaterFrame}, acceptStructure:false, movements:['swim'], affinities:[('water',0.8),('dark',0.2)], name: 'Eau Profonde', winterColor: '#3D5A80', fallColor: '#3D5A80', summerColor: '#3D5A80', autumnColor: '#3D5A80',maxElevation:0,minElevation:0 },
WATER_SHALLOW: { sprite:null, design: {frames: 6,duration: 150, drawer: drawWaterFrame}, acceptStructure:false,movements:['swim','ride','navigate','fly'], affinities:[('water',0.8),('life',0.2)],name: 'Eau Peu Profonde', winterColor: '#97aabdff', fallColor: '#5A8AB8', summerColor: '#5A8AB8', autumnColor: '#5A8AB8',maxElevation:1,minElevation:1 },
BEACH: { sprite:null, design: {frames: 4,duration: 200, drawer: drawBeachFrame}, acceptStructure:true, movements:['walk','ride','fly'],affinities:[('sand',0.8),('water',0.2)],name: 'Sable', winterColor: '#E9D9A1', fallColor: '#E9D9A1', summerColor: '#E9D9A1', autumnColor: '#E9D9A1',maxElevation:2 ,minElevation:2 },
GRASSLAND: {sprite:null, design: { frames: 4,duration: 200, drawer: drawGrasslandFrame}, acceptStructure:true, movements:['walk','ride','fly'],affinities:[('life',0.6),('earth',0.2)],name: 'Plaine', winterColor: '#ecf1e3ff', fallColor: '#98C159', summerColor: '#a5a450ff', autumnColor: '#455e21ff',maxElevation:3,minElevation:2 },
FOREST: { sprite: null, acceptStructure:true,movements:['walk','ride','fly'],affinities:[('wood',0.6),('earth',0.4)], name: 'Forêt', winterColor: '#92ac83ff', fallColor: '#21a32cff', summerColor: '#6A994E', autumnColor: '#b88a28ff',maxElevation:3,minElevation:2 },
ENCHANTED_FOREST: { sprite: null, acceptStructure:true,movements:['walk','ride','fly'],affinities:[('wood',0.8),('dark',0.2),('life',0.2)], name: 'Forêt Enchantée', winterColor: '#7B6094', fallColor: '#7B6094', summerColor: '#7B6094', autumnColor: '#7B6094',maxElevation:3,minElevation:2 },
MOUNTAIN: { sprite:null, design: { frames: 1,duration: 9999, drawer: drawMountainFrame}, acceptStructure:false, movements:['climb','fly'],affinities:[('rock',0.6),('wind',0.4)],name: 'Montagne', winterColor: '#F7F7F7', fallColor: '#A9A9A9', summerColor: '#A9A9A9', autumnColor: '#A9A9A9',maxElevation:5,minElevation:3 },
SNOWLAND: { sprite: null, acceptStructure:true,movements:['walk','ride','fly'], affinities:[('ice',0.8),('earth',0.2)],name: 'Toundra', winterColor: '#F7F7F7', fallColor: '#F7F7F7', summerColor: '#F7F7F7', autumnColor: '#F7F7F7',maxElevation:2,minElevation:2 },
SNOWMOUNTAIN: { sprite: null, acceptStructure:false, movements:['climb','fly'],affinities:[('ice',0.4),('rock',0.4),('wind',0.2)],name: 'Mont enneigé', winterColor: '#F7F7F7', fallColor: '#F7F7F7', summerColor: '#F7F7F7', autumnColor: '#F7F7F7',maxElevation:8,minElevation:4 },
DESERT: { sprite: null, acceptStructure:true,movements:['walk','ride','fly'],affinities:[('sand',0.8),('life',0.1),('fire',0.1)], name: 'Désert', winterColor: '#D4A373', fallColor: '#D4A373', summerColor: '#D4A373', autumnColor: '#D4A373',maxElevation:2,minElevation:2 },
RIVER: { sprite: null, acceptStructure:false,movements:['navigate','swim','fly'],affinities:[('water',0.6),('earth',0.2),('life',0.2)],name: 'Rivière', winterColor: '#97aabdff', fallColor: '#5A8AB8', summerColor: '#5A8AB8', autumnColor: '#5A8AB8',maxElevation:2,minElevation:2 },
SWAMP: { sprite:null, design: { frames: 4,duration: 300, drawer: drawSwampFrame}, acceptStructure:false, movements:['fly'],affinities:[('water',0.6),('earth',0.2),('dark',0.2)],name: 'Marais', winterColor: '#0b2e10ff', fallColor: '#0b2e10ff', summerColor: '#0b2e10ff', autumnColor: '#0b2e10ff',maxElevation:1,minElevation:1 }
}
WATER_DEEP: { sprite: null, design: { frames: 8, duration: 200, drawer: drawDeepWaterFrame }, acceptStructure: false, movements: ['swim'], affinities: [{ type: 'water', value: 0.8 }, { type: 'dark', value: 0.2 }], name: 'Eau Profonde', winterColor: '#3D5A80', fallColor: '#3D5A80', summerColor: '#3D5A80', autumnColor: '#3D5A80', maxElevation: 0, minElevation: 0 },
WATER_SHALLOW: { sprite: null, design: { frames: 6, duration: 150, drawer: drawWaterFrame }, acceptStructure: false, movements: ['swim', 'ride', 'navigate', 'fly'], affinities: [{ type: 'water', value: 0.8 }, { type: 'life', value: 0.2 }], name: 'Eau Peu Profonde', winterColor: '#97aabdff', fallColor: '#5A8AB8', summerColor: '#5A8AB8', autumnColor: '#5A8AB8', maxElevation: 1, minElevation: 1 },
BEACH: { sprite: null, design: { frames: 4, duration: 200, drawer: drawBeachFrame }, acceptStructure: true, movements: ['walk', 'ride', 'fly'], affinities: [{ type: 'sand', value: 0.8 }, { type: 'water', value: 0.2 }], name: 'Sable', winterColor: '#E9D9A1', fallColor: '#E9D9A1', summerColor: '#E9D9A1', autumnColor: '#E9D9A1', maxElevation: 2, minElevation: 2 },
GRASSLAND: { sprite: null, design: { frames: 4, duration: 200, drawer: drawGrasslandFrame }, acceptStructure: true, movements: ['walk', 'ride', 'fly'], affinities: [{ type: 'life', value: 0.6 }, { type: 'earth', value: 0.2 }], name: 'Plaine', winterColor: '#ecf1e3ff', fallColor: '#98C159', summerColor: '#a5a450ff', autumnColor: '#455e21ff', maxElevation: 3, minElevation: 2 },
FOREST: { sprite: null, acceptStructure: true, movements: ['walk', 'ride', 'fly'], affinities: [{ type: 'wood', value: 0.6 }, { type: 'earth', value: 0.4 }], name: 'Forêt', winterColor: '#92ac83ff', fallColor: '#21a32cff', summerColor: '#6A994E', autumnColor: '#b88a28ff', maxElevation: 3, minElevation: 2 },
ENCHANTED_FOREST: { sprite: null, acceptStructure: true, movements: ['walk', 'ride', 'fly'], affinities: [{ type: 'wood', value: 0.8 }, { type: 'dark', value: 0.2 }, { type: 'life', value: 0.2 }], name: 'Forêt Enchantée', winterColor: '#7B6094', fallColor: '#7B6094', summerColor: '#7B6094', autumnColor: '#7B6094', maxElevation: 3, minElevation: 2 },
MOUNTAIN: { sprite: null, design: { frames: 1, duration: 9999, drawer: drawMountainFrame }, acceptStructure: false, movements: ['climb', 'fly'], affinities: [{ type: 'rock', value: 0.6 }, { type: 'wind', value: 0.4 }], name: 'Montagne', winterColor: '#F7F7F7', fallColor: '#A9A9A9', summerColor: '#A9A9A9', autumnColor: '#A9A9A9', maxElevation: 5, minElevation: 3 },
SNOWLAND: { sprite: null, acceptStructure: true, movements: ['walk', 'ride', 'fly'], affinities: [{ type: 'ice', value: 0.8 }, { type: 'earth', value: 0.2 }], name: 'Toundra', winterColor: '#F7F7F7', fallColor: '#F7F7F7', summerColor: '#F7F7F7', autumnColor: '#F7F7F7', maxElevation: 2, minElevation: 2 },
SNOWMOUNTAIN: { sprite: null, acceptStructure: false, movements: ['climb', 'fly'], affinities: [{ type: 'ice', value: 0.4 }, { type: 'rock', value: 0.4 }, { type: 'wind', value: 0.2 }], name: 'Mont enneigé', winterColor: '#F7F7F7', fallColor: '#F7F7F7', summerColor: '#F7F7F7', autumnColor: '#F7F7F7', maxElevation: 8, minElevation: 4 },
DESERT: { sprite: null, acceptStructure: true, movements: ['walk', 'ride', 'fly'], affinities: [{ type: 'sand', value: 0.8 }, { type: 'life', value: 0.1 }, { type: 'fire', value: 0.1 }], name: 'Désert', winterColor: '#D4A373', fallColor: '#D4A373', summerColor: '#D4A373', autumnColor: '#D4A373', maxElevation: 2, minElevation: 2 },
RIVER: { sprite: null, acceptStructure: false, movements: ['navigate', 'swim', 'fly'], affinities: [{ type: 'water', value: 0.6 }, { type: 'earth', value: 0.2 }, { type: 'life', value: 0.2 }], name: 'Rivière', winterColor: '#97aabdff', fallColor: '#5A8AB8', summerColor: '#5A8AB8', autumnColor: '#5A8AB8', maxElevation: 2, minElevation: 2 },
SWAMP: { sprite: null, design: { frames: 4, duration: 300, drawer: drawSwampFrame }, acceptStructure: false, movements: ['fly'], affinities: [{ type: 'water', value: 0.6 }, { type: 'earth', value: 0.2 }, { type: 'dark', value: 0.2 }], name: 'Marais', winterColor: '#0b2e10ff', fallColor: '#0b2e10ff', summerColor: '#0b2e10ff', autumnColor: '#0b2e10ff', maxElevation: 1, minElevation: 1 }
};
const JOB = {
VILLAGER: {
name: "Habitant",
@ -300,24 +299,32 @@ document.addEventListener('DOMContentLoaded', () => {
if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) {
const targetTile = gameMap.tiles[newY][newX];
if (targetTile.biome && (targetTile.biome.movements.includes('walk') || targetTile.biome.movements.includes('climb')) && this.type.biomes.includes(targetTile.biome)) {
if (targetTile.biome && (targetTile.biome.type.movements.includes('walk') || targetTile.biome.type.movements.includes('climb')) && this.type.biomes.type.includes(targetTile.biome.type)) {
this.tile = targetTile;
}
}
}
setDesign(ctx) {
if (!this.tile || this.tile.visibility !== 2) return;
const svgImage = this.type.svgAsset();
if (!svgImage) return;
const screenPos = this.tile.position.cartToIso();
const elevationHeight = this.tile.position.h * ELEVATION_STEP;
const flightHeight = this.type.flightHeight || 0;
const size = this.type.size || { w: 40, h: 40 };
const offset = this.type.offset || { x: -20, y: -35 };
ctx.save();
ctx.translate(screenPos.x, screenPos.y - elevationHeight);
ctx.translate(screenPos.x, screenPos.y - elevationHeight - flightHeight);
if (flightHeight > 0) {
ctx.fillStyle = 'rgba(0,0,0,0.2)';
ctx.beginPath();
ctx.ellipse(0, flightHeight, 8, 4, 0, 0, 2 * Math.PI);
ctx.fill();
}
ctx.drawImage(svgImage, offset.x, offset.y, size.w, size.h);
ctx.restore();
}
@ -367,8 +374,8 @@ document.addEventListener('DOMContentLoaded', () => {
ctx.fill();
// Draw top surface using a sprite if available
if (this.biome.sprite) {
this.biome.sprite.draw(ctx, -TILE_WIDTH / 2, 0);
if (this.type.sprite) {
this.type.sprite.draw(ctx, -TILE_WIDTH / 2, 0);
} else {
ctx.fillStyle = baseColor;
ctx.beginPath();
@ -378,9 +385,9 @@ document.addEventListener('DOMContentLoaded', () => {
}
if (this.type === BIOME_TYPE.FOREST && forestSVG) {
ctx.drawImage(forestSVG, -25, -25, 50, 50);
} else if (this.biome === BIOME_TYPE.ENCHANTED_FOREST && enchantedForestSVG) {
} else if (this.type === BIOME_TYPE.ENCHANTED_FOREST && enchantedForestSVG) {
ctx.drawImage(enchantedForestSVG, -25, -25, 50, 50);
} else if (this.biome === BIOME_TYPE.SWAMP && swampSVG) {
} else if (this.type === BIOME_TYPE.SWAMP && swampSVG) {
ctx.drawImage(swampSVG, -25, -5, 50, 30);
}
};
@ -391,13 +398,12 @@ document.addEventListener('DOMContentLoaded', () => {
this.position = new Position(x, y);
this.biome = null;
this.structure = null;
this.animal = null;
this.npc=[];
this.entities = [];
this.visibility = 0; // 0: Unseen, 1: Seen, 2: Visible
this.setBiome();
this.setElevation();
this.setStructure();
this.setEntity();
this.setEntities();
}
setBiome() {
@ -411,18 +417,10 @@ document.addEventListener('DOMContentLoaded', () => {
this.biome.setDesign(ctx,this.position);
// Draw features if fully visible
if(this.visibility === 2) {
if (this.structure ) {
this.structure.setDesign(ctx);
}
if (this.animal ) {
this.animal.setDesign(ctx);
}
if (this.npc ) {
this.npc.setDesign(ctx);
}
if (this.structure) this.structure.setDesign(ctx);
this.entities.forEach(e => e.setDesign(ctx));
}
// Draw fog overlay if seen but not currently visible
@ -439,41 +437,58 @@ document.addEventListener('DOMContentLoaded', () => {
setElevation(){
if (!this.biome) return;
this.position.h = Math.floor(Math.random() * (this.biome.maxElevation - this.biome.minElevation+ 1) + this.biome.minElevation);
this.position.h = Math.floor(Math.random() * (this.biome.type.maxElevation - this.biome.type.minElevation+ 1) + this.biome.type.minElevation);
}
setStructure(){
var rand = seededRandom(this.position.x * 13 + this.position.y * 59);
var structureChance = rand();
if (structureChance < 0.01 && this.biome.acceptStructure) {
if (structureChance < 0.01 && this.biome.type.acceptStructure) {
this.structure=new structure(this.position);
}
}
setEntity(){
// a changer!
if(this.structure) {
const structureType = this.structure.type;
let job = JOB.VILLAGER;
if(structureType === STRUCTURE_TYPE.FARM) job = JOB.FARMER;
if(structureType === STRUCTURE_TYPE.CAMP) job = JOB.BANDIT;
setEntities() {
// --- NPC liés aux structures ---
if (this.structure && this.structure.type) {
const structureType = this.structure.type;
let job = JOB.VILLAGER;
if (structureType === STRUCTURE_TYPE.FARM) job = JOB.FARMER;
if (structureType === STRUCTURE_TYPE.CAMP) job = JOB.BANDIT;
for(let i = 0; i < structureType.population; i++) {
this.npc.push(new Npc(job,new Creature(job.name,null,1,null,null,this.position,'HUMAN',null,10,null),this,null ));
}
}
else {
if (this.biome) {
for (const key in ANIMAL_TYPES) {
const animalType = ANIMAL_TYPES[key];
if (animalType.biomes.includes(this.biome) && Math.random() < animalType.spawnChance) {
if( this.biome.movements.includes(animalType.movement)) {
this.animal = new Animal(animalType, this.position);
}
}
}
for (let i = 0; i < structureType.population; i++) {
const creature = new Creature(
job.name,
new Attributes(RACE.HUMAN),
1,
null,
null,
this, // la tuile du NPC
'HUMAN',
RACE.HUMAN,
10,
null
);
this.entities.push(new Npc(job, creature, this.structure, null));
}
}
// --- Animaux sauvages ---
else if (this.biome) {
for (const key in ANIMAL_TYPES) {
const animalType = ANIMAL_TYPES[key];
// 🔑 Vérif par nom au lieu d’objet
if (animalType.biomes.some(b => b.name === this.biome.type.name) && Math.random() < animalType.spawnChance) {
if (this.biome.type.movements.includes(animalType.movement)) {
this.entities.push(new Animal(animalType, this));
}
}
}
}
}
}
class Map {
constructor(size) {
@ -531,6 +546,74 @@ document.addEventListener('DOMContentLoaded', () => {
ctx.globalAlpha = 1.0;
}
}
generateRoads(locations) {
//Location to transform into settlement
if (locations.length < 2) return;
for (let i = 0; i < locations.length - 1; i++) {
let start = locations[i];
let end = locations[i+1];
let currentX = start.x;
let currentY = start.y;
while(Math.abs(currentX - end.x) > 0 || Math.abs(currentY - end.y) > 0) {
if (Math.abs(currentX - end.x) > Math.abs(currentY - end.y)) {
currentX += Math.sign(end.x - currentX);
} else {
currentY += Math.sign(end.y - currentY);
}
if (currentX >= 0 && currentX < this.size && currentY >= 0 && currentY < this.size) {
const tile = this.tiles[currentY][currentX];
if (tile.biome === Biome.RIVER) {
tile.hasBridge = true;
} else if (tile.biome !== Biome.WATER_DEEP && tile.biome !== Biome.WATER_SHALLOW) {
tile.isRoad = true;
}
}
}
}
}
generateRivers() {
const numRivers = 10;
for (let i = 0; i < numRivers; i++) {
let currentX = Math.floor(Math.random() * this.size);
let currentY = Math.floor(Math.random() * this.size);
let sourceTile = this.tiles[currentY][currentX];
if (sourceTile.biome !== Biome.MOUNTAIN) continue;
let maxLength = 200;
while (maxLength > 0) {
maxLength--;
const currentTile = this.tiles[currentY][currentX];
if (currentTile.biome === Biome.WATER_DEEP || currentTile.biome === Biome.WATER_SHALLOW) break;
currentTile.biome = Biome.RIVER;
currentTile.elevation = Math.max(1, currentTile.elevation -1);
const neighbors = [ {x:0, y:-1}, {x:0, y:1}, {x:-1, y:0}, {x:1, y:0} ];
let lowestNeighbor = null;
let lowestElevation = currentTile.elevation;
for (const n of neighbors) {
const nx = currentX + n.x;
const ny = currentY + n.y;
if (nx >= 0 && nx < this.size && ny >= 0 && ny < this.size) {
const neighborTile = this.tiles[ny][nx];
if (neighborTile.elevation < lowestElevation) {
lowestElevation = neighborTile.elevation;
lowestNeighbor = {x: nx, y: ny};
}
}
}
if (lowestNeighbor) {
currentX = lowestNeighbor.x;
currentY = lowestNeighbor.y;
} else {
break;
}
}
}
}
}
class Attributes {
@ -545,7 +628,7 @@ document.addEventListener('DOMContentLoaded', () => {
}
class Creature {
constructor(name,attributes,level,affinities,alignments,position,species,race,hp,items) {
constructor(name,attributes,level,affinities,alignments,tile,species,race,hp,items) {
this.name = name;
this.attributes = attributes;
this.level = level;
@ -554,15 +637,28 @@ document.addEventListener('DOMContentLoaded', () => {
this.alignments = alignments;
this.species = species;
this.race = race;
this.position=position;
this.tile=tile;
this.items=items;
this.hp=hp;
}
}
class Npc {
constructor(job, creature, settlement, equipments) {
this.job = job;
this.creature = creature; // ✅ on stocke bien la créature
this.tile = creature.tile; // ✅ le NPC est placé sur la tuile de la créature
this.settlement = settlement; // ✅ lien avec le village/structure
this.equipments = equipments || [];
this.lastMoveTime = 0;
this.moveCooldown = 3000 + Math.random() * 4000;
}
}
class Npc {
constructor(job,creature,settlement,equipments) {
this.job = job;
this.tile = creature.tile;
this.creature = creature;
this.settlement = settlement;
this.lastMoveTime = 0;
this.moveCooldown = 3000 + Math.random() * 4000;
@ -617,15 +713,15 @@ document.addEventListener('DOMContentLoaded', () => {
}
}
if(possibleMoves.length > 0) {
this.tile = possibleMoves[Math.floor(Math.random() * possibleMoves.length)];
this.creature.tile = possibleMoves[Math.floor(Math.random() * possibleMoves.length)];
}
}
setDesign(ctx) {
if (!this.tile || this.tile.visibility !== 2) return;
if (!this.creature.tile || this.creature.tile.visibility !== 2) return;
const screenPos = this.tile.position.cartToIso();
const elevationHeight = this.tile.position.h * ELEVATION_STEP;
const screenPos = this.creature.tile.position.cartToIso();
const elevationHeight = this.creature.tile.position.h * ELEVATION_STEP;
ctx.save();
ctx.translate(screenPos.x, screenPos.y - elevationHeight);
@ -646,7 +742,7 @@ document.addEventListener('DOMContentLoaded', () => {
}
setDesign(ctx) {
const position = this.creature.position
const position = this.creature.tile.position
if(!position) return;
const screenPos = position.cartToIso();
@ -663,12 +759,12 @@ document.addEventListener('DOMContentLoaded', () => {
ctx.restore();
}
move(dx, dy, gameMap) {
const newX = this.creature.position.x + dx;
const newY = this.creature.position.y + dy;
const newX = this.creature.tile.position.x + dx;
const newY = this.creature.tile.position.y + dy;
if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) {
const targetTile = gameMap.tiles[newY][newX].position;
const targetTile = gameMap.tiles[newY][newX];
if (targetTile.biome && targetTile.biome.type.movements.includes('walk')) {
this.creature.position = targetTile;
this.creature.tile = targetTile;
}
}
}
@ -903,8 +999,8 @@ document.addEventListener('DOMContentLoaded', () => {
for (let y = startY; y < endY; y++) {
for (let x = startX; x < endX; x++) {
if (this.world.map.tiles[y] && this.world.map.tiles[y][x]) {
this.world.map.tiles[y][x].setDesign(ctx);
if (this.map.tiles[y] && this.map.tiles[y][x]) {
this.map.tiles[y][x].setDesign(ctx);
}
}
}
@ -942,12 +1038,12 @@ document.addEventListener('DOMContentLoaded', () => {
}
update(currentTime) {
this.updateVisibility(this.player.creature.position);
this.updateVisibility(this.player.creature.tile.position);
// a changer!
//this.world.animals.forEach(animal => animal.update(currentTime, this.world.map));
//this.world.npcs.forEach(npc => npc.update(currentTime, this.world.map));
this.camera.setCamera(this.player.creature.position);
this.camera.setCamera(this.player.creature.tile.position);
// Update all biome sprites
for (const key in BIOME_TYPE) {
@ -1019,7 +1115,7 @@ document.addEventListener('DOMContentLoaded', () => {
spawnX = Math.floor(Math.random() * this.world.map.size);
spawnY = Math.floor(Math.random() * this.world.map.size);
} while (!this.world.map.tiles[spawnY][spawnX].biome || !this.world.map.tiles[spawnY][spawnX].biome.type.movements.includes('walk') );
this.world.player = new Player(new Creature('player',new Attributes(RACE.HUMAN),1,null,null,this.world.map.tiles[spawnY][spawnX].position,'human',RACE.HUMAN,10,null),);
this.world.player = new Player(new Creature('player',new Attributes(RACE.HUMAN),1,null,null,this.world.map.tiles[spawnY][spawnX],'human',RACE.HUMAN,10,null),);
this.world.updateVisibility(this.world.map.tiles[spawnY][spawnX].position);
}
setControls() {
@ -1056,6 +1152,7 @@ document.addEventListener('DOMContentLoaded', () => {
if (controls.right) { this.world.player.move(1, 0,this.world.map); moved = true; }
if(moved) lastMoveTime = currentTime;
}
handleInteraction() {
if (!controls.interact) return;
controls.interact = false; // Consume the action