Wiki of Olympia

Outils pour utilisateurs

Outils du site

Piste : • brouillon6
brouillon10

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision		Révision précédente
brouillon10 [2026/04/29 16:41] – nanakibrouillon10 [2026/04/29 23:56] (Version actuelle) – nanaki
Ligne 1: Ligne 1:
-Évol 
- 
- 
- 
 <html> <html>
 <head> <head>
Ligne 9: Ligne 5:
  
 <style> <style>
-body { font-family: Arial; background:#0b1a13; color:#e0d3a3; padding:20px;}+body { 
 +  font-family: Arial; 
 +  background:#0b1a13; 
 +  color:#e0d3a3; 
 +  padding:10px; 
 +} 
 h1,h2 { color:gold;} h1,h2 { color:gold;}
-.box { border:1px solid gold; padding:10px; margin-bottom:15px;} + 
-select,input { margin:3px;} +.box { 
-button { padding:8px; margin:5px; background:gold; border:none;}+  border:1px solid gold; 
 +  padding:10px; 
 +  margin-bottom:10px; 
 +} 
 + 
 +select { margin:3px; max-width:150px; } 
 +input { margin:3px; width:50px; } 
 + 
 +.statLine { 
 +  display:flex; 
 +  justify-content:space-between; 
 +  max-width:260px; 
 +} 
 + 
 +.result { 
 +  background:#000; 
 +  color:#00ffcc; 
 +  padding:10px; 
 +  white-space:pre-wrap; 
 +} 
 + 
 +.small { 
 +  font-size:12px; 
 +  color:#aaa; 
 +}
 </style> </style>
 </head> </head>
Ligne 22: Ligne 48:
  
 <div class="box"> <div class="box">
-Race+Race :
 <select id="race"></select> <select id="race"></select>
 +
 +<h3>Stats de base</h3>
 +<pre id="baseStats"></pre>
 </div> </div>
  
 <div class="box"> <div class="box">
-Stats+<h3>Améliorations</h3>
 <div id="stats"></div> <div id="stats"></div>
 +<div id="cost"></div>
 </div> </div>
  
 <div class="box"> <div class="box">
-Équipement<br>+<h3>Équipement (3 max + 1 anneau)</h3> 
 Tête <select id="head"></select> <span id="headStats"></span><br> Tête <select id="head"></select> <span id="headStats"></span><br>
 Cou <select id="neck"></select> <span id="neckStats"></span><br> Cou <select id="neck"></select> <span id="neckStats"></span><br>
Ligne 41: Ligne 72:
 Anneau <select id="ring"></select> <span id="ringStats"></span><br> Anneau <select id="ring"></select> <span id="ringStats"></span><br>
 Pieds <select id="feet"></select> <span id="feetStats"></span> Pieds <select id="feet"></select> <span id="feetStats"></span>
 +
 +<div id="limitWarn" style="color:red;"></div>
 </div> </div>
  
 <div class="box"> <div class="box">
-Compétences+<h3>Passifs</h3>
 <div id="skills"></div> <div id="skills"></div>
 </div> </div>
  
-<button onclick="calculate()">Calculer</button> +<button onclick="resetAll()">Reset</button>
-<button onclick="exportWiki()">Export Wiki</button> +
- +
-<pre id="result"></pre>+
  
 +<pre id="result" class="result"></pre>
  
 <script> <script>
  
-// ===== DATA =====+// ===== RACES =====
 const races = { const races = {
 Elfe:{cc:9,ct:10,f:9,e:4,agi:9,p:5,mvt:5,pv:55,pm:30,r:4,rm:6,fm:8,m:6}, Elfe:{cc:9,ct:10,f:9,e:4,agi:9,p:5,mvt:5,pv:55,pm:30,r:4,rm:6,fm:8,m:6},
Ligne 65: Ligne 96:
 }; };
  
 +// ===== COST =====
 const costTable = { const costTable = {
-cc:[100,50,30], f:[120,55,30], e:[120,55,30], m:[110,55,35], +cc:[100,50,30], ct:[110,50,30], 
-pv:[4,2,1], mvt:[100,50,30]+f:[120,55,30], e:[120,55,30], 
 +agi:[95,45,25], 
 +m:[110,55,35], 
 +fm:[100,50,30], 
 +p:[110,85,78], 
 +pv:[4,2,1], 
 +pm:[5,3,1], 
 +mvt:[100,50,30], 
 +r:[40,30,15], 
 +rm:[50,40,20]
 }; };
  
 +// ===== PASSIFS =====
 +const skills = [
 +{name:"Fulgurance",desc:"+1 esquive"},
 +{name:"Couverture",desc:"85% CC / 15% AGI"},
 +{name:"Réflexes fulgurants",desc:"85% AGI / 15% CC"},
 +{name:"Anguille",desc:"Avantage esquive"}
 +];
 +
 +
 +// ===== ÉQUIPEMENTS =====
 const equipments = [ const equipments = [
  
Ligne 166: Ligne 216:
 ]; ];
  
- +// ===== INIT =====
- +
- +
-const skills = ["Fulgurance","Duelliste","Encaisser","Anguille"]; +
- +
-// ===== DOM =====+
 const raceSelect = document.getElementById("race"); const raceSelect = document.getElementById("race");
 const statsDiv = document.getElementById("stats"); const statsDiv = document.getElementById("stats");
-const skillsDiv = document.getElementById("skills");+const baseDiv = document.getElementById("baseStats");
  
-const head = document.getElementById("head"); 
-const neck = document.getElementById("neck"); 
-const cape = document.getElementById("cape"); 
-const rightHand = document.getElementById("rightHand"); 
-const leftHand = document.getElementById("leftHand"); 
-const body = document.getElementById("body"); 
-const ring = document.getElementById("ring"); 
-const feet = document.getElementById("feet"); 
- 
-// ===== INIT ===== 
- 
-// race 
 for(let r in races){ for(let r in races){
 raceSelect.innerHTML += `<option>${r}</option>`; raceSelect.innerHTML += `<option>${r}</option>`;
 } }
  
-// stats+// stats UI
 for(let s in costTable){ for(let s in costTable){
-statsDiv.innerHTML += `${s} <input type="number" id="${s}" value="0"><br>`;+statsDiv.innerHTML += ` 
 +<div class="statLine"> 
 +<span>${s}</span> 
 +<input type="number" id="${s}" value="0" min="0"> 
 +</div>`;
 } }
  
-// skills+// passifs
 skills.forEach(s=>{ skills.forEach(s=>{
-skillsDiv.innerHTML += `<label><input type="checkbox" class="sk"> ${s}</label><br>`;+document.getElementById("skills").innerHTML += ` 
 +<label> 
 +<input type="checkbox" class="skill" data-name="${s.name}"> 
 +<b>${s.name}</b><br> 
 +<span class="small">${s.desc}</span> 
 +</label><br>`;
 }); });
  
-// slots reset +// base stats 
-function resetSlots(){ +function displayBase(){ 
-[head,neck,cape,rightHand,leftHand,body,ring,feet].forEach(sel=>{ +baseDiv.textContent = JSON.stringify(races[raceSelect.value],null,2);
-sel.innerHTML = `<option value="">--</option>`; +
-});+
 } }
 +raceSelect.addEventListener("change", displayBase);
 +displayBase();
  
-// remplir équipements +// ===== COST ===== 
-function fillEquip(){ +function calcCost(b,m1,m2,n){ 
-let r = raceSelect.value;+let total=0,last=b; 
 +for(let i=1;i<=n;i++){ 
 +if(i===1) last=b; 
 +else if(i<=3) last+=m1; 
 +else last+=m2; 
 +total+=last; 
 +} 
 +return total; 
 +}
  
-console.log(e.slot);+function updateCost(){ 
 +let total=0; 
 +for(let s in costTable){ 
 +let v=+document.getElementById(s).value||0; 
 +let [b,m1,m2]=costTable[s]; 
 +total+=calcCost(b,m1,m2,v); 
 +} 
 +document.getElementById("cost").innerHTML="💰 PI : "+total; 
 +}
  
-equipments.forEach((e,i)=>{ +// ===== SLOTS ===== 
-if(e.race!=="all" && e.race!==r) return;+const slots = { 
 +head:head,neck:neck,cape:cape,rightHand:rightHand, 
 +leftHand:leftHand,body:body,ring:ring,feet:feet 
 +};
  
-// main droite +function resetSlots(){ 
-if(e.slot==="weapon"||e.slot==="weapon2h") +Object.values(slots).forEach(s=>s.innerHTML="<option value=''>--</option>"); 
-rightHand.innerHTML += `<option value="${i}">${e.name}</option>`;+}
  
-// main gauche +function fillEquip(){ 
-if(e.slot==="offhand") +let r=raceSelect.value;
-leftHand.innerHTML += `<option value="${i}">${e.name}</option>`; +
- +
-// corps +
-if(e.slot==="body") +
-body.innerHTML += `<option value="${i}">${e.name}</option>`; +
- +
-// tête +
-if(e.slot==="head") +
-head.innerHTML += `<option value="${i}">${e.name}</option>`;+
  
-// cou +equipments.forEach((e,i)=>{ 
-if(e.slot==="neck") +if(e.race!=="all"&&e.race!==r) return;
-neck.innerHTML += `<option value="${i}">${e.name}</option>`; +
- +
-// dos +
-if(e.slot==="cape") +
-cape.innerHTML += `<option value="${i}">${e.name}</option>`; +
- +
-// pieds +
-if(e.slot==="feet") +
-feet.innerHTML += `<option value="${i}">${e.name}</option>`; +
- +
-// anneau +
-if(e.slot==="ring") +
-ring.innerHTML += `<option value="${i}">${e.name}</option>`;+
  
 +if(e.slot==="weapon"||e.slot==="weapon2h") rightHand.innerHTML+=`<option value="${i}">${e.name}</option>`;
 +if(e.slot==="offhand") leftHand.innerHTML+=`<option value="${i}">${e.name}</option>`;
 +if(e.slot==="body") body.innerHTML+=`<option value="${i}">${e.name}</option>`;
 +if(e.slot==="head") head.innerHTML+=`<option value="${i}">${e.name}</option>`;
 +if(e.slot==="neck") neck.innerHTML+=`<option value="${i}">${e.name}</option>`;
 +if(e.slot==="cape") cape.innerHTML+=`<option value="${i}">${e.name}</option>`;
 +if(e.slot==="feet") feet.innerHTML+=`<option value="${i}">${e.name}</option>`;
 +if(e.slot==="ring") ring.innerHTML+=`<option value="${i}">${e.name}</option>`;
 }); });
 } }
  
-// update +raceSelect.addEventListener("change",()=>{
-raceSelect.addEventListener("change", ()=>{+
 resetSlots(); resetSlots();
 fillEquip(); fillEquip();
 +autoCalculate();
 }); });
  
Ligne 262: Ligne 309:
 fillEquip(); fillEquip();
  
-// 2 mains +// ===== BONUS ===== 
-rightHand.addEventListener("change", ()=>{ +function displayStats(select,id){ 
-let v = rightHand.value; +let v=select.value; 
-if(v===""){ leftHand.disabled=false; return;}+let el=document.getElementById(id); 
 +if(v===""){el.innerHTML="";return;} 
 +let e=equipments[v]; 
 +let txt=""; 
 +for(let s in e.stats){ 
 +let val=e.stats[s]; 
 +txt+=val>0?`+${val} ${s} `:`${val} ${s} `; 
 +} 
 +el.innerHTML=txt; 
 +}
  
-let item = equipments[v]; +Object.entries(slots).forEach(([k,s])=>{ 
-if(item.slot==="weapon2h"){ +s.addEventListener("change",()=>{ 
-leftHand.value=""; +displayStats(s,k+"Stats"); 
-leftHand.disabled=true; +checkLimit(); 
-}else{ +autoCalculate(); 
-leftHand.disabled=false; +});
-}+
 }); });
  
-head.addEventListener("change", ()=> displayStats(head,"headStats")); +// ===== LIMIT ===== 
-neck.addEventListener("change", ()=> displayStats(neck,"neckStats")); +function checkLimit(){ 
-cape.addEventListener("change", ()=> displayStats(cape,"capeStats")); +let count=0; 
-rightHand.addEventListener("change", ()=> displayStats(rightHand,"rightStats")); +Object.entries(slots).forEach(([k,s])=>{ 
-leftHand.addEventListener("change", ()=> displayStats(leftHand,"leftStats")); +if(k!=="ring"&&s.value!=="") count++; 
-body.addEventListener("change", ()=> displayStats(body,"bodyStats")); +});
-ring.addEventListener("change", ()=> displayStats(ring,"ringStats")); +
-feet.addEventListener("change", ()=> displayStats(feet,"feetStats"));+
  
-// ===== CALCUL ===== +if(count>=3){ 
- +limitWarn.innerText="Limite atteinte"; 
-function calcCost(base,m1,m2,n){ +Object.entries(slots).forEach(([k,s])=>{ 
-let total=0; +if(k!=="ring"&&s.value==="") s.disabled=true; 
-let last=base; +}); 
- +}else{ 
-for(let i=1;i<=n;i++){ +limitWarn.innerText=""; 
-if(i===1) last=base; +Object.values(slots).forEach(s=>s.disabled=false);
-else if(i<=3) last+=m1; +
-else last+=m2; +
- +
-total+=last;+
 } }
-return total; 
-} 
- 
-function displayStats(select, targetId){ 
-  let id = select.value; 
-  let target = document.getElementById(targetId); 
- 
-  if(id===""){ 
-    target.innerHTML = ""; 
-    return; 
-  } 
- 
-  let item = equipments[id]; 
- 
-  let txt = " → "; 
- 
-  for(let stat in item.stats){ 
-    let val = item.stats[stat]; 
-    if(val >= 0){ 
-      txt += `+${val} ${stat} `; 
-    } else { 
-      txt += `${val} ${stat} `; 
-    } 
-  } 
- 
-  if(item.magicBlock){ 
-    txt += " ❗No Magic"; 
-  } 
- 
-  target.innerHTML = txt; 
 } }
  
 +// ===== CALCUL =====
 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;
- +
-// calcul coût +
-let [b,m1,m2] = costTable[s]; +
-totalPI += calcCost(b,m1,m2,v);+
 } }
  
 // equip // equip
-[head,neck,cape,rightHand,leftHand,body,ring,feet].forEach(sel=>{+Object.values(slots).forEach(sel=>{
 if(sel.value==="") return; if(sel.value==="") return;
- +let e=equipments[sel.value]; 
-let e = equipments[sel.value]; +for(let s in e.stats){ 
- +char[s]=(char[s]||0)+e.stats[s];
-for(let stat in e.stats){ +
-char[stat]=(char[stat]||0)+e.stats[stat];+
 } }
 }); });
 +
 +// esquive
 +let esquive=Math.round(char.agi*0.75+char.cc*0.25);
 +
 +let checked=[...document.querySelectorAll(".skill:checked")].map(e=>e.dataset.name);
 +
 +if(checked.includes("Réflexes fulgurants"))
 +esquive=Math.round(char.agi*0.85+char.cc*0.15);
 +
 +if(checked.includes("Couverture"))
 +esquive=Math.round(char.cc*0.85+char.agi*0.15);
 +
 +if(checked.includes("Fulgurance"))
 +esquive+=1;
  
 // affichage // affichage
-result.innerText = +result.textContent = 
-JSON.stringify(char,null,2) +"===== STATS =====\n"+ 
-+ "\n\n💰 PI utilisés : " + totalPI;+JSON.stringify(char,null,2)+ 
 +"\n\n⚔ CC : "+char.cc+ 
 +"\n🎯 CT : "+char.ct+ 
 +"\n✨ FM : "+char.fm+ 
 +"\n🛡 Esquive : "+esquive;
 } }
  
 +// ===== AUTO =====
 +function autoCalculate(){
 +updateCost();
 +calculate();
 +}
  
 +// events stats
 +document.querySelectorAll("#stats input").forEach(i=>{
 +i.addEventListener("input", autoCalculate);
 +});
  
-// ===== EXPORT ===== +// passifs 
-function exportWiki(){+document.querySelectorAll(".skill").forEach(s=>{ 
 +s.addEventListener("change", autoCalculate); 
 +});
  
-let txt="=== Build ===\n"; +// ===== RESET ===== 
-txt+="Race: "+raceSelect.value+"\n\n";+function resetAll(){
  
-document.querySelectorAll(".sk:checked").forEach(s=>{ +document.querySelectorAll("#stats input").forEach(i=>i.value=0); 
-txt+="* "+s.parentNode.innerText+"\n";+ 
 +Object.values(slots).forEach(s=>{ 
 +s.value=""; 
 +s.disabled=false;
 }); });
  
-result.innerText=txt;+document.querySelectorAll(".skill").forEach(s=>s.checked=false); 
 + 
 +resetSlots(); 
 +fillEquip(); 
 +displayBase(); 
 +checkLimit(); 
 +autoCalculate();
 } }
  
-</script>+// init 
 +autoCalculate();
  
 +</script>
 </body> </body>
 </html> </html>
brouillon10.1777473696.txt.gz · Dernière modification : 2026/04/29 16:41 de nanaki