diff --git a/html/main.html b/html/main.html index 0fa38fc..59463a4 100644 --- a/html/main.html +++ b/html/main.html @@ -303,7 +303,7 @@ - + \ No newline at end of file diff --git a/js/script.js b/js/script.js index ec3c481..62e5287 100644 --- a/js/script.js +++ b/js/script.js @@ -1,72 +1,185 @@ document.addEventListener('DOMContentLoaded', () => { - const BIOME_TYPE = { - 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", - dialogues: [ - "Bien le bonjour, étranger.", - "J'espère que la récolte sera bonne cette année.", - "Faites attention aux loups dans la forêt.", - "Le forgeron a de nouvelles marchandises, je crois." - ] - }, FARMER: { - name: "Fermier", - dialogues: [ - "Le temps est parfait pour les cultures.", - "Ces sangliers n'arrêtent pas de saccager mes champs !", - "Une bonne terre, c'est tout ce qui compte." - ] - }, - BANDIT: { - name: "Bandit", - dialogues: [ - "Qu'est-ce que tu regardes ?", - "Dégage d'ici avant que je me fâche.", - "Ta bourse ou la vie !" - ] + + // --- Sprite Drawing Functions --- + + function drawGrasslandFrame(ctx, frame, width, height) { + const PIXEL_SCALE = 2; + const colors = ['#6A994E', '#588142', '#A5A450']; + + ctx.fillStyle = colors[1]; + ctx.beginPath(); + ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); + ctx.closePath(); + ctx.fill(); + + for (let i = 0; i < 150; i++) { + const x = Math.random() * width; + const y = (Math.random() * height / 2) + height / 4; + const dx = Math.abs(x - width / 2); + const dy = Math.abs(y - height / 2); + if (dx / (width / 2) + dy / (height / 2) > 1) continue; + + const wave = Math.sin(x / 5 + frame * Math.PI / 2) * PIXEL_SCALE; + ctx.fillStyle = colors[i % 2]; + ctx.fillRect(x + wave, y - PIXEL_SCALE, PIXEL_SCALE, PIXEL_SCALE); + } + } + + function drawWaterFrame(ctx, frame, width, height) { + const colors = ['#5A8AB8', '#4A7AA8', '#97aabdff']; + ctx.fillStyle = colors[0]; + ctx.beginPath(); + ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); + ctx.closePath(); + ctx.fill(); + for (let i = 0; i < 3; i++) { + ctx.strokeStyle = colors[1]; + ctx.lineWidth = 1; + ctx.beginPath(); + const startY = (height / 4) * (i + 1); + const offset = (frame * 0.2) + i * 2; + ctx.moveTo(0, startY + Math.sin(offset) * 2); + for (let x = 0; x < width; x++) { + const y = startY + Math.sin(x * 0.15 + offset) * 2; + if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) < 1) { + ctx.lineTo(x, y); + } + } + ctx.stroke(); + } + } + + function drawDeepWaterFrame(ctx, frame, width, height) { + const colors = ['#3D5A80', '#2A4A6D', '#1A202C']; + ctx.fillStyle = colors[0]; + ctx.beginPath(); + ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); + ctx.closePath(); + ctx.fill(); + for (let i = 0; i < 2; i++) { + ctx.strokeStyle = colors[1]; + ctx.lineWidth = 2; + ctx.beginPath(); + const startY = (height / 3) * (i + 1); + const offset = (frame * 0.1) + i * 3; + ctx.moveTo(0, startY + Math.sin(offset) * 1.5); + for (let x = 0; x < width; x++) { + const y = startY + Math.sin(x * 0.1 + offset) * 1.5; + if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) < 1) { + ctx.lineTo(x, y); + } + } + ctx.stroke(); } - }; + } + + function drawMountainFrame(ctx, frame, width, height) { + const colors = ['#A9A9A9', '#808080', '#696969']; + ctx.fillStyle = colors[0]; + ctx.beginPath(); + ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); + ctx.closePath(); + ctx.fill(); + for (let i = 0; i < 70; i++) { + const x = Math.random() * width; + const y = Math.random() * height; + if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) > 1) continue; + const w = 2 + Math.random() * 4; + const h = 2 + Math.random() * 4; + ctx.fillStyle = colors[1 + Math.floor(Math.random() * 2)]; + ctx.fillRect(x - w / 2, y - h / 2, w, h); + } + } + + function drawSwampFrame(ctx, frame, width, height) { + const colors = ['#526044', '#36402D', '#6A994E']; + ctx.fillStyle = colors[1]; + ctx.beginPath(); + ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); + ctx.closePath(); + ctx.fill(); + + for (let i = 0; i < 3; i++) { + ctx.strokeStyle = colors[0]; + ctx.lineWidth = 1; + ctx.beginPath(); + const startY = (height / 4) * (i + 1); + const offset = (frame * 0.05) + i * 2.5; + ctx.moveTo(0, startY + Math.sin(offset) * 1); + for (let x = 0; x < width; x++) { + const y = startY + Math.sin(x * 0.1 + offset) * 1; + if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) < 1) { + ctx.lineTo(x, y); + } + } + ctx.stroke(); + } + } + + function drawBeachFrame(ctx, frame, width, height) { + const colors = ['#E9D9A1', '#D4C092', '#FFFFFF']; + ctx.fillStyle = colors[0]; + ctx.beginPath(); + ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); + ctx.closePath(); + ctx.fill(); + + for (let i = 0; i < 10; i++) { + const x = Math.random() * width; + const y = Math.random() * height; + if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) > 0.9) continue; + ctx.fillStyle = colors[2]; + ctx.fillRect(x, y, 1, 1); + } + } + + // --- Biome Configuration --- + const Biome = { + WATER_DEEP: { sprite: null, design: { frames: 8, duration: 250, 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: 8, 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: 99999, 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: 10, 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 } + } + + const NAME_PREFIXES = ["Chêne", "Sombre", "Pierre", "Haut", "Val", "Mur", "Guet", "Clair"]; + const NAME_SUFFIXES = ["bourg", "fort", "ville", "mont", "port", "bois", "rivage", "gard"]; + const Affinities = ['water','fire','sand','rock','dark','life','ice','wood','wind','metal','time','space','lava','light','spirit']; const RACE = { HUMAN: {strength:1,vitality:1,dexterity:1,intelligence:1,wisdom:1,luck:1} }; + + const Slot = ['head','body','leg','foot','right-hand','left-hand','two-hands','finger1','finger2','neck','purse','backpack','belt1','belt2']; - const SLOT = ['head','body','leg','foot','right-hand','left-hand','two-hands','finger1','finger2','neck','purse','backpack','belt1','belt2']; - - const ITEM_TYPE = { + const ItemType = { lightWeapon:{slot:['right-hand','left-hand','backpack'],soul:true,enchant:true}, - heavyWeapon:{slot:['two-hands','backpack'],soul:true,enchant:true}, - heavyArmor:{slot:['body','backpack'],soul:true,enchant:true}, - lightArmor:{slot:['body','backpack'],soul:true,enchant:true}, - shield:{slot:['right-hand','left-hand','backpack'],soul:true,enchant:true}, - shoes:{slot:['foot','backpack'],soul:true,enchant:true}, - pant:{slot:['leg','backpack'],soul:true,enchant:true}, - helmet:{slot:['leg','backpack'],soul:true,enchant:true}, - potion:{slot:['heal','backpack'],soul:false,enchant:false}, - throwable:{slot:['belt','backpack'],soul:true,enchant:true}, - craftMaterial:{slot:['backpack'],soul:false,enchant:false}, - ring:{slot:['finger1','finger2','backpack'],soul:true,enchant:true}, - amulet:{slot:['neck','backpack'],soul:true,enchant:true}, - currency:{slot:['purse'],soul:true,enchant:true}, - enchantMaterial:{slot:['backpack'],soul:false,enchant:false}, - mercantMaterial:{slot:['backpack'],soul:false,enchant:false} + heavyWeapon:{slot:('two-hands','backpack'),soul:true,enchant:true}, + heavyArmor:{slot:('body','backpack'),soul:true,enchant:true}, + lightArmor:{slot:('body','backpack'),soul:true,enchant:true}, + shield:{slot:('right-hand','left-hand','backpack'),soul:true,enchant:true}, + shoes:{slot:('foot','backpack'),soul:true,enchant:true}, + pant:{slot:('leg','backpack'),soul:true,enchant:true}, + helmet:{slot:('leg','backpack'),soul:true,enchant:true}, + potion:{slot:('heal','backpack'),soul:false,enchant:false}, + throwable:{slot:('belt','backpack'),soul:true,enchant:true}, + craftMaterial:{slot:('backpack'),soul:false,enchant:false}, + ring:{slot:('finger1','finger2','backpack'),soul:true,enchant:true}, + amulet:{slot:('neck','backpack'),soul:true,enchant:true}, + currency:{slot:('purse'),soul:true,enchant:true}, + enchantMaterial:{slot:('backpack'),soul:false,enchant:false}, + mercantMaterial:{slot:('backpack'),soul:false,enchant:false} } - const ITEMS = { + const Items = { 'Épée en Bois': { name: 'Épée en Bois', itemType: 'lightWeapon', stats: { strength: 2 }, icon: '🗡️' ,enchantments:[] }, 'Armure de Cuir': { name: 'Armure de Cuir', itemType: 'lightArmor', stats: { vitality: 2 }, icon: '🧥',enchantments:[] }, 'Claymore': { name: 'Claymore', itemType: 'lightArmor', stats: { vitality: 2 }, icon: '🧥',enchantments:['primal'] }, @@ -81,19 +194,31 @@ document.addEventListener('DOMContentLoaded', () => { const STRUCTURE_TYPE = { - CASTLE: { name: 'Chateau', population: 15, spawnChance: 0.01, size: { w: 48, h: 48 }, offset: { x: -24, y: -28 } , svgAsset: () => citySVG }, - HOUSE: { name: 'Maison', population: 5, spawnChance: 0.02, size: { w: 30, h: 30 }, offset: { x: -20, y: -16 } , svgAsset: () => houseSVG}, - FARM: { name: 'Ferme', population: 5, spawnChance: 0.10, size: { w: 30, h: 30 }, offset: { x: -20, y: -16 }, svgAsset: () => farmSVG }, - CAMP: { name: 'Campement', population: 2, spawnChance: 0.05, size: { w: 30, h: 30 }, offset: { x: -20, y: -20 } , svgAsset: () => campSVG }, - MARKET: { name: 'Marché', population: 2, spawnChance: 0.05, size: { w: 30, h: 30 }, offset: { x: -20, y: -20 } , svgAsset: () => marketSVG }, - CULT: { name: 'Lieu de culte', population: 2, spawnChance: 0.05, size: { w: 30, h: 30 }, offset: { x: -20, y: -20 } , svgAsset: () => cultSVG }, - MINE: { name: 'Mine', population: 2, spawnChance: 0.05, size: { w: 30, h: 30 }, offset: { x: -20, y: -20 } , svgAsset: () => mineSVG } + CITY: { name: 'Ville', population: 15, spawnChance: 0.005, svg: () => citySVG }, + VILLAGE: { name: 'Village', population: 5, spawnChance: 0.02, svg: () => villageSVG}, + FARM: { name: 'Ferme', population: 3, spawnChance: 0.01, svg: () => farmSVG }, + CAMP: { name: 'Campement', population: 2, spawnChance: 0.002, svg: () => campSVG }, }; - const SETTLEMENT_TYPE = { - HUMAN_TOWN: { name: 'Ville', population: 100, spawnChance: 0.01, size: 10, structureType:[(STRUCTURE_TYPE.CASTLE,1),(STRUCTURE_TYPE.HOUSE,5),(STRUCTURE_TYPE.MARKET,2),(STRUCTURE_TYPE.CULT,2)] }, - HUMAN_VILLAGE: { name: 'Village', population: 50, spawnChance: 0.02, size: 3, structureType:[(STRUCTURE_TYPE.CASTLE,1),(STRUCTURE_TYPE.HOUSE,5)]}, - DEMON_CAMP: { name: 'Demon camp', population: 5, spawnChance: 0.10, size: 3, structureType:[(STRUCTURE_TYPE.CULT,1),(STRUCTURE_TYPE.HOUSE,10)] }, - ORC_BASE: { name: 'Orc base', population: 2, spawnChance: 0.05, size: 5, structureType:[(STRUCTURE_TYPE.CASTLE,1),(STRUCTURE_TYPE.HOUSE,5)] } + + const NPC_TYPES = { + VILLAGER: { + name: "Habitant", + dialogues: [ + "Bien le bonjour, étranger.", "J'espère que la récolte sera bonne cette année.", "Faites attention aux loups dans la forêt.", "Le forgeron a de nouvelles marchandises, je crois." + ] + }, + FARMER: { + name: "Fermier", + dialogues: [ + "Le temps est parfait pour les cultures.", "Ces sangliers n'arrêtent pas de saccager mes champs !", "Une bonne terre, c'est tout ce qui compte." + ] + }, + BANDIT: { + name: "Bandit", + dialogues: [ + "Qu'est-ce que tu regardes ?", "Dégage d'ici avant que je me fâche.", "Ta bourse ou la vie !" + ] + } }; const MONSTER_TYPES = { @@ -102,171 +227,86 @@ document.addEventListener('DOMContentLoaded', () => { }; const ANIMAL_TYPES = { - WOLF: { name: 'Loup', movement: 'walk', svgAsset: () => wolfPackSVG, hp: 20, strength: 4, defense: 1, xp: 15, loot: { 'Cuir': 1, 'Os': 1 }, biomes: [BIOME_TYPE.FOREST, BIOME_TYPE.MOUNTAIN, BIOME_TYPE.SNOWLAND], spawnChance: 0.01, size: { w: 40, h: 40 }, offset: { x: -20, y: -35 } }, - BOAR: { name: 'Sanglier', movement: 'walk', svgAsset: () => boarSVG, hp: 25, strength: 5, defense: 2, xp: 20, loot: { 'Cuir': 2 }, biomes: [BIOME_TYPE.FOREST, BIOME_TYPE.GRASSLAND], spawnChance: 0.02, size: { w: 30, h: 30 }, offset: { x: -15, y: -28 } }, - BIRD: { name: 'Aigle', movement: 'fly', design: { frames: 2, duration: 200, drawer: drawBirdFrame }, hp: 10, strength: 1, defense: 0, xp: 5, loot: { 'Plume': 1 }, biomes: [BIOME_TYPE.FOREST, BIOME_TYPE.GRASSLAND, BIOME_TYPE.MOUNTAIN, BIOME_TYPE.BEACH], spawnChance: 0.03, size: { w: 24, h: 16 }, offset: { x: -12, y: -50 }, flightHeight: 40, nonHostile: true }, + WOLF: { name: 'Loup', movementClass: 'ground', svgAsset: () => wolfPackSVG, hp: 20, strength: 4, xp: 15, loot: { 'Cuir': 1, 'Os': 1 }, biomes: [Biome.FOREST, Biome.MOUNTAIN, Biome.SNOWLAND], spawnChance: 0.01, size: { w: 40, h: 40 }, offset: { x: -20, y: -35 } }, + BOAR: { name: 'Sanglier', movementClass: 'ground', svgAsset: () => boarSVG, hp: 25, strength: 5, xp: 20, loot: { 'Cuir': 2 }, biomes: [Biome.FOREST, Biome.GRASSLAND], spawnChance: 0.02, size: { w: 30, h: 30 }, offset: { x: -15, y: -28 } }, + BIRD: { name: 'Aigle', movementClass: 'fly', svgAsset: () => birdSVG, hp: 10, strength: 1, xp: 5, loot: { 'Plume': 1 }, biomes: [Biome.FOREST, Biome.GRASSLAND, Biome.MOUNTAIN, Biome.BEACH], spawnChance: 0.03, size: { w: 45, h: 40 }, offset: { x: -22, y: -45 }, flightHeight: 40 }, }; // --- Global Asset Variables --- - let forestSVG, villageSVG, citySVG, playerSVG, enchantedForestSVG, swampSVG, wolfPackSVG, boarSVG, birdSVG, farmSVG, campSVG, npcSVG, houseSVG, cultSVG, marketSVG, mineSVG; - - + let forestSVG, villageSVG, citySVG, playerSVG, enchantedForestSVG, swampSVG, wolfPackSVG, boarSVG, birdSVG, farmSVG, campSVG, npcSVG; + let geminiApiKey = ""; + + // --- QUEST DATABASE --- + const QUEST_DATABASE = { + 'WOLF_MENACE': { + title: "La menace des loups", + stages: { + 0: { + text: "Les loups sont devenus bien trop agressifs ces derniers temps. Ils s'approchent du village et effraient les enfants. Pourriez-vous nous aider à chasser quelques-uns d'entre eux ?", + choices: [ + { text: "J'accepte de vous aider.", nextStage: 1 }, + { text: "Désolé, je n'ai pas le temps.", nextStage: null } + ] + }, + 1: { + text: "Merci ! S'il vous plaît, éliminez 3 meutes de loups dans les environs et revenez me voir. Soyez prudent.", + objective: { type: 'kill', target: 'WOLF', count: 3 }, + choices: [ + { text: "Je suis dessus.", nextStage: null } + ] + }, + 2: { + text: "Vous l'avez fait ! Merci, vous avez rendu un grand service au village.", + choices: [ + { text: "Ce n'était rien.", nextStage: 3 } + ] + }, + 3: { + text: "Voici une petite récompense pour vos efforts. Revenez nous voir quand vous voulez !", + reward: { xp: 100, items: [] }, + isEnd: true + } + } + } + }; + + class Sprite { - constructor(biome) { - this.biome = biome; - this.sheet = null; - this.frameWidth = TILE_WIDTH; - this.frameHeight = TILE_HEIGHT; - this.frameCount = this.biome.design.frames; - this.animationSpeed = this.biome.design.duration; - this.currentFrame = 0; - this.lastFrameTime = 0; - this.setSheet(this.biome.design.drawer); - } - - update(currentTime) { - if (this.frameCount <= 1) return; // Don't animate static sprites - if (currentTime - this.lastFrameTime > this.animationSpeed) { - this.currentFrame = (this.currentFrame + 1) % this.frameCount; - this.lastFrameTime = currentTime; + constructor(sheet, frameWidth, frameHeight, frameCount, animationSpeed) { + this.sheet = sheet; + this.frameWidth = frameWidth; + this.frameHeight = frameHeight; + this.frameCount = frameCount; + this.animationSpeed = animationSpeed; + this.currentFrame = 0; + this.lastFrameTime = 0; } - } - - draw(ctx, dx, dy) { - if (!this.sheet) return; - const sx = 0; - const sy = this.currentFrame * this.frameHeight; - ctx.drawImage(this.sheet, - sx, sy, this.frameWidth, this.frameHeight, - dx, dy, this.frameWidth, this.frameHeight - ); - } - setSheet(drawer) { - const sheetCanvas = document.createElement('canvas'); - sheetCanvas.width = this.frameWidth; - sheetCanvas.height = this.frameHeight * this.frameCount; - const sheetCtx = sheetCanvas.getContext('2d'); - sheetCtx.imageSmoothingEnabled = false; - for (let frame = 0; frame < this.frameCount; frame++) { - sheetCtx.save(); - sheetCtx.translate(0, frame * this.frameHeight); - drawer(sheetCtx,frame,this.frameWidth,this.frameHeight); - sheetCtx.restore(); + + update(currentTime) { + if (this.frameCount <= 1) return; + if (currentTime - this.lastFrameTime > this.animationSpeed) { + this.currentFrame = (this.currentFrame + 1) % this.frameCount; + this.lastFrameTime = currentTime; + } + } + + draw(ctx, dx, dy) { + if (!this.sheet) return; + const sx = 0; + const sy = this.currentFrame * this.frameHeight; + ctx.drawImage(this.sheet, + sx, sy, this.frameWidth, this.frameHeight, + dx, dy, this.frameWidth, this.frameHeight + ); } - this.sheet= sheetCanvas; - } - } - - class structure { - - constructor(position) { - this.position = position; - this.type = null; - this.name = null; - this.population=null; - this.setType(); - this.setName(); - - //this.setPopulation(); - } - setName() { - var rand = seededRandom(this.position.x * 13 + this.position.y * 59); - const NAME_SUFFIXES = ["bourg", "fort", "ville", "mont", "port", "bois", "rivage", "gard"]; - this.name= this.type.name+ NAME_SUFFIXES[Math.floor(rand() * NAME_SUFFIXES.length)] - } - setDesign(ctx) { - // This function assumes the context is already translated to the tile's origin. - const svgImage = this.type.svgAsset(); - - if (!svgImage) return; - - const size = this.type.size || { w: 40, h: 40 }; - const offset = this.type.offset || { x: -20, y: -35 }; - ctx.drawImage(svgImage, offset.x, offset.y, size.w, size.h); - - } - setType() { - - const types = Object.values(STRUCTURE_TYPE); - const weightedTypes = []; - - // Remplir le tableau pondéré en fonction des occurrences - types.forEach(type => { - const weight = Math.floor(type.spawnChance * 100); - for (let i = 0; i < weight; i++) { - weightedTypes.push(type); - } - }); - - // Sélectionner un type aléatoire dans le tableau pondéré - this.type = weightedTypes[Math.floor(Math.random() * weightedTypes.length)]; - } - - setPopulation() { - - for (let i = 0; i < this.type.population; i++) { - //new NPC - } - } - // Méthode de l'objet - } - class Settlement { - - constructor() { - this.tiles = []; - this.structures = []; - this.name = null; - this.population=null; - this.setType(); - this.setName(); - - //this.setPopulation(); - } - setName() { - var rand = seededRandom(this.position.x * 13 + this.position.y * 59); - const NAME_SUFFIXES = ["bourg", "fort", "ville", "mont", "port", "bois", "rivage", "gard"]; - this.name= this.type.name+ NAME_SUFFIXES[Math.floor(rand() * NAME_SUFFIXES.length)] - } - setType() { - - const types = Object.values(SETTLEMENT_TYPE); - const weightedTypes = []; - - // Remplir le tableau pondéré en fonction des occurrences - types.forEach(type => { - const weight = Math.floor(type.spawnChance * 100); - for (let i = 0; i < weight; i++) { - weightedTypes.push(type); - } - }); - - // Sélectionner un type aléatoire dans le tableau pondéré - this.type = weightedTypes[Math.floor(Math.random() * weightedTypes.length)]; - } - - setPopulation() { - - for (let i = 0; i < this.type.population; i++) { - //new NPC - } - } - // Méthode de l'objet } + class Position{ constructor(x,y,h=0) { this.x = x; this.y = y; this.h = h; } - setPosition(x, y, h=0) { - this.x = x; - this.y = y; - this.h = h; - } - - getPosition() { - return { x: this.x, y: this.y, h: this.h }; - } cartToIso() { return { @@ -275,138 +315,106 @@ document.addEventListener('DOMContentLoaded', () => { } } } - + class Animal { - constructor(type, tile) { - this.type = type; - this.tile = tile; - this.lastMoveTime = 0; - this.moveCooldown = 2000 + Math.random() * 3000; - - // Unifying with Creature class for stats - const animalAttributes = new Attributes({strength: type.strength, vitality: type.hp, dexterity: 1, intelligence: 1, wisdom: 1, luck: 1}); - this.creature = new Creature( - type.name, - animalAttributes, - 1, null, null, tile, - 'ANIMAL', null, - type.hp, type.defense, type.xp, type.loot - ); - - if (this.type.design) { - this.anim = { - frames: this.type.design.frames, - duration: this.type.design.duration, - drawer: this.type.design.drawer, - currentFrame: 0, - lastFrameTime: 0 - } + constructor(type, tile) { + this.type = type; + this.tile = tile; + this.lastMoveTime = 0; + this.moveCooldown = 2000 + Math.random() * 3000; } - } - - update(currentTime, gameMap) { - if (this.anim) { - if (currentTime - this.anim.lastFrameTime > this.anim.duration) { - this.anim.currentFrame = (this.anim.currentFrame + 1) % this.anim.frames; - this.anim.lastFrameTime = currentTime; + + update(currentTime, gameMap) { + if (currentTime - this.lastMoveTime > this.moveCooldown) { + this.move(gameMap); + this.lastMoveTime = currentTime; + this.moveCooldown = 2000 + Math.random() * 3000; } } - if (currentTime - this.lastMoveTime > this.moveCooldown) { - this.move(gameMap); - this.lastMoveTime = currentTime; - this.moveCooldown = 2000 + Math.random() * 3000; - } - } - - move(gameMap) { - const possibleMoves = [ { dx: 0, dy: -1 }, { dx: 0, dy: 1 }, { dx: -1, dy: 0 }, { dx: 1, dy: 0 }]; - const move = possibleMoves[Math.floor(Math.random() * possibleMoves.length)]; - const newX = this.tile.position.x + move.dx; - const newY = this.tile.position.y + move.dy; - - if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) { - const targetTile = gameMap.tiles[newY][newX]; - if (targetTile.biome && - targetTile.biome.type.movements.includes(this.type.movement) && - this.type.biomes.includes(targetTile.biome.type)) { - const oldTile = this.tile; - const entityIndex = oldTile.entities.indexOf(this); - if (entityIndex > -1) { - oldTile.entities.splice(entityIndex, 1); + move(gameMap) { + const possibleMoves = [ { dx: 0, dy: -1 }, { dx: 0, dy: 1 }, { dx: -1, dy: 0 }, { dx: 1, dy: 0 }]; + const move = possibleMoves[Math.floor(Math.random() * possibleMoves.length)]; + const newX = this.tile.position.x + move.dx; + const newY = this.tile.position.y + move.dy; + + if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) { + const targetTile = gameMap.tiles[newY][newX]; + const canMoveGround = this.type.movementClass === 'ground' && targetTile.biome && (targetTile.biome.movements.includes('walk') || targetTile.biome.movements.includes('climb')); + const canFly = this.type.movementClass === 'fly' && targetTile.biome; + + if ((canMoveGround || canFly) && this.type.biomes.includes(targetTile.biome)) { + this.tile = targetTile; + } } - - targetTile.entities.push(this); - this.tile = targetTile; - this.creature.tile = targetTile; - } - } - } - - setDesign(ctx) { - if (!this.tile || this.tile.visibility !== 2) return; - - 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(0, -flightHeight); - - if (flightHeight > 0) { - ctx.fillStyle = 'rgba(0,0,0,0.2)'; - ctx.beginPath(); - ctx.ellipse(0, flightHeight, size.w / 2, size.w / 4, 0, 0, 2 * Math.PI); - ctx.fill(); } - if (this.anim) { - ctx.save(); - ctx.translate(offset.x, offset.y); - this.anim.drawer(ctx, this.anim.currentFrame, size.w, size.h); - ctx.restore(); - } else if (this.type.svgAsset) { + setDesign(ctx) { + if (!this.tile || this.tile.visibility !== 2) return; const svgImage = this.type.svgAsset(); - if (svgImage) { - ctx.drawImage(svgImage, offset.x, offset.y, size.w, size.h); - } - } + if (!svgImage) return; - ctx.restore(); - } - } - class Biome { - constructor() { - this.type=null; - } - setType(position){ - let scale = 0.05; - let eRaw = (simplex.noise2D(position.x * scale, position.y * scale) + 1) / 2; - let tRaw = (simplex.noise2D(position.x * scale * 0.8, position.y * scale * 0.8) + 1) / 2; - let mRaw = (simplex.noise2D(position.x * scale * 1.5, position.y * scale * 1.5) + 1) / 2; - if (eRaw < 0.25) this.type = BIOME_TYPE.WATER_DEEP; - else if (eRaw < 0.3) this.type = BIOME_TYPE.WATER_SHALLOW; - else if (eRaw < 0.32) this.type = BIOME_TYPE.SWAMP; - else if (eRaw < 0.35) this.type = BIOME_TYPE.BEACH; - else if (eRaw > 0.85) this.type = BIOME_TYPE.SNOWMOUNTAIN; - else if (eRaw > 0.75) this.type = BIOME_TYPE.MOUNTAIN; - else { - if (tRaw < 0.3) this.type = BIOME_TYPE.DESERT; - else if (tRaw > 0.6) this.type = (mRaw > 0.7) ? BIOME_TYPE.ENCHANTED_FOREST : BIOME_TYPE.FOREST; - else this.type = BIOME_TYPE.GRASSLAND; + 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 - 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(); } - }; - setDesign(ctx, position){ - const screenPos = position.cartToIso(); - const elevationHeight = position.h * ELEVATION_STEP; + } + + class Tile { + + constructor(x, y) { + this.position = new Position(x, y); + this.biome = null; + this.structure = null; + this.visibility = 0; // 0: Unseen, 1: Seen, 2: Visible + this.setBiome(); + this.setElevation(); + this.setStructure(); + } + + setBiome() { + let scale = 0.05; + let eRaw = (simplex.noise2D(this.position.x * scale, this.position.y * scale) + 1) / 2; + let tRaw = (simplex.noise2D(this.position.x * scale * 0.8, this.position.y * scale * 0.8) + 1) / 2; + let mRaw = (simplex.noise2D(this.position.x * scale * 1.5, this.position.y * scale * 1.5) + 1) / 2; + if (eRaw < 0.25) this.biome = Biome.WATER_DEEP; + else if (eRaw < 0.3) this.biome = Biome.WATER_SHALLOW; + else if (eRaw < 0.32) this.biome = Biome.SWAMP; + else if (eRaw < 0.35) this.biome = Biome.BEACH; + else if (eRaw > 0.85) this.biome = Biome.SNOWMOUNTAIN; + else if (eRaw > 0.75) this.biome = Biome.MOUNTAIN; + else { + if (tRaw < 0.3) this.biome = Biome.DESERT; + else if (tRaw > 0.6) this.biome = (mRaw > 0.7) ? Biome.ENCHANTED_FOREST : Biome.FOREST; + else this.biome = Biome.GRASSLAND; + } + } + + setDesign(ctx){ + if (!this.biome || this.visibility === 0) return; + + const screenPos = this.position.cartToIso(); + const elevationHeight = this.position.h * ELEVATION_STEP; ctx.save(); ctx.translate(screenPos.x, screenPos.y - elevationHeight); - const baseColor = this.type.summerColor; + const baseColor = this.biome.summerColor; const shadowColor = shadeColor(baseColor, -30); - // Draw tile faces ctx.fillStyle = shadowColor; ctx.beginPath(); ctx.moveTo(0, TILE_HEIGHT); ctx.lineTo(TILE_WIDTH / 2, TILE_HEIGHT / 2); ctx.lineTo(TILE_WIDTH / 2, TILE_HEIGHT / 2 + elevationHeight); ctx.lineTo(0, TILE_HEIGHT + elevationHeight); @@ -419,9 +427,8 @@ document.addEventListener('DOMContentLoaded', () => { ctx.closePath(); ctx.fill(); - // Draw top surface using a sprite if available - if (this.type.sprite) { - this.type.sprite.draw(ctx, -TILE_WIDTH / 2, 0); + if (this.biome.sprite) { + this.biome.sprite.draw(ctx, -TILE_WIDTH / 2, 0); } else { ctx.fillStyle = baseColor; ctx.beginPath(); @@ -429,82 +436,28 @@ document.addEventListener('DOMContentLoaded', () => { ctx.closePath(); ctx.fill(); } - if (this.type === BIOME_TYPE.FOREST && forestSVG) { - ctx.drawImage(forestSVG, -25, -25, 50, 50); - } else if (this.type === BIOME_TYPE.ENCHANTED_FOREST && enchantedForestSVG) { - ctx.drawImage(enchantedForestSVG, -25, -25, 50, 50); - } else if (this.type === BIOME_TYPE.SWAMP && swampSVG) { - ctx.drawImage(swampSVG, -25, -5, 50, 30); - } - - ctx.restore(); // Correction: Restore the context after drawing - }; - } - class Tile { - - constructor(x, y) { - this.position = new Position(x, y); - this.biome = null; - this.structure = null; - this.entities = []; - this.visibility = 0; // 0: Unseen, 1: Seen, 2: Visible - this.isRoad = false; - this.hasBridge = false; - this.setBiome(); - this.setElevation(); - this.setStructure(); - this.setEntities(); - } - - setBiome() { - this.biome=new Biome(); - this.biome.setType(this.position); - } - - setDesign(ctx){ - if (!this.biome || this.visibility === 0) return; - - this.biome.setDesign(ctx,this.position); - - const screenPos = this.position.cartToIso(); - const elevationHeight = this.position.h * ELEVATION_STEP; - - // We need a dedicated save/restore block for entities and features on this tile - ctx.save(); - ctx.translate(screenPos.x, screenPos.y - elevationHeight); - - if (this.isRoad) { - ctx.fillStyle = '#a1662f'; // Dirt road color - ctx.globalAlpha = 0.7; - ctx.beginPath(); - ctx.moveTo(0, 0); ctx.lineTo(TILE_WIDTH / 2, TILE_HEIGHT / 2); ctx.lineTo(0, TILE_HEIGHT); ctx.lineTo(-TILE_WIDTH / 2, TILE_HEIGHT / 2); - ctx.closePath(); - ctx.fill(); - ctx.globalAlpha = 1.0; - } else if (this.hasBridge) { - ctx.fillStyle = '#8B4513'; // Wood color - ctx.globalAlpha = 0.9; - ctx.beginPath(); - ctx.moveTo(0, 0); ctx.lineTo(TILE_WIDTH / 2, TILE_HEIGHT / 2); ctx.lineTo(0, TILE_HEIGHT); ctx.lineTo(-TILE_WIDTH / 2, TILE_HEIGHT / 2); - ctx.closePath(); - ctx.fill(); - ctx.globalAlpha = 1.0; - } if(this.visibility === 2) { - if (this.structure) this.structure.setDesign(ctx); - this.entities.forEach(e => { - if (e.setDesign) e.setDesign(ctx) - }); + if (this.biome === Biome.FOREST && forestSVG) { + ctx.drawImage(forestSVG, -25, -25, 50, 50); + } else if (this.biome === Biome.ENCHANTED_FOREST && enchantedForestSVG) { + ctx.drawImage(enchantedForestSVG, -25, -25, 50, 50); + } else if (this.biome === Biome.SWAMP && swampSVG) { + ctx.drawImage(swampSVG, -25, -5, 50, 30); + } + + if (this.structure) { + const svg = this.structure.type.svg(); + ctx.drawImage(svg, -20, -20, 40, 40); + } } - - // Draw fog overlay if seen but not currently visible + if (this.visibility === 1) { - ctx.fillStyle = 'rgba(0,0,0,0.5)'; - ctx.beginPath(); - ctx.moveTo(0, 0); ctx.lineTo(TILE_WIDTH / 2, TILE_HEIGHT / 2); ctx.lineTo(0, TILE_HEIGHT); ctx.lineTo(-TILE_WIDTH / 2, TILE_HEIGHT / 2); - ctx.closePath(); - ctx.fill(); + ctx.fillStyle = 'rgba(0,0,0,0.5)'; + ctx.beginPath(); + ctx.moveTo(0, 0); ctx.lineTo(TILE_WIDTH / 2, TILE_HEIGHT / 2); ctx.lineTo(0, TILE_HEIGHT); ctx.lineTo(-TILE_WIDTH / 2, TILE_HEIGHT / 2); + ctx.closePath(); + ctx.fill(); } ctx.restore(); @@ -512,148 +465,41 @@ document.addEventListener('DOMContentLoaded', () => { setElevation(){ if (!this.biome) return; - this.position.h = Math.floor(Math.random() * (this.biome.type.maxElevation - this.biome.type.minElevation+ 1) + this.biome.type.minElevation); + this.position.h = Math.floor(Math.random() * (this.biome.maxElevation - this.biome.minElevation+ 1) + this.biome.minElevation); } - + setStructure(){ + if (!this.biome || !this.biome.acceptStructure) return; var rand = seededRandom(this.position.x * 13 + this.position.y * 59); - var structureChance = rand(); - if (structureChance < 0.01 && this.biome.type.acceptStructure) { - this.structure=new structure(this.position); - } - } - 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++) { - const creature = new Creature( - job.name, - new Attributes(RACE.HUMAN), - 1, - null, - null, - this, // la tuile du NPC - 'HUMAN', - RACE.HUMAN, - 10, 1, 0, {} - ); - 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]; - - 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)); - } + + let chance = rand(); + let cumulativeChance = 0; + + for(const key in STRUCTURE_TYPE) { + const type = STRUCTURE_TYPE[key]; + cumulativeChance += type.spawnChance; + if (chance < cumulativeChance) { + this.structure = { + type: type, + name: type.name === 'Campement' ? 'Campement de bandits' : (NAME_PREFIXES[Math.floor(rand() * NAME_PREFIXES.length)] + " " + NAME_SUFFIXES[Math.floor(rand() * NAME_SUFFIXES.length)]) + }; + return; } - } } } } - class Map { constructor(size) { this.size = size; this.tiles = []; this.initializeMap(); - - const structures = []; - this.tiles.forEach(row => { - row.forEach(tile => { - if (tile.structure) { - structures.push(tile.structure); - } - }); - }); - - //const importantStructures = structures.filter(s => s.type !== STRUCTURE_TYPE.CAMP && s.type !== STRUCTURE_TYPE.MINE); - - //this.generateRoads(importantStructures); } initializeMap(){ console.time('Map Generation'); this.tiles = Array(this.size).fill(null).map((_, y) => Array(this.size).fill(null).map((_, x) => new Tile(x, y))); - this.generateRivers(); console.timeEnd('Map Generation'); } - - generateRoads(locations) { - if (locations.length < 2) return; - for (let i = 0; i < locations.length - 1; i++) { - let start = locations[i].position; - let end = locations[i+1].position; - 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.type === BIOME_TYPE.RIVER) { - tile.hasBridge = true; - } else if (tile.biome.type !== BIOME_TYPE.WATER_DEEP && tile.biome.type !== BIOME_TYPE.WATER_SHALLOW && tile.biome.type !== BIOME_TYPE.MOUNTAIN && tile.biome.type !== BIOME_TYPE.SNOWMOUNTAIN) { - 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.type !== BIOME_TYPE.MOUNTAIN) continue; - - let maxLength = 200; - while (maxLength > 0) { - maxLength--; - const currentTile = this.tiles[currentY][currentX]; - if (currentTile.biome.type === BIOME_TYPE.WATER_DEEP || currentTile.biome.type === BIOME_TYPE.WATER_SHALLOW) break; - - currentTile.biome.type = BIOME_TYPE.RIVER; - currentTile.position.h = Math.max(1, currentTile.position.h -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.position.h; - - 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.position.h < lowestElevation) { - lowestElevation = neighborTile.position.h; - lowestNeighbor = {x: nx, y: ny}; - } - } - } - - if (lowestNeighbor) { - currentX = lowestNeighbor.x; - currentY = lowestNeighbor.y; - } else { - break; - } - } - } - } } class Time { constructor() { @@ -680,7 +526,6 @@ document.addEventListener('DOMContentLoaded', () => { setDesign(ctx){ - let overlayColor = 'rgba(0,0,0,0)'; let opacity = 0; if (this.hour >= 20 || this.hour < 6) { @@ -698,6 +543,7 @@ document.addEventListener('DOMContentLoaded', () => { ctx.globalAlpha = 1.0; } } + } class Attributes { constructor(race) { @@ -711,113 +557,83 @@ document.addEventListener('DOMContentLoaded', () => { } class Creature { - constructor(name,attributes,level,affinities,alignments,tile,species,race,hp,defense,xp,loot,items) { + constructor(name,attributes,level,affinities,alignments,tile,species,race,hp,items) { this.name = name; this.attributes = attributes; this.level = level; - this.xp = xp || 0; this.affinities = affinities; + this.name = name; this.alignments = alignments; this.species = species; this.race = race; this.tile=tile; this.items=items; - this.maxHp = hp; - this.currentHp = hp; - this.defense = defense || 0; - this.loot = loot || {}; + this.hp=hp; } } - class Npc { - constructor(job,creature,settlement,equipments) { - this.job = job; - this.creature = creature; - this.tile = creature.tile; - this.structure = settlement; // The NPC's home structure - this.equipments = equipments || []; + constructor(type, homeTile) { + this.type = type; + this.tile = homeTile; + this.homeTile = homeTile; this.lastMoveTime = 0; this.moveCooldown = 3000 + Math.random() * 4000; + this.questId = null; } - - setEquipments() { - var i=0; - const items = Object.values(ITEMS); - const weightedTypes = []; - var compatibleItem=null; - for (const slot in SLOT) { - var slotChance = rand(); - if (slotChance < 0.005) { - - items.forEach(item => { - if (ITEM_TYPE[item.itemType].slot.includes(slot)){ - const weight = Math.floor(item.spawnChance * 100); - for (let i = 0; i < weight; i++) { - weightedTypes.push(item); - } - } - }); - compatibleItem = weightedTypes[Math.floor(Math.random() * weightedTypes.length)]; - this.equipments[i]=new equipment(slot,compatibleItem); - } - }; + + assignQuest(questId) { + this.questId = questId; } + update(currentTime, gameMap) { if (currentTime - this.lastMoveTime > this.moveCooldown) { this.move(gameMap); this.lastMoveTime = currentTime; } } - - move(gameMap) { - if (!this.tile || !this.structure) return; - const wanderRadius = 5; // Let them wander a bit further - const possibleMoves = []; - - const homeX = this.structure.position.x; - const homeY = this.structure.position.y; + move(gameMap) { + const wanderRadius = 3; + const possibleMoves = []; for (let y = -wanderRadius; y <= wanderRadius; y++) { for (let x = -wanderRadius; x <= wanderRadius; x++) { - const newX = homeX + x; - const newY = homeY + y; - + const newX = this.homeTile.position.x + x; + const newY = this.homeTile.position.y + y; if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) { const targetTile = gameMap.tiles[newY][newX]; - if (targetTile.biome.type.movements.includes('walk') && !targetTile.structure) { - possibleMoves.push(targetTile); + if(targetTile.biome.movements.includes('walk') && !targetTile.structure) { + possibleMoves.push(targetTile); } } } } - - if (possibleMoves.length > 0) { - const targetTile = possibleMoves[Math.floor(Math.random() * possibleMoves.length)]; - - // Remove from old tile - const oldTile = this.tile; - const entityIndex = oldTile.entities.indexOf(this); - if (entityIndex > -1) { - oldTile.entities.splice(entityIndex, 1); - } - - // Add to new tile - targetTile.entities.push(this); - this.tile = targetTile; - this.creature.tile = this.tile; + if(possibleMoves.length > 0) { + this.tile = possibleMoves[Math.floor(Math.random() * possibleMoves.length)]; } } - + setDesign(ctx) { if (!this.tile || this.tile.visibility !== 2) return; - // The context is already translated by Tile.setDesign. We just draw the asset. + + const screenPos = this.tile.position.cartToIso(); + const elevationHeight = this.tile.position.h * ELEVATION_STEP; + + ctx.save(); + ctx.translate(screenPos.x, screenPos.y - elevationHeight); ctx.drawImage(npcSVG, -25, -50, 50, 60); + ctx.restore(); } - interact() { - const dialogue = this.job.dialogues[Math.floor(Math.random() * this.job.dialogues.length)]; - return { name: this.job.name, text: dialogue }; + getDialogue(questManager) { + if(this.questId) { + let quest = questManager.getQuest(this.questId); + if(quest && quest.status !== 'completed') { + return { name: this.type.name, ...quest.getCurrentStage() }; + } + } + const randomDialogue = this.type.dialogues[Math.floor(Math.random() * this.type.dialogues.length)]; + return { name: this.type.name, text: randomDialogue, choices: [] }; } } @@ -825,29 +641,17 @@ document.addEventListener('DOMContentLoaded', () => { constructor(creature,equipments) { this.creature=creature; this.equipments=equipments; - this.inventory = {}; } - - addXp(amount) { - this.creature.xp += amount; - // Basic leveling up for demonstration - const xpForNextLevel = 100 * this.creature.level; - if (this.creature.xp >= xpForNextLevel) { - this.creature.level++; - this.creature.xp -= xpForNextLevel; - this.creature.attributes.strength++; - this.creature.attributes.vitality++; - this.creature.maxHp += 10; - this.creature.currentHp = this.creature.maxHp; // Full heal on level up - } + get position() { + return this.creature.tile.position; } - + setDesign(ctx) { - const position = this.creature.tile.position - if(!position) return; + const tile = this.creature.tile + if(!tile) return; - const screenPos = position.cartToIso(); - const elevationHeight = position.h * ELEVATION_STEP; + const screenPos = tile.position.cartToIso(); + const elevationHeight = tile.position.h * ELEVATION_STEP; ctx.save(); ctx.translate(screenPos.x, screenPos.y - elevationHeight); @@ -860,168 +664,90 @@ document.addEventListener('DOMContentLoaded', () => { ctx.restore(); } move(dx, dy, gameMap) { - const newX = this.creature.tile.position.x + dx; - const newY = this.creature.tile.position.y + dy; + const newX = this.position.x + dx; + const newY = this.position.y + dy; if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) { const targetTile = gameMap.tiles[newY][newX]; - if (targetTile.biome && targetTile.biome.type.movements.includes('walk')) { + if (targetTile.biome && targetTile.biome.movements.includes('walk')) { this.creature.tile = targetTile; } } } } - class Combat { - constructor(player, opponent, session) { - this.player = player; - this.opponent = opponent; - this.session = session; // To control game state - this.attackBtnListener = () => this.handleAttack(); - this.startCombat(); - } - startCombat() { - this.session.gameState = 'combat'; - document.getElementById('combat-screen').classList.remove('hidden'); - document.getElementById('combat-screen').classList.add('flex'); - document.getElementById('attack-btn').addEventListener('click', this.attackBtnListener); - document.getElementById('combat-log').textContent = `Un ${this.opponent.creature.name} sauvage apparaît !`; - this.updateCombatUI(); - } - - handleAttack() { - const playerDamage = Math.max(1, this.player.creature.attributes.strength - this.opponent.creature.defense); - this.opponent.creature.currentHp = Math.max(0, this.opponent.creature.currentHp - playerDamage); - document.getElementById('combat-log').textContent = `Vous infligez ${playerDamage} dégâts.`; - this.updateCombatUI(); - - if (this.opponent.creature.currentHp <= 0) { - this.endCombat(true); - return; - } - - document.getElementById('attack-btn').disabled = true; - - setTimeout(() => { - const opponentDamage = Math.max(1, this.opponent.creature.attributes.strength - this.player.creature.defense); - this.player.creature.currentHp = Math.max(0, this.player.creature.currentHp - opponentDamage); - document.getElementById('combat-log').textContent += `\nLe ${this.opponent.creature.name} riposte et vous inflige ${opponentDamage} dégâts.`; - this.updateCombatUI(); - - if (this.player.creature.currentHp <= 0) { - this.endCombat(false); - } else { - document.getElementById('attack-btn').disabled = false; - } - }, 1000); - } - - endCombat(isVictory) { - document.getElementById('attack-btn').removeEventListener('click', this.attackBtnListener); - const combatLog = document.getElementById('combat-log'); - - if (isVictory) { - combatLog.textContent = `Vous avez vaincu le ${this.opponent.creature.name} !`; - this.player.addXp(this.opponent.creature.xp); - combatLog.textContent += `\nVous gagnez ${this.opponent.creature.xp} XP.`; - - Object.entries(this.opponent.creature.loot).forEach(([item, amount]) => { - this.player.inventory[item] = (this.player.inventory[item] || 0) + amount; - combatLog.textContent += `\nVous trouvez ${amount} ${item}.`; - }); - - const opponentTile = this.opponent.tile; - const entityIndex = opponentTile.entities.indexOf(this.opponent); - if(entityIndex > -1) { - opponentTile.entities.splice(entityIndex, 1); - } - } else { - combatLog.textContent = `Vous avez été vaincu...`; - this.player.creature.currentHp = 1; - } - - setTimeout(() => { - document.getElementById('combat-screen').classList.add('hidden'); - document.getElementById('combat-screen').classList.remove('flex'); - this.session.gameState = 'exploring'; - this.session.currentCombat = null; - this.session.updateAllInfoPanels(); - }, 3000); - } - - updateCombatUI() { - const playerCreature = this.player.creature; - const opponentCreature = this.opponent.creature; - - document.getElementById('combat-player-hp-text').textContent = `${playerCreature.currentHp} / ${playerCreature.maxHp}`; - document.getElementById('combat-player-hp-bar').style.width = `${(playerCreature.currentHp / playerCreature.maxHp) * 100}%`; - - document.getElementById('combat-opponent-name').textContent = opponentCreature.name; - - // Use SVG asset for opponent icon if available - if (this.opponent.type && this.opponent.type.svgAsset) { - const svgImage = this.opponent.type.svgAsset(); - document.getElementById('combat-opponent-icon').innerHTML = ``; - } else { - document.getElementById('combat-opponent-icon').textContent = '👹'; // Fallback - } - - document.getElementById('combat-opponent-hp-text').textContent = `${opponentCreature.currentHp} / ${opponentCreature.maxHp}`; - document.getElementById('combat-opponent-hp-bar').style.width = `${(opponentCreature.currentHp / opponentCreature.maxHp) * 100}%`; - } - - } + class Quest { - constructor( ) { - this.id = null; - this.definition = null; - this.currentStage = 0; - this.status = 'inactive'; // inactive, active, completed - + constructor(id, definition) { + this.id = id; + this.definition = definition; + this.currentStage = 0; + this.status = 'inactive'; // inactive, active, completed } - + getCurrentStage() { - return this.definition.stages[this.currentStage]; + return this.definition.stages[this.currentStage]; } - + advance(choiceIndex) { - const stage = this.getCurrentStage(); - if(stage.choices && stage.choices[choiceIndex]) { - const nextStageIndex = stage.choices[choiceIndex].nextStage; - if (nextStageIndex !== null) { - this.currentStage = nextStageIndex; - if(this.status === 'inactive') this.status = 'active'; - if(this.getCurrentStage().isEnd) { - this.status = 'completed'; - } + const stage = this.getCurrentStage(); + if(stage.choices && stage.choices[choiceIndex]) { + const nextStageIndex = stage.choices[choiceIndex].nextStage; + if (nextStageIndex !== null) { + this.currentStage = nextStageIndex; + if(this.status === 'inactive') this.status = 'active'; + if(this.getCurrentStage().isEnd) { + this.status = 'completed'; + } + } } - } - } - async setQuest(npc) { - if(npc.questId && this.quests[npc.questId]) { - return this.quests[npc.questId]; - } - try { - const questDefinition = await this.generateQuestForNpc(npc); - if(questDefinition) { - const questId = `GEMINI_${Date.now()}`; - npc.assignQuest(questId); - this.id=questId; - this.definition=questDefinition; - } - } catch(e) { - console.error("Gemini quest generation failed, using fallback.", e); - const fallbackId = 'WOLF_MENACE'; - npc.assignQuest(fallbackId); - this.id=fallbackId; - this.definition=QUEST_DATABASE[fallbackId]; - } - return null; } - async generateQuestForNpc(npc) { - if (!geminiApiKey) { - throw new Error("API key is missing."); + } + + class QuestManager { + constructor(questGenerator) { + this.quests = {}; + this.generator = questGenerator; + } + + getQuest(questId) { + return this.quests[questId]; + } + + startQuest(questId, questDefinition) { + if(!this.quests[questId]) { + this.quests[questId] = new Quest(questId, questDefinition); + } + return this.quests[questId]; } - const prompt = `Génère une quête simple pour un jeu RPG en 2D isométrique. + async getQuestForNpc(npc) { + if(npc.questId && this.quests[npc.questId]) { + return this.quests[npc.questId]; + } + + try { + const questDefinition = await this.generator.generateQuestForNpc(npc); + if(questDefinition) { + const questId = `GEMINI_${Date.now()}`; + npc.assignQuest(questId); + return this.startQuest(questId, questDefinition); + } + } catch(e) { + console.error("Gemini quest generation failed, using fallback.", e); + const fallbackId = 'WOLF_MENACE'; + npc.assignQuest(fallbackId); + return this.startQuest(fallbackId, QUEST_DATABASE[fallbackId]); + } + return null; + } + } + + class GeminiQuestGenerator { + async generateQuestForNpc(npc) { + if (!geminiApiKey) { + throw new Error("API key is missing."); + } + + const prompt = `Génère une quête simple pour un jeu RPG en 2D isométrique. Le PNJ est un "${npc.type.name}". Il se trouve près d'une structure de type "${npc.homeTile.structure.type.name}" dans un biome de type "${npc.homeTile.biome.name}". @@ -1032,175 +758,112 @@ document.addEventListener('DOMContentLoaded', () => { Réponds UNIQUEMENT avec un objet JSON valide qui suit le schéma ci-dessous. N'ajoute aucun texte avant ou après le JSON. `; - - const payload = { - contents: [{ parts: [{ text: prompt }] }], - generationConfig: { - responseMimeType: "application/json", - responseSchema: { - type: "OBJECT", - properties: { - "title": { "type": "STRING" }, - "stages": { - "type": "ARRAY", - "items": { - "type": "OBJECT", - "properties": { - "text": { "type": "STRING" }, - "choices": { - "type": "ARRAY", - "items": { - "type": "OBJECT", - "properties": { - "text": { "type": "STRING" }, - "nextStage": { "type": ["NUMBER", "NULL"] } - }, - "required": ["text"] - } - }, - "objective": { "type": ["OBJECT", "NULL"], "properties": {"type": {"type": "STRING"}, "target": {"type": "STRING"}, "count": {"type": "NUMBER"}} }, - "reward": { "type": ["OBJECT", "NULL"], "properties": {"xp": {"type": "NUMBER"}, "items": {"type": "ARRAY", "items": { "type": "STRING" }}} }, - "isEnd": { "type": ["BOOLEAN", "NULL"] } - }, - "required": ["text", "choices"] - } + + const payload = { + contents: [{ parts: [{ text: prompt }] }], + generationConfig: { + responseMimeType: "application/json", + responseSchema: { + type: "OBJECT", + properties: { + "title": { "type": "STRING" }, + "stages": { + "type": "ARRAY", + "items": { + "type": "OBJECT", + "properties": { + "text": { "type": "STRING" }, + "choices": { + "type": "ARRAY", + "items": { + "type": "OBJECT", + "properties": { + "text": { "type": "STRING" }, + "nextStage": { "type": ["NUMBER", "NULL"] } + }, + "required": ["text"] + } + }, + "objective": { "type": ["OBJECT", "NULL"], "properties": {"type": {"type": "STRING"}, "target": {"type": "STRING"}, "count": {"type": "NUMBER"}} }, + "reward": { "type": ["OBJECT", "NULL"], "properties": {"xp": {"type": "NUMBER"}, "items": {"type": "ARRAY", "items": { "type": "STRING" }}} }, + "isEnd": { "type": ["BOOLEAN", "NULL"] } + }, + "required": ["text", "choices"] + } + } + }, + "required": ["title", "stages"] + } } - }, - "required": ["title", "stages"] + }; + + const apiUrl = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash-preview-05-20:generateContent?key=${geminiApiKey}`; + + const response = await fetch(apiUrl, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(payload) + }); + + if (!response.ok) { + const errorBody = await response.text(); + console.error("API Error Body:", errorBody); + throw new Error(`API call failed with status: ${response.status}`); } - } - }; - - const apiUrl = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash-preview-05-20:generateContent?key=${geminiApiKey}`; - - const response = await fetch(apiUrl, { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify(payload) - }); - - if (!response.ok) { - const errorBody = await response.text(); - console.error("API Error Body:", errorBody); - throw new Error(`API call failed with status: ${response.status}`); + + const result = await response.json(); + const jsonText = result.candidates?.[0]?.content?.parts?.[0]?.text; + if(jsonText) { + return JSON.parse(jsonText); + } + throw new Error("Invalid response from API."); } - - const result = await response.json(); - const jsonText = result.candidates?.[0]?.content?.parts?.[0]?.text; - if(jsonText) { - return JSON.parse(jsonText); - } - throw new Error("Invalid response from API."); - } } - + class World { constructor(name) { this.name = name; this.map = new Map(200); this.currentTime=new Time(); - this.camera = new Camera(0,0, canvas); - this.player=null; + this.animals = []; + this.npcs = []; + this.questManager = new QuestManager(new GeminiQuestGenerator()); + this.spawnEntities(); } - setDesign(){ - ctx.fillStyle = '#000000'; - ctx.fillRect(0, 0, canvas.width, canvas.height); - - ctx.save(); - ctx.translate(this.camera.x, this.camera.y); - - const [startX, endX, startY, endY] = this.getVisibleTileBounds(); - - for (let y = startY; y < endY; y++) { - for (let x = startX; x < endX; x++) { - if (this.map.tiles[y] && this.map.tiles[y][x]) { - this.map.tiles[y][x].setDesign(ctx); - } + + spawnEntities() { + console.time('Entity Spawning'); + for (let y = 0; y < this.map.size; y++) { + for (let x = 0; x < this.map.size; x++) { + const tile = this.map.tiles[y][x]; + + if(tile.structure) { + const structureType = tile.structure.type; + let npcType = NPC_TYPES.VILLAGER; + if(structureType === STRUCTURE_TYPE.FARM) npcType = NPC_TYPES.FARMER; + if(structureType === STRUCTURE_TYPE.CAMP) npcType = NPC_TYPES.BANDIT; + + for(let i = 0; i < structureType.population; i++) { + this.npcs.push(new Npc(npcType, tile)); + } + } + + if (tile.biome) { + for (const key in ANIMAL_TYPES) { + const animalType = ANIMAL_TYPES[key]; + if (animalType.biomes.includes(tile.biome) && Math.random() < animalType.spawnChance) { + if(animalType.movementClass === 'ground' && tile.biome.movements.includes('walk')) { + this.animals.push(new Animal(animalType, tile)); + } else if (animalType.movementClass === 'fly') { + this.animals.push(new Animal(animalType, tile)); + } + } + } + } + } } - } - - this.player.setDesign(ctx); - - ctx.restore(); - ctx.save(); - this.currentTime.setDesign(ctx); - ctx.restore(); - - } - getVisibleTileBounds() { - const margin = 5; - const viewWidth = canvas.width; - const viewHeight = canvas.height; - - const isoToCart = (isoX, isoY) => { - const cartX = (isoX / (TILE_WIDTH / 2) + isoY / (TILE_HEIGHT / 2)) / 2; - const cartY = (isoY / (TILE_HEIGHT / 2) - isoX / (TILE_WIDTH / 2)) / 2; - return { x: Math.floor(cartX), y: Math.floor(cartY) }; - }; - - const topLeft = isoToCart(-this.camera.x, -this.camera.y); - const bottomRight = isoToCart(-this.camera.x + viewWidth, -this.camera.y + viewHeight); - - const startX = Math.max(0, topLeft.x - margin); - const endX = Math.min(this.map.size - 1, bottomRight.x + margin); - const startY = Math.max(0, topLeft.y - margin); - const endY = Math.min(this.map.size - 1, bottomRight.y + margin); - - return [startX, endX, startY, endY]; - } - update(currentTime) { - - this.updateVisibility(this.player.creature.tile.position); - - const [startX, endX, startY, endY] = this.getVisibleTileBounds(); - for (let y = startY; y < endY; y++) { - for (let x = startX; x < endX; x++) { - const tile = this.map.tiles[y]?.[x]; - if (tile && tile.visibility === 2) { - [...tile.entities].forEach(e => { - if (e.update) { - e.update(currentTime, this.map); - } - }); - } - } - } - - this.camera.setCamera(this.player.creature.tile.position); - - for (const key in BIOME_TYPE) { - if (BIOME_TYPE[key].sprite) { - BIOME_TYPE[key].sprite.update(currentTime); - } - } - - this.currentTime.tick(); - } - updateVisibility(position) { - const px = position.x; - const py = position.y; - const radius = VISION_RADIUS; - const radiusSq = radius * radius; - - const viewBox = { - minX: Math.max(0, px - radius - 2), - maxX: Math.min(this.map.size - 1, px + radius + 2), - minY: Math.max(0, py - radius - 2), - maxY: Math.min(this.map.size - 1, py + radius + 2) - }; - - for(let y = viewBox.minY; y <= viewBox.maxY; y++) { - for(let x = viewBox.minX; x <= viewBox.maxX; x++) { - const tile = this.map.tiles[y][x]; - if(tile.visibility === 2) tile.visibility = 1; - - const dx = px - x; - const dy = py - y; - if (dx * dx + dy * dy <= radiusSq) { - tile.visibility = 2; - } - } - } + console.log(`Spawned ${this.animals.length} animals and ${this.npcs.length} NPCs.`); + console.timeEnd('Entity Spawning'); } } class Camera { @@ -1220,171 +883,269 @@ document.addEventListener('DOMContentLoaded', () => { constructor() { this.world = new World('Defiance'); - this.gameState = 'exploring'; // Can be 'exploring', 'dialogue', 'combat' - this.currentCombat = null; + this.camera = new Camera(0,0, canvas); + this.isDialogueActive = false; this.setControls(); this.loop = this.loop.bind(this); + this.player=null; this.setInitial(); - this.updateAllInfoPanels(); } loop(currentTime) { - if (this.gameState === 'exploring') { - this.handleMovement(currentTime); - } - this.world.update(currentTime); - this.world.setDesign(); + this.update(currentTime); + this.setDesign(); requestAnimationFrame(this.loop); } - + + update(currentTime) { + if(this.isDialogueActive) return; + + this.handleMovement(currentTime); + this.updateVisibility(); + + 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.position); + + for (const key in Biome) { + if (Biome[key].sprite) { + Biome[key].sprite.update(currentTime); + } + } + + this.world.currentTime.tick(); + } + + updateVisibility() { + const map = this.world.map; + const px = this.player.position.x; + const py = this.player.position.y; + const radius = VISION_RADIUS; + const radiusSq = radius * radius; + + const viewBox = { + minX: Math.max(0, px - radius - 2), + maxX: Math.min(map.size - 1, px + radius + 2), + minY: Math.max(0, py - radius - 2), + maxY: Math.min(map.size - 1, py + radius + 2) + }; + + for(let y = viewBox.minY; y <= viewBox.maxY; y++) { + for(let x = viewBox.minX; x <= viewBox.maxX; x++) { + const tile = map.tiles[y][x]; + if(tile.visibility === 2) tile.visibility = 1; + + const dx = px - x; + const dy = py - y; + if (dx * dx + dy * dy <= radiusSq) { + tile.visibility = 2; + } + } + } + } + + setInitial(){ let spawnX, spawnY; do { 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') ); - - const playerCreature = new Creature('Héros', new Attributes(RACE.HUMAN), 1, null, null, this.world.map.tiles[spawnY][spawnX], 'human', RACE.HUMAN, 50, 2, 0, {}); - this.world.player = new Player(playerCreature); - - this.world.updateVisibility(this.world.map.tiles[spawnY][spawnX].position); + } while (!this.world.map.tiles[spawnY][spawnX].biome || !this.world.map.tiles[spawnY][spawnX].biome.movements.includes('walk') ); + this.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.updateVisibility(); } setControls() { - document.addEventListener('keydown', e => { - const key = e.key.toLowerCase(); - if (this.gameState === 'exploring') { + document.addEventListener('keydown', e => { + const key = e.key.toLowerCase(); if (key.startsWith('arrow')) { controls[key.replace('arrow', '')] = true; } else if (['w', 'z'].includes(key)) { controls.up = true; } else if (['s'].includes(key)) { controls.down = true; } else if (['a', 'q'].includes(key)) { controls.left = true; } else if (['d'].includes(key)) { controls.right = true; } - else if (key === 'e') { this.handleAction(); } + else if (key === 'e') { + if(!this.isDialogueActive) this.handleInteraction(); + } + }); + document.addEventListener('keyup', e => { + const key = e.key.toLowerCase(); + if (key.startsWith('arrow')) { controls[key.replace('arrow', '')] = false; } + else if (['w', 'z'].includes(key)) { controls.up = false; } + else if (['s'].includes(key)) { controls.down = false; } + else if (['a', 'q'].includes(key)) { controls.left = false; } + else if (['d'].includes(key)) { controls.right = false; } + }); + const controlMap = { 'btn-up': 'up', 'btn-down': 'down', 'btn-left': 'left', 'btn-right': 'right' }; + for (const [id, dir] of Object.entries(controlMap)) { + const btn = document.getElementById(id); + btn.addEventListener('touchstart', e => { e.preventDefault(); controls[dir] = true; }, { passive: false }); + btn.addEventListener('touchend', e => { e.preventDefault(); controls[dir] = false; }); } - }); - document.addEventListener('keyup', e => { - const key = e.key.toLowerCase(); - if (key.startsWith('arrow')) { controls[key.replace('arrow', '')] = false; } - else if (['w', 'z'].includes(key)) { controls.up = false; } - else if (['s'].includes(key)) { controls.down = false; } - else if (['a', 'q'].includes(key)) { controls.left = false; } - else if (['d'].includes(key)) { controls.right = false; } - }); + document.getElementById('btn-action').addEventListener('click', () => { if(!this.isDialogueActive) this.handleInteraction(); }); + document.getElementById('dialogue-close').addEventListener('click', () => this.hideDialogue()); + + const apiKeyInputDesktop = document.getElementById('apiKeyInputDesktop'); + const apiKeyInputMobile = document.getElementById('apiKeyInputMobile'); + + apiKeyInputDesktop.addEventListener('input', (e) => { + geminiApiKey = e.target.value; + apiKeyInputMobile.value = geminiApiKey; + }); + apiKeyInputMobile.addEventListener('input', (e) => { + geminiApiKey = e.target.value; + apiKeyInputDesktop.value = geminiApiKey; + }); + } + setDesign(){ + ctx.fillStyle = '#000000'; + ctx.fillRect(0, 0, canvas.width, canvas.height); - const controlMap = { 'btn-up': 'up', 'btn-down': 'down', 'btn-left': 'left', 'btn-right': 'right' }; - for (const [id, dir] of Object.entries(controlMap)) { - const btn = document.getElementById(id); - btn.addEventListener('touchstart', e => { e.preventDefault(); if(this.gameState === 'exploring') controls[dir] = true; }, { passive: false }); - btn.addEventListener('touchend', e => { e.preventDefault(); controls[dir] = false; }); + ctx.save(); + ctx.translate(this.camera.x, this.camera.y); + + const [startX, endX, startY, endY] = this.getVisibleTileBounds(); + + 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); + } + } } - document.getElementById('btn-action').addEventListener('click', () => { - if (this.gameState === 'exploring') this.handleAction(); - }); + this.world.animals.forEach(animal => animal.setDesign(ctx)); + this.world.npcs.forEach(npc => npc.setDesign(ctx)); + this.player.setDesign(ctx); + + ctx.restore(); + ctx.save(); + this.world.currentTime.setDesign(ctx); + ctx.restore(); + } + getVisibleTileBounds() { + const margin = 5; + const viewWidth = canvas.width; + const viewHeight = canvas.height; + + const isoToCart = (isoX, isoY) => { + const cartX = (isoX / (TILE_WIDTH / 2) + isoY / (TILE_HEIGHT / 2)) / 2; + const cartY = (isoY / (TILE_HEIGHT / 2) - isoX / (TILE_WIDTH / 2)) / 2; + return { x: Math.floor(cartX), y: Math.floor(cartY) }; + }; + + const topLeft = isoToCart(-this.camera.x, -this.camera.y); + const bottomRight = isoToCart(-this.camera.x + viewWidth, -this.camera.y + viewHeight); + + const startX = Math.max(0, topLeft.x - margin); + const endX = Math.min(this.world.map.size - 1, bottomRight.x + margin); + const startY = Math.max(0, topLeft.y - margin); + const endY = Math.min(this.world.map.size - 1, bottomRight.y + margin); + + return [startX, endX, startY, endY]; + } + handleMovement(currentTime) { if (currentTime - lastMoveTime < 150) return; let moved = false; - if (controls.up) { this.world.player.move(0, -1,this.world.map); moved = true; } - if (controls.down) { this.world.player.move(0, 1,this.world.map); moved = true; } - if (controls.left) { this.world.player.move(-1, 0,this.world.map); moved = true; } - if (controls.right) { this.world.player.move(1, 0,this.world.map); moved = true; } - if(moved) { - lastMoveTime = currentTime; - this.updateAllInfoPanels(); - } + if (controls.up) { this.player.move(0, -1,this.world.map); moved = true; } + if (controls.down) { this.player.move(0, 1,this.world.map); moved = true; } + if (controls.left) { this.player.move(-1, 0,this.world.map); moved = true; } + if (controls.right) { this.player.move(1, 0,this.world.map); moved = true; } + if(moved) lastMoveTime = currentTime; } - - handleAction() { - const playerTile = this.world.player.creature.tile; - const px = playerTile.position.x; - const py = playerTile.position.y; + + async handleInteraction() { + const px = this.player.position.x; + const py = this.player.position.y; - let targetEntity = null; + let targetNpc = null; + for (const npc of this.world.npcs) { + const dx = Math.abs(npc.tile.position.x - px); + const dy = Math.abs(npc.tile.position.y - py); + if (dx <= 1 && dy <= 1) { + targetNpc = npc; + break; + } + } - // Check for entities in adjacent tiles - for (let y = -1; y <= 1; y++) { - for (let x = -1; x <= 1; x++) { - if (x === 0 && y === 0) continue; // Skip player's own tile for now - const checkX = px + x; - const checkY = py + y; + if(targetNpc) { + this.showDialogue(targetNpc, {name: targetNpc.type.name, text: "Laissez-moi réfléchir..."}); + const quest = await this.world.questManager.getQuestForNpc(targetNpc); + const dialogueData = targetNpc.getDialogue(this.world.questManager); + this.showDialogue(targetNpc, dialogueData); + } + } - if (checkX >= 0 && checkX < this.world.map.size && checkY >= 0 && checkY < this.world.map.size) { - const adjacentTile = this.world.map.tiles[checkY][checkX]; - const hostileEntity = adjacentTile.entities.find(e => e instanceof Animal && !e.type.nonHostile); - if(hostileEntity) { - targetEntity = hostileEntity; - break; + showDialogue(npc, dialogueData) { + this.isDialogueActive = true; + const dialogueBox = document.getElementById('dialogue-box'); + document.getElementById('dialogue-name').textContent = dialogueData.name; + document.getElementById('dialogue-text').textContent = dialogueData.text; + + const choicesContainer = document.getElementById('dialogue-choices'); + choicesContainer.innerHTML = ''; + + if(dialogueData.choices && dialogueData.choices.length > 0) { + document.getElementById('dialogue-close').classList.add('hidden'); + dialogueData.choices.forEach((choice, index) => { + const button = document.createElement('button'); + button.textContent = choice.text; + button.className = 'quest-choice-btn w-full'; + button.onclick = () => { + const quest = this.world.questManager.getQuest(npc.questId); + if (quest) { + quest.advance(index); + this.updateQuestLogUI(); } - } - } - if (targetEntity) break; - } - - if(targetEntity) { - this.currentCombat = new Combat(this.world.player, targetEntity, this); - } - } - - showDialogue(name, text) { - const dialogueBox = document.getElementById('dialogue-box'); - document.getElementById('dialogue-name').textContent = name; - document.getElementById('dialogue-text').textContent = text; - dialogueBox.classList.remove('hidden'); - this.gameState = 'dialogue'; - } - - hideDialogue() { - document.getElementById('dialogue-box').classList.add('hidden'); - this.gameState = 'exploring'; - } - - updateAllInfoPanels() { - const player = this.world.player; - const creature = player.creature; - const xpForNextLevel = 100 * creature.level; - - let inventoryHtml = '

Inventaire

'; - if (Object.keys(player.inventory).length === 0) { - inventoryHtml += '

Vide

'; + if(choice.nextStage !== null) { + const nextDialogue = npc.getDialogue(this.world.questManager); + this.showDialogue(npc, nextDialogue); + } else { + this.hideDialogue(); + } + }; + choicesContainer.appendChild(button); + }); } else { - inventoryHtml += ''; + document.getElementById('dialogue-close').classList.remove('hidden'); } - inventoryHtml += '
'; - const playerInfoHtml = ` -
Niveau: ${creature.level}
-
PV: ${creature.currentHp} / ${creature.maxHp}
-
XP: ${creature.xp} / ${xpForNextLevel}
-
- Attributs: - -
-
${inventoryHtml}
- `; - - const currentTile = player.creature.tile; - const tileInfoHtml = ` -
Position: (${currentTile.position.x}, ${currentTile.position.y})
-
Biome: ${currentTile.biome.type.name}
- ${currentTile.structure ? `
Lieu: ${currentTile.structure.name} (${currentTile.structure.type.name})
` : ''} - `; + dialogueBox.classList.remove('hidden'); + } - document.getElementById('player-info-desktop').innerHTML = playerInfoHtml; - document.getElementById('player-info-mobile').innerHTML = playerInfoHtml; - document.getElementById('tile-info-desktop').innerHTML = tileInfoHtml; - document.getElementById('tile-info-mobile').innerHTML = tileInfoHtml; + hideDialogue() { + document.getElementById('dialogue-box').classList.add('hidden'); + this.isDialogueActive = false; + } + + updateQuestLogUI() { + const questLogDesktop = document.getElementById('quest-log-desktop'); + const questLogMobile = document.getElementById('quest-log-mobile'); + questLogDesktop.innerHTML = ''; + questLogMobile.innerHTML = ''; + + const activeQuests = Object.values(this.world.questManager.quests).filter(q => q.status === 'active'); + + if (activeQuests.length === 0) { + const noQuestText = '

Aucune quête active.

'; + questLogDesktop.innerHTML = noQuestText; + questLogMobile.innerHTML = noQuestText; + return; + } + + activeQuests.forEach(quest => { + const stage = quest.getCurrentStage(); + const questElement = document.createElement('div'); + questElement.innerHTML = `

${quest.definition.title}

${stage.text}

`; + questLogDesktop.appendChild(questElement); + questLogMobile.appendChild(questElement.cloneNode(true)); + }); } } - const controls = { up: false, down: false, left: false, right: false }; + const controls = { up: false, down: false, left: false, right: false, interact: false }; const simplex = new SimplexNoise(); let lastMoveTime = 0; const canvas = document.getElementById('gameCanvas'); @@ -1406,241 +1167,70 @@ document.addEventListener('DOMContentLoaded', () => { return "#"+("0"+R.toString(16)).slice(-2)+("0"+G.toString(16)).slice(-2)+("0"+B.toString(16)).slice(-2); } - function drawGrasslandFrame(ctx, frame, width, height) { - const PIXEL_SCALE = 2; - const colors = ['#6A994E', '#588142', '#A5A450']; - - ctx.fillStyle = colors[1]; - ctx.beginPath(); - ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); - ctx.closePath(); - ctx.fill(); - - for (let i = 0; i < 150; i++) { - const x = Math.random() * width; - const y = (Math.random() * height / 2) + height / 4; - const dx = Math.abs(x - width / 2); - const dy = Math.abs(y - height / 2); - if (dx / (width / 2) + dy / (height / 2) > 1) continue; - - const wave = Math.sin(x / 5 + frame * Math.PI / 2) * PIXEL_SCALE; - ctx.fillStyle = colors[i % 2]; - ctx.fillRect(x + wave, y - PIXEL_SCALE, PIXEL_SCALE, PIXEL_SCALE); - } - } - - function drawWaterFrame(ctx, frame, width, height) { - const colors = ['#5A8AB8', '#4A7AA8', '#97aabdff']; - ctx.fillStyle = colors[0]; - ctx.beginPath(); - ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); - ctx.closePath(); - ctx.fill(); - for (let i = 0; i < 3; i++) { - ctx.strokeStyle = colors[1]; - ctx.lineWidth = 1; - ctx.beginPath(); - const startY = (height / 4) * (i + 1); - const offset = (frame * 0.2) + i * 2; - ctx.moveTo(0, startY + Math.sin(offset) * 2); - for (let x = 0; x < width; x++) { - const y = startY + Math.sin(x * 0.15 + offset) * 2; - if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) < 1) { - ctx.lineTo(x, y); - } - } - ctx.stroke(); - } - } - - function drawDeepWaterFrame(ctx, frame, width, height) { - const colors = ['#3D5A80', '#2A4A6D', '#1A202C']; - ctx.fillStyle = colors[0]; - ctx.beginPath(); - ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); - ctx.closePath(); - ctx.fill(); - for (let i = 0; i < 2; i++) { - ctx.strokeStyle = colors[1]; - ctx.lineWidth = 2; - ctx.beginPath(); - const startY = (height / 3) * (i + 1); - const offset = (frame * 0.1) + i * 3; - ctx.moveTo(0, startY + Math.sin(offset) * 1.5); - for (let x = 0; x < width; x++) { - const y = startY + Math.sin(x * 0.1 + offset) * 1.5; - if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) < 1) { - ctx.lineTo(x, y); - } - } - ctx.stroke(); - } - } - - function drawMountainFrame(ctx, frame, width, height) { - const colors = { - base: '#A9A9A9', - light: '#CCCCCC', - shadow: '#808080', - deepShadow: '#696969' - }; + function createAnimatedSheet(width, height, frameCount, drawFrameFn) { + const sheetCanvas = document.createElement('canvas'); + sheetCanvas.width = width; + sheetCanvas.height = height * frameCount; + const sheetCtx = sheetCanvas.getContext('2d'); + sheetCtx.imageSmoothingEnabled = false; - // 1. Draw the base diamond shape - ctx.fillStyle = colors.base; - ctx.beginPath(); - ctx.moveTo(width / 2, 0); - ctx.lineTo(width, height / 2); - ctx.lineTo(width / 2, height); - ctx.lineTo(0, height / 2); - ctx.closePath(); - ctx.fill(); - - // 2. Draw the main "pointy" peak - // The lit side (right) - ctx.fillStyle = colors.light; - ctx.beginPath(); - ctx.moveTo(width / 2, 5); // Start slightly below the top point - ctx.lineTo(width - 10, height / 2); - ctx.lineTo(width / 2, height - 10); - ctx.closePath(); - ctx.fill(); - - // The shadowed side (left) - ctx.fillStyle = colors.shadow; - ctx.beginPath(); - ctx.moveTo(width / 2, 5); - ctx.lineTo(10, height / 2); - ctx.lineTo(width / 2, height - 10); - ctx.closePath(); - ctx.fill(); - - // 3. Add some smaller, darker triangles for a more jagged look - ctx.fillStyle = colors.deepShadow; - ctx.beginPath(); - ctx.moveTo(width / 2, 20); - ctx.lineTo(25, height / 2 + 5); - ctx.lineTo(width / 2, height - 15); - ctx.closePath(); - ctx.fill(); - } - - function drawSwampFrame(ctx, frame, width, height) { - const colors = ['#526044', '#36402D', '#6A994E']; - ctx.fillStyle = colors[1]; - ctx.beginPath(); - ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); - ctx.closePath(); - ctx.fill(); - - for (let i = 0; i < 3; i++) { - ctx.strokeStyle = colors[0]; - ctx.lineWidth = 1; - ctx.beginPath(); - const startY = (height / 4) * (i + 1); - const offset = (frame * 0.05) + i * 2.5; - ctx.moveTo(0, startY + Math.sin(offset) * 1); - for (let x = 0; x < width; x++) { - const y = startY + Math.sin(x * 0.1 + offset) * 1; - if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) < 1) { - ctx.lineTo(x, y); - } + for (let frame = 0; frame < frameCount; frame++) { + sheetCtx.save(); + sheetCtx.translate(0, frame * height); + drawFrameFn(sheetCtx, frame, width, height); + sheetCtx.restore(); } - ctx.stroke(); - } - } - - function drawBeachFrame(ctx, frame, width, height) { - const colors = ['#E9D9A1', '#D4C092', '#FFFFFF']; - ctx.fillStyle = colors[0]; - ctx.beginPath(); - ctx.moveTo(width / 2, 0); ctx.lineTo(width, height / 2); ctx.lineTo(width / 2, height); ctx.lineTo(0, height / 2); - ctx.closePath(); - ctx.fill(); - - for (let i = 0; i < 10; i++) { - const x = Math.random() * width; - const y = Math.random() * height; - if (Math.abs(x - width / 2) / (width / 2) + Math.abs(y - height / 2) / (height / 2) > 0.9) continue; - ctx.fillStyle = colors[2]; - ctx.fillRect(x, y, 1, 1); - } + return sheetCanvas; } + function loadSvgAsImage(gElement) { return new Promise((resolve, reject) => { - if (!gElement) return reject(new Error("SVG element not found.")); - const viewBox = gElement.getAttribute('viewBox') || '0 0 100 100'; - const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); - svg.setAttribute('viewBox', viewBox); - const defs = document.querySelector('svg > defs'); - if (defs) svg.appendChild(defs.cloneNode(true)); - svg.appendChild(gElement.cloneNode(true)); - const svgString = new XMLSerializer().serializeToString(svg); - const url = URL.createObjectURL(new Blob([svgString], { type: "image/svg+xml;charset=utf-8" })); - const img = new Image(); - img.onload = () => { URL.revokeObjectURL(url); resolve(img); }; - img.onerror = (err) => { URL.revokeObjectURL(url); reject(err); }; - img.src = url; + if (!gElement) return reject(new Error("SVG element not found.")); + const viewBox = gElement.getAttribute('viewBox') || '0 0 100 100'; + const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); + svg.setAttribute('viewBox', viewBox); + const defs = document.querySelector('svg > defs'); + if (defs) svg.appendChild(defs.cloneNode(true)); + svg.appendChild(gElement.cloneNode(true)); + const svgString = new XMLSerializer().serializeToString(svg); + const url = URL.createObjectURL(new Blob([svgString], { type: "image/svg+xml;charset=utf-8" })); + const img = new Image(); + img.onload = () => { URL.revokeObjectURL(url); resolve(img); }; + img.onerror = (err) => { URL.revokeObjectURL(url); reject(err); }; + img.src = url; }); } - - function drawBirdFrame(ctx, frame, width, height) { - const bodyColor = '#4A5568'; // slate gray - const wingColor = '#A0AEC0'; // lighter gray - const centerX = width / 2; - const centerY = height; // Anchor at the bottom center - // Wing flap animation: a simple up/down motion for 2 frames - const wingYOffset = (frame === 0) ? -3 : 0; - - // Body - ctx.fillStyle = bodyColor; - ctx.beginPath(); - ctx.ellipse(centerX, centerY - 5, 4, 5, 0, 0, Math.PI * 2); - ctx.fill(); - - // Wings - ctx.fillStyle = wingColor; - // Left Wing - ctx.beginPath(); - ctx.moveTo(centerX - 3, centerY - 6); - ctx.lineTo(centerX - 12, centerY - 8 + wingYOffset); - ctx.lineTo(centerX - 3, centerY - 4); - ctx.closePath(); - ctx.fill(); - // Right Wing - ctx.beginPath(); - ctx.moveTo(centerX + 3, centerY - 6); - ctx.lineTo(centerX + 12, centerY - 8 + wingYOffset); - ctx.lineTo(centerX + 3, centerY - 4); - ctx.closePath(); - ctx.fill(); - } async function initializeGame() { canvas.width = canvas.parentElement.clientWidth; canvas.height = canvas.parentElement.clientHeight; try { - for (const key in BIOME_TYPE) { - if (BIOME_TYPE[key].design) { BIOME_TYPE[key].sprite = new Sprite(BIOME_TYPE[key]);}} - - const assetIds = ['forest-svg', 'village-svg', 'city-svg', 'player-svg', 'enchanted-forest-svg', 'swamp-svg', 'wolf-pack-svg', 'boar-svg', 'bird-svg', 'farm-svg', 'camp-svg', 'npc-svg','house-svg','cult-svg','market-svg','mine-svg']; - const assetElements = assetIds.map(id => document.getElementById(id)); - - [forestSVG, villageSVG, citySVG, playerSVG, enchantedForestSVG, swampSVG, wolfPackSVG, boarSVG, birdSVG, farmSVG, campSVG, npcSVG,houseSVG,cultSVG,marketSVG,mineSVG] = await Promise.all( - assetElements.map(el => loadSvgAsImage(el)) - ); - - - console.log("All assets loaded."); - - let session = new Session(); - loadingScreen.style.display = 'none'; - session.loop(); - + for (const key in Biome) { + const biome = Biome[key]; + if (biome.design) { + const sheet = createAnimatedSheet(TILE_WIDTH, TILE_HEIGHT, biome.design.frames, biome.design.drawer); + biome.sprite = new Sprite(sheet, TILE_WIDTH, TILE_HEIGHT, biome.design.frames, biome.design.duration); + } + } + + const assetIds = ['forest-svg', 'village-svg', 'city-svg', 'player-svg', 'enchanted-forest-svg', 'swamp-svg', 'wolf-pack-svg', 'boar-svg', 'bird-svg', 'farm-svg', 'camp-svg', 'npc-svg']; + const assetElements = assetIds.map(id => document.getElementById(id)); + + [forestSVG, villageSVG, citySVG, playerSVG, enchantedForestSVG, swampSVG, wolfPackSVG, boarSVG, birdSVG, farmSVG, campSVG, npcSVG] = await Promise.all( + assetElements.map(el => loadSvgAsImage(el)) + ); + + console.log("All assets loaded."); + + let session = new Session(); + loadingScreen.style.display = 'none'; + session.loop(); + } catch (error) { - console.error("Failed to load assets:", error); - loadingScreen.innerHTML = "Error loading assets. Please refresh."; + console.error("Failed to load assets:", error); + loadingScreen.innerHTML = "Error loading assets. Please refresh."; } } diff --git a/js/scriptalpha.js b/js/scriptalpha.js index d68e484..56212ec 100644 --- a/js/scriptalpha.js +++ b/js/scriptalpha.js @@ -1,18 +1,19 @@ document.addEventListener('DOMContentLoaded', () => { - const BIOME_TYPE = { - 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 Biome = { + 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 } + } + const JOB = { VILLAGER: { name: "Habitant", @@ -102,9 +103,9 @@ document.addEventListener('DOMContentLoaded', () => { }; const ANIMAL_TYPES = { - WOLF: { name: 'Loup', movement: 'walk', svgAsset: () => wolfPackSVG, hp: 20, strength: 4, xp: 15, loot: { 'Cuir': 1, 'Os': 1 }, biomes: [BIOME_TYPE.FOREST, BIOME_TYPE.MOUNTAIN, BIOME_TYPE.SNOWLAND], spawnChance: 0.01, size: { w: 40, h: 40 }, offset: { x: -20, y: -35 } }, - BOAR: { name: 'Sanglier', movement: 'walk', svgAsset: () => boarSVG, hp: 25, strength: 5, xp: 20, loot: { 'Cuir': 2 }, biomes: [BIOME_TYPE.FOREST, BIOME_TYPE.GRASSLAND], spawnChance: 0.02, size: { w: 30, h: 30 }, offset: { x: -15, y: -28 } }, - BIRD: { name: 'Aigle', movement: 'fly', svgAsset: () => birdSVG, hp: 10, strength: 1, xp: 5, loot: { 'Plume': 1 }, biomes: [BIOME_TYPE.FOREST, BIOME_TYPE.GRASSLAND, BIOME_TYPE.MOUNTAIN, BIOME_TYPE.BEACH], spawnChance: 0.03, size: { w: 15, h: 12 }, offset: { x: -22, y: -45 }, flightHeight: 40 }, + WOLF: { name: 'Loup', movement: 'walk', svgAsset: () => wolfPackSVG, hp: 20, strength: 4, xp: 15, loot: { 'Cuir': 1, 'Os': 1 }, biomes: [Biome.FOREST, Biome.MOUNTAIN, Biome.SNOWLAND], spawnChance: 0.01, size: { w: 40, h: 40 }, offset: { x: -20, y: -35 } }, + BOAR: { name: 'Sanglier', movement: 'walk', svgAsset: () => boarSVG, hp: 25, strength: 5, xp: 20, loot: { 'Cuir': 2 }, biomes: [Biome.FOREST, Biome.GRASSLAND], spawnChance: 0.02, size: { w: 30, h: 30 }, offset: { x: -15, y: -28 } }, + BIRD: { name: 'Aigle', movement: 'fly', svgAsset: () => birdSVG, hp: 10, strength: 1, xp: 5, loot: { 'Plume': 1 }, biomes: [Biome.FOREST, Biome.GRASSLAND, Biome.MOUNTAIN, Biome.BEACH], spawnChance: 0.03, size: { w: 15, h: 12 }, offset: { x: -22, y: -45 }, flightHeight: 40 }, }; // --- Global Asset Variables --- @@ -299,65 +300,71 @@ 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.type.movements.includes('walk') || targetTile.biome.type.movements.includes('climb')) && this.type.biomes.type.includes(targetTile.biome.type)) { + if (targetTile.biome && (targetTile.biome.movements.includes('walk') || targetTile.biome.movements.includes('climb')) && this.type.biomes.includes(targetTile.biome)) { 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 - 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.translate(screenPos.x, screenPos.y - elevationHeight); ctx.drawImage(svgImage, offset.x, offset.y, size.w, size.h); ctx.restore(); } } - class Biome { - constructor() { - this.type=null; + + class Tile { + + constructor(x, y) { + this.position = new Position(x, y); + this.biome = null; + this.structure = null; + this.animal = null; + this.visibility = 0; // 0: Unseen, 1: Seen, 2: Visible + this.setBiome(); + this.setElevation(); + this.setStructure(); + this.setEntity(); } - setType(position){ + + setBiome() { let scale = 0.05; - let eRaw = (simplex.noise2D(position.x * scale, position.y * scale) + 1) / 2; - let tRaw = (simplex.noise2D(position.x * scale * 0.8, position.y * scale * 0.8) + 1) / 2; - let mRaw = (simplex.noise2D(position.x * scale * 1.5, position.y * scale * 1.5) + 1) / 2; - if (eRaw < 0.25) this.type = BIOME_TYPE.WATER_DEEP; - else if (eRaw < 0.3) this.type = BIOME_TYPE.WATER_SHALLOW; - else if (eRaw < 0.32) this.type = BIOME_TYPE.SWAMP; - else if (eRaw < 0.35) this.type = BIOME_TYPE.BEACH; - else if (eRaw > 0.85) this.type = BIOME_TYPE.SNOWMOUNTAIN; - else if (eRaw > 0.75) this.type = BIOME_TYPE.MOUNTAIN; + let eRaw = (simplex.noise2D(this.position.x * scale, this.position.y * scale) + 1) / 2; + let tRaw = (simplex.noise2D(this.position.x * scale * 0.8, this.position.y * scale * 0.8) + 1) / 2; + let mRaw = (simplex.noise2D(this.position.x * scale * 1.5, this.position.y * scale * 1.5) + 1) / 2; + if (eRaw < 0.25) this.biome = Biome.WATER_DEEP; + else if (eRaw < 0.3) this.biome = Biome.WATER_SHALLOW; + else if (eRaw < 0.32) this.biome = Biome.SWAMP; + else if (eRaw < 0.35) this.biome = Biome.BEACH; + else if (eRaw > 0.85) this.biome = Biome.SNOWMOUNTAIN; + else if (eRaw > 0.75) this.biome = Biome.MOUNTAIN; else { - if (tRaw < 0.3) this.type = BIOME_TYPE.DESERT; - else if (tRaw > 0.6) this.type = (mRaw > 0.7) ? BIOME_TYPE.ENCHANTED_FOREST : BIOME_TYPE.FOREST; - else this.type = BIOME_TYPE.GRASSLAND; + if (tRaw < 0.3) this.biome = Biome.DESERT; + else if (tRaw > 0.6) this.biome = (mRaw > 0.7) ? Biome.ENCHANTED_FOREST : Biome.FOREST; + else this.biome = Biome.GRASSLAND; } - }; - setDesign(ctx, position){ - const screenPos = position.cartToIso(); - const elevationHeight = position.h * ELEVATION_STEP; + } + + setDesign(ctx){ + if (!this.biome || this.visibility === 0) return; + + const screenPos = this.position.cartToIso(); + const elevationHeight = this.position.h * ELEVATION_STEP; ctx.save(); ctx.translate(screenPos.x, screenPos.y - elevationHeight); - const baseColor = this.type.summerColor; + const baseColor = this.biome.summerColor; const shadowColor = shadeColor(baseColor, -30); // Draw tile faces @@ -374,8 +381,8 @@ document.addEventListener('DOMContentLoaded', () => { ctx.fill(); // Draw top surface using a sprite if available - if (this.type.sprite) { - this.type.sprite.draw(ctx, -TILE_WIDTH / 2, 0); + if (this.biome.sprite) { + this.biome.sprite.draw(ctx, -TILE_WIDTH / 2, 0); } else { ctx.fillStyle = baseColor; ctx.beginPath(); @@ -383,44 +390,20 @@ document.addEventListener('DOMContentLoaded', () => { ctx.closePath(); ctx.fill(); } - if (this.type === BIOME_TYPE.FOREST && forestSVG) { - ctx.drawImage(forestSVG, -25, -25, 50, 50); - } else if (this.type === BIOME_TYPE.ENCHANTED_FOREST && enchantedForestSVG) { - ctx.drawImage(enchantedForestSVG, -25, -25, 50, 50); - } else if (this.type === BIOME_TYPE.SWAMP && swampSVG) { - ctx.drawImage(swampSVG, -25, -5, 50, 30); - } - }; - } - class Tile { - - constructor(x, y) { - this.position = new Position(x, y); - this.biome = null; - this.structure = null; - this.entities = []; - this.visibility = 0; // 0: Unseen, 1: Seen, 2: Visible - this.setBiome(); - this.setElevation(); - this.setStructure(); - this.setEntities(); - } - - setBiome() { - this.biome=new Biome(); - this.biome.setType(this.position); - } - - setDesign(ctx){ - if (!this.biome || this.visibility === 0) return; - - this.biome.setDesign(ctx,this.position); // Draw features if fully visible - if(this.visibility === 2) { - if (this.structure) this.structure.setDesign(ctx); - this.entities.forEach(e => e.setDesign(ctx)); + if (this.biome === Biome.FOREST && forestSVG) { + ctx.drawImage(forestSVG, -25, -25, 50, 50); + } else if (this.biome === Biome.ENCHANTED_FOREST && enchantedForestSVG) { + ctx.drawImage(enchantedForestSVG, -25, -25, 50, 50); + } else if (this.biome === Biome.SWAMP && swampSVG) { + ctx.drawImage(swampSVG, -25, -5, 50, 30); + } + + if (this.structure ) { + this.structure.setDesign(ctx); + } } // Draw fog overlay if seen but not currently visible @@ -437,58 +420,41 @@ document.addEventListener('DOMContentLoaded', () => { setElevation(){ if (!this.biome) return; - this.position.h = Math.floor(Math.random() * (this.biome.type.maxElevation - this.biome.type.minElevation+ 1) + this.biome.type.minElevation); + this.position.h = Math.floor(Math.random() * (this.biome.maxElevation - this.biome.minElevation+ 1) + this.biome.minElevation); } setStructure(){ var rand = seededRandom(this.position.x * 13 + this.position.y * 59); var structureChance = rand(); - if (structureChance < 0.01 && this.biome.type.acceptStructure) { + if (structureChance < 0.01 && this.biome.acceptStructure) { this.structure=new structure(this.position); } } -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++) { - 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)); + 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; + + 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.push(new Animal(animalType, this.position)); + } + } + } } } } - } -} - - - - } class Map { constructor(size) { @@ -546,74 +512,6 @@ setEntities() { 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 { @@ -628,7 +526,7 @@ setEntities() { } class Creature { - constructor(name,attributes,level,affinities,alignments,tile,species,race,hp,items) { + constructor(name,attributes,level,affinities,alignments,position,species,race,hp,items) { this.name = name; this.attributes = attributes; this.level = level; @@ -637,28 +535,15 @@ setEntities() { this.alignments = alignments; this.species = species; this.race = race; - this.tile=tile; + this.position=position; 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.creature = creature; + this.tile = creature.tile; this.settlement = settlement; this.lastMoveTime = 0; this.moveCooldown = 3000 + Math.random() * 4000; @@ -706,22 +591,22 @@ setEntities() { const newY = this.settlement.position.y + y; if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) { const targetTile = gameMap.tiles[newY][newX]; - if(targetTile.biome.type.movements.includes('walk') && !targetTile.structure) { + if(targetTile.biome.movements.includes('walk') && !targetTile.structure) { possibleMoves.push(targetTile); } } } } if(possibleMoves.length > 0) { - this.creature.tile = possibleMoves[Math.floor(Math.random() * possibleMoves.length)]; + this.tile = possibleMoves[Math.floor(Math.random() * possibleMoves.length)]; } } setDesign(ctx) { - if (!this.creature.tile || this.creature.tile.visibility !== 2) return; + if (!this.tile || this.tile.visibility !== 2) return; - const screenPos = this.creature.tile.position.cartToIso(); - const elevationHeight = this.creature.tile.position.h * ELEVATION_STEP; + const screenPos = this.tile.position.cartToIso(); + const elevationHeight = this.tile.position.h * ELEVATION_STEP; ctx.save(); ctx.translate(screenPos.x, screenPos.y - elevationHeight); @@ -740,9 +625,9 @@ setEntities() { this.creature=creature; this.equipments=equipments; } - + setDesign(ctx) { - const position = this.creature.tile.position + const position = this.creature.position if(!position) return; const screenPos = position.cartToIso(); @@ -759,327 +644,26 @@ setEntities() { ctx.restore(); } move(dx, dy, gameMap) { - const newX = this.creature.tile.position.x + dx; - const newY = this.creature.tile.position.y + dy; + const newX = this.creature.position.x + dx; + const newY = this.creature.position.y + dy; if (newX >= 0 && newX < gameMap.size && newY >= 0 && newY < gameMap.size) { - const targetTile = gameMap.tiles[newY][newX]; - if (targetTile.biome && targetTile.biome.type.movements.includes('walk')) { - this.creature.tile = targetTile; + const targetTile = gameMap.tiles[newY][newX].position; + if (targetTile.biome && targetTile.biome.movements.includes('walk')) { + this.creature.position = targetTile; } } } } - class Combat { - constructor(player, opponent) { - this.player=player; - this.opponent=opponent; - this.state='initiating' - this.startCombat(); - } - startCombat() { - this.state= 'started'; - document.getElementById('combat-screen').classList.remove('hidden'); - document.getElementById('combat-screen').classList.add('flex'); - updateCombatUI(); - document.getElementById('combat-log').textContent = `Le combat commence`; - document.getElementById('attack-btn').addEventListener('click', handleAttack); - } - - handleAttack(camera) { - - const playerDamage = Math.max(1, player.attributes.strength + Math.floor(Math.random() * 4) - this.opponent.attributes.defense); - this.opponent.currentHp = Math.max(0, this.opponent.currentHp - playerDamage); - document.getElementById('combat-log').textContent = `Vous infligez ${playerDamage} dégâts.`; - floatingTexts.push({ content: `-${playerDamage}`, x: camera.x + canvas.width * 0.7, y: camera.y + canvas.height * 0.4, endTime: performance.now() + 1000, duration: 1000, color: '#ff4444' }); - - updateCombatUI(); - - if (this.opponent.currentHp <= 0) { - endCombat(true); - return; - } - - setTimeout(() => { - const opponentDamage = Math.max(1, this.opponent.attributes.strength + Math.floor(Math.random() * 4) - 2); - this.player.creature.hp = Math.max(0, this.player.creature.hp - opponentDamage); - document.getElementById('combat-log').textContent += `\nLe ${this.opponent.name} riposte et vous inflige ${opponentDamage} dégâts.`; - floatingTexts.push({ content: `-${opponentDamage}`, x: camera.x + canvas.width * 0.3, y: camera.y + canvas.height * 0.4, endTime: performance.now() + 1000, duration: 1000, color: '#ff4444' }); - - updateCombatUI(); - updateAllInfoPanels(); - - if ( this.player.creature.hp <= 0) { - endCombat(false); - } - }, 500); - } - endCombat(isVictory) { - const combatLog = document.getElementById('combat-log'); - if (isVictory) { - combatLog.textContent = `Vous avez vaincu le ${currentOpponent.name} !`; - addXp(currentOpponent.xp); - Object.entries(currentOpponent.loot).forEach(([item, amount]) => { - player.inventory[item] = (player.inventory[item] || 0) + amount; - combatLog.textContent += `\nVous trouvez ${amount} ${item}.`; - }); - - const opponentTile = mapData[player.y][player.x]; - if (currentOpponent.isAnimal) { - opponentTile.animals.shift(); - } else { - opponentTile.monsters.shift(); - } - } else { - combatLog.textContent = `Vous avez été vaincu...`; - player.derivedStats.currentHp = 1; - } - - currentOpponent = null; - setTimeout(() => { - document.getElementById('combat-screen').classList.add('hidden'); - document.getElementById('combat-screen').classList.remove('flex'); - gameState = 'exploring'; - updateAllInfoPanels(); - }, 2000); - } - - updateCombatUI() { - document.getElementById('combat-player-hp-text').textContent = `${this.player.creature.hp} / ${player.derivedStats.maxHp}`; - document.getElementById('combat-player-hp-bar').style.width = `${(this.player.creature.hp / player.derivedStats.maxHp) * 100}%`; - if (this.opponent) { - document.getElementById('combat-opponent-name').textContent = this.opponent.name; - document.getElementById('combat-opponent-icon').textContent = currentOpponent.icon; - document.getElementById('combat-opponent-hp-text').textContent = `${this.opponent.currentHp} / ${this.opponent.hp}`; - document.getElementById('combat-opponent-hp-bar').style.width = `${(this.opponent.currentHp / this.opponent.hp) * 100}%`; - } - } - - } - class Quest { - constructor( ) { - this.id = null; - this.definition = null; - this.currentStage = 0; - this.status = 'inactive'; // inactive, active, completed - - } - - getCurrentStage() { - return this.definition.stages[this.currentStage]; - } - - advance(choiceIndex) { - const stage = this.getCurrentStage(); - if(stage.choices && stage.choices[choiceIndex]) { - const nextStageIndex = stage.choices[choiceIndex].nextStage; - if (nextStageIndex !== null) { - this.currentStage = nextStageIndex; - if(this.status === 'inactive') this.status = 'active'; - if(this.getCurrentStage().isEnd) { - this.status = 'completed'; - } - } - } - } - async setQuest(npc) { - if(npc.questId && this.quests[npc.questId]) { - return this.quests[npc.questId]; - } - try { - const questDefinition = await this.generateQuestForNpc(npc); - if(questDefinition) { - const questId = `GEMINI_${Date.now()}`; - npc.assignQuest(questId); - this.id=questId; - this.definition=questDefinition; - } - } catch(e) { - console.error("Gemini quest generation failed, using fallback.", e); - const fallbackId = 'WOLF_MENACE'; - npc.assignQuest(fallbackId); - this.id=fallbackId; - this.definition=QUEST_DATABASE[fallbackId]; - } - return null; - } - async generateQuestForNpc(npc) { - if (!geminiApiKey) { - throw new Error("API key is missing."); - } - - const prompt = `Génère une quête simple pour un jeu RPG en 2D isométrique. - Le PNJ est un "${npc.type.name}". - Il se trouve près d'une structure de type "${npc.homeTile.structure.type.name}" dans un biome de type "${npc.homeTile.biome.name}". - - Crée une quête avec un titre, et 3 à 4 étapes. - La première étape (index 0) doit proposer d'accepter ou de refuser la quête. - L'étape suivante (index 1) doit décrire l'objectif. L'objectif doit être simple, comme tuer un certain nombre de monstres ou collecter des objets. - La dernière étape doit être la récompense (isEnd: true). - - Réponds UNIQUEMENT avec un objet JSON valide qui suit le schéma ci-dessous. N'ajoute aucun texte avant ou après le JSON. - `; - - const payload = { - contents: [{ parts: [{ text: prompt }] }], - generationConfig: { - responseMimeType: "application/json", - responseSchema: { - type: "OBJECT", - properties: { - "title": { "type": "STRING" }, - "stages": { - "type": "ARRAY", - "items": { - "type": "OBJECT", - "properties": { - "text": { "type": "STRING" }, - "choices": { - "type": "ARRAY", - "items": { - "type": "OBJECT", - "properties": { - "text": { "type": "STRING" }, - "nextStage": { "type": ["NUMBER", "NULL"] } - }, - "required": ["text"] - } - }, - "objective": { "type": ["OBJECT", "NULL"], "properties": {"type": {"type": "STRING"}, "target": {"type": "STRING"}, "count": {"type": "NUMBER"}} }, - "reward": { "type": ["OBJECT", "NULL"], "properties": {"xp": {"type": "NUMBER"}, "items": {"type": "ARRAY", "items": { "type": "STRING" }}} }, - "isEnd": { "type": ["BOOLEAN", "NULL"] } - }, - "required": ["text", "choices"] - } - } - }, - "required": ["title", "stages"] - } - } - }; - - const apiUrl = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash-preview-05-20:generateContent?key=${geminiApiKey}`; - - const response = await fetch(apiUrl, { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify(payload) - }); - - if (!response.ok) { - const errorBody = await response.text(); - console.error("API Error Body:", errorBody); - throw new Error(`API call failed with status: ${response.status}`); - } - - const result = await response.json(); - const jsonText = result.candidates?.[0]?.content?.parts?.[0]?.text; - if(jsonText) { - return JSON.parse(jsonText); - } - throw new Error("Invalid response from API."); - } - } class World { constructor(name) { this.name = name; this.map = new Map(200); this.currentTime=new Time(); - this.camera = new Camera(0,0, canvas); - this.player=null; - } - setDesign(){ - ctx.fillStyle = '#000000'; - ctx.fillRect(0, 0, canvas.width, canvas.height); - - ctx.save(); - ctx.translate(this.camera.x, this.camera.y); - - const [startX, endX, startY, endY] = this.getVisibleTileBounds(); - - for (let y = startY; y < endY; y++) { - for (let x = startX; x < endX; x++) { - if (this.map.tiles[y] && this.map.tiles[y][x]) { - this.map.tiles[y][x].setDesign(ctx); - } - } - } - - //this.world.animals.forEach(animal => animal.setDesign(ctx)); - //this.world.npcs.forEach(npc => npc.setDesign(ctx)); - this.player.setDesign(ctx); - - ctx.restore(); - ctx.save(); - this.currentTime.setDesign(ctx); - ctx.restore(); - - } - getVisibleTileBounds() { - const margin = 5; - const viewWidth = canvas.width; - const viewHeight = canvas.height; - - const isoToCart = (isoX, isoY) => { - const cartX = (isoX / (TILE_WIDTH / 2) + isoY / (TILE_HEIGHT / 2)) / 2; - const cartY = (isoY / (TILE_HEIGHT / 2) - isoX / (TILE_WIDTH / 2)) / 2; - return { x: Math.floor(cartX), y: Math.floor(cartY) }; - }; - - const topLeft = isoToCart(-this.camera.x, -this.camera.y); - const bottomRight = isoToCart(-this.camera.x + viewWidth, -this.camera.y + viewHeight); - - const startX = Math.max(0, topLeft.x - margin); - const endX = Math.min(this.map.size - 1, bottomRight.x + margin); - const startY = Math.max(0, topLeft.y - margin); - const endY = Math.min(this.map.size - 1, bottomRight.y + margin); - - return [startX, endX, startY, endY]; - } - update(currentTime) { - - 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.tile.position); - - // Update all biome sprites - for (const key in BIOME_TYPE) { - if (BIOME_TYPE[key].sprite) { - BIOME_TYPE[key].sprite.update(currentTime); - } - } - - this.currentTime.tick(); - } - updateVisibility(position) { - const px = position.x; - const py = position.y; - const radius = VISION_RADIUS; - const radiusSq = radius * radius; - - const viewBox = { - minX: Math.max(0, px - radius - 2), - maxX: Math.min(this.map.size - 1, px + radius + 2), - minY: Math.max(0, py - radius - 2), - maxY: Math.min(this.map.size - 1, py + radius + 2) - }; - - for(let y = viewBox.minY; y <= viewBox.maxY; y++) { - for(let x = viewBox.minX; x <= viewBox.maxX; x++) { - const tile = this.map.tiles[y][x]; - if(tile.visibility === 2) tile.visibility = 1; - - const dx = px - x; - const dy = py - y; - if (dx * dx + dy * dy <= radiusSq) { - tile.visibility = 2; - } - } - } + this.animals = []; + this.npcs = []; } + } class Camera { constructor(x=0,y=0,canvas) { @@ -1098,25 +682,74 @@ setEntities() { constructor() { this.world = new World('Defiance'); + this.camera = new Camera(0,0, canvas); this.setControls(); this.loop = this.loop.bind(this); + this.player=null; this.setInitial(); } loop(currentTime) { - this.handleMovement(currentTime); - this.world.update(currentTime); - this.world.setDesign(); + this.update(currentTime); + this.setDesign(); requestAnimationFrame(this.loop); } + update(currentTime) { + this.handleMovement(currentTime); + this.updateVisibility(); + // 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); + + // Update all biome sprites + for (const key in Biome) { + if (Biome[key].sprite) { + Biome[key].sprite.update(currentTime); + } + } + + this.world.currentTime.tick(); + } + + updateVisibility() { + const map = this.world.map; + const px = this.player.creature.position.x; + const py = this.player.creature.position.y; + const radius = VISION_RADIUS; + const radiusSq = radius * radius; + + const viewBox = { + minX: Math.max(0, px - radius - 2), + maxX: Math.min(map.size - 1, px + radius + 2), + minY: Math.max(0, py - radius - 2), + maxY: Math.min(map.size - 1, py + radius + 2) + }; + + for(let y = viewBox.minY; y <= viewBox.maxY; y++) { + for(let x = viewBox.minX; x <= viewBox.maxX; x++) { + const tile = map.tiles[y][x]; + if(tile.visibility === 2) tile.visibility = 1; + + const dx = px - x; + const dy = py - y; + if (dx * dx + dy * dy <= radiusSq) { + tile.visibility = 2; + } + } + } + } + + setInitial(){ let spawnX, spawnY; do { 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],'human',RACE.HUMAN,10,null),); - this.world.updateVisibility(this.world.map.tiles[spawnY][spawnX].position); + } while (!this.world.map.tiles[spawnY][spawnX].biome || !this.world.map.tiles[spawnY][spawnX].biome.movements.includes('walk') ); + this.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.updateVisibility(); } setControls() { document.addEventListener('keydown', e => { @@ -1142,23 +775,71 @@ setEntities() { btn.addEventListener('touchend', e => { e.preventDefault(); controls[dir] = false; }); } } + setDesign(){ + ctx.fillStyle = '#000000'; + ctx.fillRect(0, 0, canvas.width, canvas.height); + + ctx.save(); + ctx.translate(this.camera.x, this.camera.y); + + const [startX, endX, startY, endY] = this.getVisibleTileBounds(); + + 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); + } + } + } + + this.world.animals.forEach(animal => animal.setDesign(ctx)); + this.world.npcs.forEach(npc => npc.setDesign(ctx)); + this.player.setDesign(ctx); + + ctx.restore(); + ctx.save(); + this.world.currentTime.setDesign(ctx); + ctx.restore(); + + } + + getVisibleTileBounds() { + const margin = 5; + const viewWidth = canvas.width; + const viewHeight = canvas.height; + + const isoToCart = (isoX, isoY) => { + const cartX = (isoX / (TILE_WIDTH / 2) + isoY / (TILE_HEIGHT / 2)) / 2; + const cartY = (isoY / (TILE_HEIGHT / 2) - isoX / (TILE_WIDTH / 2)) / 2; + return { x: Math.floor(cartX), y: Math.floor(cartY) }; + }; + + const topLeft = isoToCart(-this.camera.x, -this.camera.y); + const bottomRight = isoToCart(-this.camera.x + viewWidth, -this.camera.y + viewHeight); + + const startX = Math.max(0, topLeft.x - margin); + const endX = Math.min(this.world.map.size - 1, bottomRight.x + margin); + const startY = Math.max(0, topLeft.y - margin); + const endY = Math.min(this.world.map.size - 1, bottomRight.y + margin); + + return [startX, endX, startY, endY]; + } handleMovement(currentTime) { if (currentTime - lastMoveTime < 150) return; let moved = false; - if (controls.up) { this.world.player.move(0, -1,this.world.map); moved = true; } - if (controls.down) { this.world.player.move(0, 1,this.world.map); moved = true; } - if (controls.left) { this.world.player.move(-1, 0,this.world.map); moved = true; } - if (controls.right) { this.world.player.move(1, 0,this.world.map); moved = true; } + if (controls.up) { this.player.move(0, -1,this.world.map); moved = true; } + if (controls.down) { this.player.move(0, 1,this.world.map); moved = true; } + if (controls.left) { this.player.move(-1, 0,this.world.map); moved = true; } + if (controls.right) { this.player.move(1, 0,this.world.map); moved = true; } if(moved) lastMoveTime = currentTime; } - handleInteraction() { if (!controls.interact) return; controls.interact = false; // Consume the action - const px = this.world.player.creature.position.x; - const py = this.world.player.creature.position.y; + const px = this.player.creature.position.x; + const py = this.player.creature.position.y; let targetNpc = null; for (const npc of this.world.npcs) { @@ -1367,8 +1048,8 @@ setEntities() { canvas.height = canvas.parentElement.clientHeight; try { - for (const key in BIOME_TYPE) { - if (BIOME_TYPE[key].design) { BIOME_TYPE[key].sprite = new Sprite(BIOME_TYPE[key]);} + for (const key in Biome) { + if (Biome[key].design) { Biome[key].sprite = new Sprite(Biome[key]);} } const assetIds = ['forest-svg', 'village-svg', 'city-svg', 'player-svg', 'enchanted-forest-svg', 'swamp-svg', 'wolf-pack-svg', 'boar-svg', 'bird-svg', 'farm-svg', 'camp-svg', 'npc-svg','house-svg','cult-svg','market-svg','mine-svg'];