brouillon10
Différences
Ci-dessous, les différences entre deux révisions de la page.
| Les deux révisions précédentesRévision précédenteProchaine révision | Révision précédente | ||
| brouillon10 [2026/04/29 17:00] – nanaki | brouillon10 [2026/04/29 23:56] (Version actuelle) – nanaki | ||
|---|---|---|---|
| Ligne 1: | Ligne 1: | ||
| - | < | ||
| < | < | ||
| < | < | ||
| Ligne 6: | Ligne 5: | ||
| < | < | ||
| - | body { font-family: | + | body { |
| + | | ||
| + | | ||
| + | | ||
| + | | ||
| + | } | ||
| h1,h2 { color: | h1,h2 { color: | ||
| - | .box { border:1px solid gold; padding: | + | |
| - | select,input { margin: | + | .box { |
| - | button | + | |
| - | .statBox | + | |
| + | | ||
| + | } | ||
| + | |||
| + | select | ||
| + | input { margin:3px; width:50px; } | ||
| + | |||
| + | .statLine | ||
| + | display:flex; | ||
| + | justify-content:space-between; | ||
| + | max-width: | ||
| + | } | ||
| + | |||
| + | .result { | ||
| + | | ||
| + | color:#00ffcc; | ||
| + | padding: | ||
| + | white-space: | ||
| + | } | ||
| + | |||
| + | .small { | ||
| + | font-size:12px; | ||
| + | color:#aaa; | ||
| + | } | ||
| </ | </ | ||
| </ | </ | ||
| Ligne 17: | Ligne 45: | ||
| < | < | ||
| - | < | + | < |
| <div class=" | <div class=" | ||
| Race : | Race : | ||
| <select id=" | <select id=" | ||
| - | <div id="raceStats"></ | + | |
| + | <h3>Stats de base</ | ||
| + | < | ||
| </ | </ | ||
| <div class=" | <div class=" | ||
| - | <h2>Augmentations</h2> | + | <h3>Améliorations</h3> |
| <div id=" | <div id=" | ||
| - | <div id="piTotal"></ | + | <div id="cost"></ |
| </ | </ | ||
| <div class=" | <div class=" | ||
| - | <h2> | + | <h3> |
| Tête <select id=" | Tête <select id=" | ||
| Ligne 43: | Ligne 73: | ||
| Pieds <select id=" | Pieds <select id=" | ||
| + | <div id=" | ||
| </ | </ | ||
| <div class=" | <div class=" | ||
| - | <h2> | + | <h3> |
| <div id=" | <div id=" | ||
| </ | </ | ||
| - | <button onclick=" | + | <button onclick=" |
| - | <pre id=" | + | <pre id=" |
| < | < | ||
| Ligne 67: | Ligne 98: | ||
| // ===== COST ===== | // ===== COST ===== | ||
| const costTable = { | const costTable = { | ||
| - | pv: | + | cc: |
| - | f: | + | f: |
| - | mvt: | + | agi: |
| - | fm: | + | m: |
| + | fm: | ||
| + | p: | ||
| + | pv: | ||
| + | pm: | ||
| + | mvt: | ||
| + | r: | ||
| + | rm: | ||
| }; | }; | ||
| - | // ===== EQUIP ===== | + | // ===== PASSIFS ===== |
| + | const skills = [ | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | ]; | ||
| + | |||
| + | |||
| + | // ===== ÉQUIPEMENTS | ||
| const equipments = [ | const equipments = [ | ||
| + | |||
| + | /* ================= COMMUNS ================= */ | ||
| + | |||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| {name:" | {name:" | ||
| - | {name:" | + | {name:" |
| - | {name:" | + | {name:" |
| - | {name:" | + | {name:" |
| - | {name:" | + | {name:" |
| {name:" | {name:" | ||
| {name:" | {name:" | ||
| - | {name:" | + | {name:" |
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | |||
| + | /* ================= ELFES ================= */ | ||
| + | |||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | |||
| + | /* ================= NAINS ================= */ | ||
| + | |||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | |||
| + | /* ================= GÉANTS ================= */ | ||
| + | |||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | |||
| + | /* ================= HS ================= */ | ||
| + | |||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | |||
| + | /* ================= OLYMPIENS ================= */ | ||
| + | |||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | |||
| + | /* ================= ANNEAUX ================= */ | ||
| + | |||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| + | {name:" | ||
| {name:" | {name:" | ||
| - | ]; | ||
| - | // ===== PASSIFS ===== | ||
| - | const skills = [ | ||
| - | " | ||
| - | " | ||
| ]; | ]; | ||
| - | // ===== DOM ===== | + | // ===== INIT ===== |
| const raceSelect = document.getElementById(" | const raceSelect = document.getElementById(" | ||
| const statsDiv = document.getElementById(" | const statsDiv = document.getElementById(" | ||
| - | const skillsDiv | + | const baseDiv |
| - | const slots = { | ||
| - | head: | ||
| - | neck: | ||
| - | cape: | ||
| - | rightHand: | ||
| - | leftHand: | ||
| - | body: | ||
| - | ring: | ||
| - | feet: | ||
| - | }; | ||
| - | |||
| - | // ===== INIT ===== | ||
| for(let r in races){ | for(let r in races){ | ||
| raceSelect.innerHTML += `< | raceSelect.innerHTML += `< | ||
| } | } | ||
| + | // stats UI | ||
| for(let s in costTable){ | for(let s in costTable){ | ||
| - | statsDiv.innerHTML += `<div class=" | + | statsDiv.innerHTML += ` |
| + | <div class=" | ||
| + | <span>${s}</ | ||
| + | <input type=" | ||
| + | </ | ||
| } | } | ||
| + | // passifs | ||
| skills.forEach(s=> | skills.forEach(s=> | ||
| - | skillsDiv.innerHTML += `< | + | document.getElementById(" |
| + | < | ||
| + | <input type=" | ||
| + | <b>${s.name}</ | ||
| + | <span class=" | ||
| + | </ | ||
| }); | }); | ||
| - | // ===== RACE DISPLAY ===== | + | // base stats |
| - | function | + | function |
| - | let r = races[raceSelect.value]; | + | baseDiv.textContent |
| - | let txt="< | + | |
| - | for(let k in r) txt += k+" : " | + | |
| - | document.getElementById(" | + | |
| } | } | ||
| + | raceSelect.addEventListener(" | ||
| + | displayBase(); | ||
| + | |||
| + | // ===== COST ===== | ||
| + | function calcCost(b, | ||
| + | let total=0, | ||
| + | for(let i=1; | ||
| + | if(i===1) last=b; | ||
| + | else if(i<=3) last+=m1; | ||
| + | else last+=m2; | ||
| + | total+=last; | ||
| + | } | ||
| + | return total; | ||
| + | } | ||
| + | |||
| + | function updateCost(){ | ||
| + | let total=0; | ||
| + | for(let s in costTable){ | ||
| + | let v=+document.getElementById(s).value||0; | ||
| + | let [b, | ||
| + | total+=calcCost(b, | ||
| + | } | ||
| + | document.getElementById(" | ||
| + | } | ||
| + | |||
| + | // ===== SLOTS ===== | ||
| + | const slots = { | ||
| + | head: | ||
| + | leftHand: | ||
| + | }; | ||
| - | // ===== EQUIP ===== | ||
| function resetSlots(){ | function resetSlots(){ | ||
| - | for(let s in slots) | + | Object.values(slots).forEach(s=> |
| } | } | ||
| function fillEquip(){ | function fillEquip(){ | ||
| - | let r = raceSelect.value; | + | let r=raceSelect.value; |
| equipments.forEach((e, | equipments.forEach((e, | ||
| - | if(e.race!==" | + | if(e.race!==" |
| - | if(e.slot===" | + | if(e.slot===" |
| - | if(e.slot===" | + | if(e.slot===" |
| - | if(e.slot===" | + | if(e.slot===" |
| - | if(e.slot===" | + | if(e.slot===" |
| - | if(e.slot===" | + | if(e.slot===" |
| - | if(e.slot===" | + | if(e.slot===" |
| - | if(e.slot===" | + | if(e.slot===" |
| - | if(e.slot===" | + | if(e.slot===" |
| }); | }); | ||
| } | } | ||
| - | function displayStats(select, | ||
| - | let target = document.getElementById(id); | ||
| - | if(select.value==="" | ||
| - | let e = equipments[select.value]; | ||
| - | let txt=" → "; | ||
| - | for(let s in e.stats){ | ||
| - | txt += (e.stats[s]> | ||
| - | } | ||
| - | if(e.magicBlock) txt+=" | ||
| - | target.innerHTML=txt; | ||
| - | } | ||
| - | |||
| - | // ===== EVENTS ===== | ||
| raceSelect.addEventListener(" | raceSelect.addEventListener(" | ||
| resetSlots(); | resetSlots(); | ||
| fillEquip(); | fillEquip(); | ||
| - | displayRaceStats(); | + | autoCalculate(); |
| - | }); | + | |
| - | + | ||
| - | Object.entries(slots).forEach(([key, | + | |
| - | sel.addEventListener(" | + | |
| }); | }); | ||
| - | displayRaceStats(); | ||
| resetSlots(); | resetSlots(); | ||
| fillEquip(); | fillEquip(); | ||
| - | // ===== COST ===== | + | // ===== BONUS ===== |
| - | function | + | function |
| - | let total=0,last=base; | + | let v=select.value; |
| - | for(let i=1;i<=n;i++){ | + | let el=document.getElementById(id); |
| - | if(i===1) last=base; | + | if(v==="" |
| - | else if(i<=3) last+=m1; | + | let e=equipments[v]; |
| - | else last+=m2; | + | let txt="" |
| - | total+=last; | + | for(let s in e.stats){ |
| + | let val=e.stats[s]; | ||
| + | txt+=val>0?`+${val} ${s} `:`${val} ${s} `; | ||
| + | } | ||
| + | el.innerHTML=txt; | ||
| + | } | ||
| + | |||
| + | Object.entries(slots).forEach(([k, | ||
| + | s.addEventListener(" | ||
| + | displayStats(s, | ||
| + | checkLimit(); | ||
| + | autoCalculate(); | ||
| + | }); | ||
| + | }); | ||
| + | |||
| + | // ===== LIMIT ===== | ||
| + | function checkLimit(){ | ||
| + | let count=0; | ||
| + | Object.entries(slots).forEach(([k, | ||
| + | if(k!==" | ||
| + | }); | ||
| + | |||
| + | if(count> | ||
| + | limitWarn.innerText=" | ||
| + | Object.entries(slots).forEach(([k, | ||
| + | if(k!==" | ||
| + | }); | ||
| + | }else{ | ||
| + | limitWarn.innerText="" | ||
| + | Object.values(slots).forEach(s=> | ||
| } | } | ||
| - | return total; | ||
| } | } | ||
| Ligne 193: | Ligne 352: | ||
| function calculate(){ | function calculate(){ | ||
| - | let char = {...races[raceSelect.value]}; | + | let char={...races[raceSelect.value]}; |
| - | let totalPI=0; | + | |
| - | // stats | + | // stats investies |
| for(let s in costTable){ | for(let s in costTable){ | ||
| - | let v = parseInt(document.getElementById(s).value)||0; | + | let v=+document.getElementById(s).value||0; |
| - | char[s]+=v; | + | char[s]=(char[s]||0)+v; |
| - | let [b, | + | |
| - | totalPI+=calcCost(b, | + | |
| } | } | ||
| Ligne 208: | Ligne 364: | ||
| if(sel.value==="" | if(sel.value==="" | ||
| let e=equipments[sel.value]; | let e=equipments[sel.value]; | ||
| - | for(let | + | for(let |
| - | char[stat]=(char[stat]||0)+e.stats[stat]; | + | char[s]=(char[s]||0)+e.stats[s]; |
| } | } | ||
| }); | }); | ||
| - | // ===== COMBAT ===== | + | // esquive |
| - | let ct1=char.ct; | + | let esquive=Math.round(char.agi*0.75+char.cc*0.25); |
| - | let ct2=char.ct; | + | |
| - | let ct3=char.ct-2; | + | |
| - | let ct4=char.ct-4; | + | |
| - | let esquive | + | let checked=[...document.querySelectorAll(" |
| - | // ===== DISPLAY ===== | + | if(checked.includes("Réflexes fulgurants")) |
| - | result.innerHTML = | + | esquive=Math.round(char.agi*0.85+char.cc*0.15); |
| - | "< | + | |
| - | +"< | + | |
| - | +"< | + | |
| - | +"CC : "+char.cc+"< | + | |
| - | +"FM : "+char.fm+"< | + | |
| - | +"CT 1-2 cases : " | + | |
| - | +"CT 3 cases : " | + | |
| - | +"CT 4 cases : " | + | |
| - | +" | + | |
| + | if(checked.includes(" | ||
| + | esquive=Math.round(char.cc*0.85+char.agi*0.15); | ||
| + | |||
| + | if(checked.includes(" | ||
| + | esquive+=1; | ||
| + | |||
| + | // affichage | ||
| + | result.textContent = | ||
| + | "===== STATS =====\n" | ||
| + | JSON.stringify(char, | ||
| + | " | ||
| + | " | ||
| + | "\n✨ FM : " | ||
| + | " | ||
| } | } | ||
| - | </script> | + | // ===== AUTO ===== |
| + | function autoCalculate(){ | ||
| + | updateCost(); | ||
| + | calculate(); | ||
| + | } | ||
| + | // events stats | ||
| + | document.querySelectorAll("# | ||
| + | i.addEventListener(" | ||
| + | }); | ||
| + | |||
| + | // passifs | ||
| + | document.querySelectorAll(" | ||
| + | s.addEventListener(" | ||
| + | }); | ||
| + | |||
| + | // ===== RESET ===== | ||
| + | function resetAll(){ | ||
| + | |||
| + | document.querySelectorAll("# | ||
| + | |||
| + | Object.values(slots).forEach(s=> | ||
| + | s.value=""; | ||
| + | s.disabled=false; | ||
| + | }); | ||
| + | |||
| + | document.querySelectorAll(" | ||
| + | |||
| + | resetSlots(); | ||
| + | fillEquip(); | ||
| + | displayBase(); | ||
| + | checkLimit(); | ||
| + | autoCalculate(); | ||
| + | } | ||
| + | |||
| + | // init | ||
| + | autoCalculate(); | ||
| + | |||
| + | </ | ||
| </ | </ | ||
| </ | </ | ||
brouillon10.1777474848.txt.gz · Dernière modification : 2026/04/29 17:00 de nanaki
