Wiki of Olympia

Outils pour utilisateurs

Outils du site

Piste :
brouillon4

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
brouillon4 [2026/04/21 15:51] – nanakibrouillon4 [2026/04/21 21:02] (Version actuelle) – nanaki
Ligne 1: Ligne 1:
 +
 +
 <html> <html>
 +
 +<style>
 +body { font-family: Arial, sans-serif; margin: 10px; }
 +
 +.controls { display:flex; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
 +
 +#pointsBox { font-weight:bold; margin-bottom:10px; }
 +
 +table { width:100%; border-collapse:collapse; }
 +th, td { border:1px solid #ccc; padding:6px; text-align:left; }
 +th { background:#f2f2f2; cursor:pointer; }
 +tr:nth-child(even){ background:#fafafa; }
 +
 +.offensif { background:#ffe5e5; }
 +.defensif { background:#e5f0ff; }
 +.utilitaire { background:#e5ffe5; }
 +.malediction { background:#eadcff; }
 +
 +.lvl { padding:2px 6px; border-radius:4px; }
 +.lvl-1 { background:#ddd; }
 +.lvl-2 { background:#cce5ff; }
 +
 +</style>
 +
 +<div id="pointsBox">
 +Points utilisés : <span id="points">0</span> / 15
 +</div>
 +
 +<div class="controls">
 +
 +<select id="raceFilter">
 +<option value="Toutes">Toutes</option>
 +<option value="Communs">Communs</option>
 +</select>
 +
 +<select id="typeFilter">
 +<option value="Tous">Tous types</option>
 +<option value="CAC">CAC</option>
 +<option value="Distance">Distance</option>
 +<option value="Sort">Sort</option>
 +</select>
 +
 +<select id="effectFilter">
 +<option value="Tous">Tous effets</option>
 +<option value="offensif">Offensif</option>
 +<option value="defensif">Soutien / Défensif</option>
 +<option value="malediction">Malédiction</option>
 +</select>
 +
 +<input type="text" id="search" placeholder="Rechercher...">
 +
 +</div>
 +
 +<table id="table">
 +<thead>
 +<tr>
 +<th>Choix</th>
 +<th>Race</th>
 +<th>Nom</th>
 +<th>Type</th>
 +<th>Effet</th>
 +<th>Niveau</th>
 +</tr>
 +</thead>
 +
 +<tbody>
 +
 +<!-- AUTO IMPORT SORTS -->
 +
 +<tr class="Communs offensif" data-type="Sort" data-effect="offensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Arcane ajustée</td><td>Sort</td><td>Avantage toucher</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs offensif" data-type="Sort" data-effect="offensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Arcanes précises</td><td>Sort</td><td>+4 toucher</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs offensif" data-type="Sort" data-effect="offensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Arcanes violentes</td><td>Sort</td><td>-6 toucher +5 dégâts</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Aveuglement</td><td>Sort</td><td>-1 P</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Coup précis</td><td>Sort</td><td>Dextérité x2</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Épuisement arcanique</td><td>Sort</td><td>Essoufflement</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Maladresse</td><td>Sort</td><td>Maladresse x2</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Peau de granit</td><td>Sort</td><td>Protection x2</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Restauration mineure</td><td>Sort</td><td>Soin</td><td>1</td>
 +</tr>
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Vulnérabilité</td><td>Sort</td><td>Vulnérabilité x2</td><td>1</td>
 +</tr>
 +
 +<!-- NIVEAU 2 exemples -->
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Agressivité</td><td>Sort</td><td>Agressivité x1</td><td>2</td>
 +</tr>
 +
 +<tr class="HS offensif" data-type="Sort" data-effect="offensif">
 +<td><input type="checkbox" class="skill"></td><td>HS</td><td>Aiguillon</td><td>Sort</td><td>+3</td><td>2</td>
 +</tr>
 +
 +<tr class="Communs offensif" data-type="Sort" data-effect="offensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Drain</td><td>Sort</td><td>Drain</td><td>2</td>
 +</tr>
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Faiblesse</td><td>Sort</td><td>Faiblesse</td><td>2</td>
 +</tr>
 +
 +<tr class="Olympien offensif" data-type="Sort" data-effect="offensif">
 +<td><input type="checkbox" class="skill"></td><td>Olympien</td><td>Lame Volante</td><td>Sort</td><td>+3</td><td>2</td>
 +</tr>
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Régénération</td><td>Sort</td><td>Soin</td><td>2</td>
 +</tr>
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Stabilisation</td><td>Sort</td><td>Stabilité</td><td>2</td>
 +</tr>
 +
 +<!-- NIVEAU 3 -->
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Aide</td><td>Sort</td><td>Dextérité x4</td><td>3</td>
 +</tr>
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Fatigue</td><td>Sort</td><td>Vulnérabilité x4</td><td>3</td>
 +</tr>
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Récupération</td><td>Sort</td><td>Soin</td><td>3</td>
 +</tr>
 +
 +<!-- NIVEAU 4 exemples -->
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Bénédiction</td><td>Sort</td><td>Buff majeur</td><td>4</td>
 +</tr>
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Friabilité</td><td>Sort</td><td>Fragilité x2</td><td>4</td>
 +</tr>
 +
 +<tr class="Géant offensif" data-type="Sort" data-effect="offensif">
 +<td><input type="checkbox" class="skill"></td><td>Géant</td><td>Météore</td><td>Sort</td><td>+M feu</td><td>4</td>
 +</tr>
 +
 +<!-- NIVEAU 5 -->
 +
 +<tr class="Communs malediction" data-type="Sort" data-effect="malediction">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Exténuation</td><td>Sort</td><td>Vulnérabilité x8</td><td>5</td>
 +</tr>
 +
 +<tr class="Communs defensif" data-type="Sort" data-effect="defensif">
 +<td><input type="checkbox" class="skill"></td><td>Communs</td><td>Sauvegarde</td><td>Sort</td><td>Protection x8</td><td>5</td>
 +</tr>
 +
 +</tbody>
 +</table>
 +
 <script> <script>
-alert("JS OK");+const maxPoints = 15; 
 + 
 +const raceFilter = document.getElementById("raceFilter"); 
 +const typeFilter = document.getElementById("typeFilter"); 
 +const effectFilter = document.getElementById("effectFilter"); 
 +const search = document.getElementById("search"); 
 +const rows = document.querySelectorAll("#table tbody tr"); 
 +const checkboxes = document.querySelectorAll(".skill"); 
 +const pointsDisplay = document.getElementById("points"); 
 + 
 +function updatePoints(e){ 
 +  let total = 0; 
 + 
 +  checkboxes.forEach(cb => { 
 +    if(cb.checked) total++; 
 +  }); 
 + 
 +  if(total > maxPoints){ 
 +    e.target.checked = false; 
 +    return; 
 +  } 
 + 
 +  pointsDisplay.textContent = total; 
 + 
 +  if(total >= maxPoints){ 
 +    checkboxes.forEach(cb => { 
 +      if(!cb.checked) cb.disabled = true; 
 +    }); 
 +  } else { 
 +    checkboxes.forEach(cb => cb.disabled = false); 
 +  } 
 +} 
 + 
 +checkboxes.forEach(cb => cb.addEventListener("change", updatePoints)); 
 + 
 +function filter(){ 
 +  const term = search.value.toLowerCase(); 
 + 
 +  rows.forEach(row=>{ 
 + 
 +    const raceOk = raceFilter.value==="Toutes" || row.classList.contains(raceFilter.value); 
 +    const typeOk = typeFilter.value==="Tous" || row.dataset.type===typeFilter.value; 
 +    const effectOk = effectFilter.value==="Tous" || row.dataset.effect===effectFilter.value; 
 +    const textOk = row.innerText.toLowerCase().includes(term); 
 + 
 +    row.style.display = (raceOk && typeOk && effectOk && textOk) ? "" : "none"; 
 +  }); 
 +} 
 + 
 +raceFilter.onchange = filter; 
 +typeFilter.onchange = filter; 
 +effectFilter.onchange = filter; 
 +search.oninput = filter; 
 + 
 +function sortTable(col){ 
 +  const tbody = document.querySelector("#table tbody"); 
 +  const rowsArr = Array.from(tbody.rows); 
 + 
 +  rowsArr.sort((a,b)=>a.cells[col].innerText.localeCompare(b.cells[col].innerText,undefined,{numeric:true})); 
 + 
 +  rowsArr.forEach(r=>tbody.appendChild(r)); 
 +}
 </script> </script>
 +
 </html> </html>
 +
brouillon4.1776779506.txt.gz · Dernière modification : 2026/04/21 15:51 de nanaki