CharakterCreator: Unterschied zwischen den Versionen

Aus Dunkelherzen Wiki
Zum nächsten Versionsunterschied →
VisuellWikitext
Die Seite wurde neu angelegt: „== Charakter Creator == <div id="charakter-creator"> <label>Name: <input type="text" id="name"></label><br><br> <label>Rasse: <select id="rasse" onchange="updateAttributes()"> <option value="">-- Wähle --</option> <option value="elf">Elf</option> <option value="ork">Ork</option> <option value="mensch">Mensch</option> </select> </label><br> <label>Subrasse: <select id="subrasse" onchange="updateAttributes()">…“
 
Keine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
== Charakter Creator ==
<html>
<div id="charakter-creator">
<style>
   <label>Name: <input type="text" id="name"></label><br><br>
  .creator-form {
    max-width: 600px;
    margin: auto;
    font-family: sans-serif;
  }
 
  .creator-form label {
    font-weight: bold;
    display: block;
    margin-top: 10px;
  }
 
  .creator-form input,
  .creator-form select {
    width: 100%;
    padding: 5px;
    margin-bottom: 10px;
  }
 
  .creator-form button {
    margin-top: 15px;
    padding: 10px;
    width: 100%;
  }
 
  .output {
    margin-top: 20px;
    padding: 10px;
    background: #f8f8f8;
    border: 1px solid #ccc;
    white-space: pre-wrap;
   }
</style>
 
<div class="creator-form">
  <h2>Charakter Creator</h2>


   <label>Rasse:
   <label for="name">Name:</label>
    <select id="rasse" onchange="updateAttributes()">
  <input type="text" id="name" placeholder="Name des Charakters">
      <option value="">-- Wähle --</option>
      <option value="elf">Elf</option>
      <option value="ork">Ork</option>
      <option value="mensch">Mensch</option>
    </select>
  </label><br>


   <label>Subrasse:
   <label for="klasse">Klasse:</label>
    <select id="subrasse" onchange="updateAttributes()">
  <select id="klasse">
      <option value="">-- Wähle --</option>
    <option value="">Wähle...</option>
      <option value="waldelf">Waldelf</option>
    <option value="Krieger">Krieger (+2 Stärke)</option>
      <option value="hochmodrasse">Hochmodrasse</option>
    <option value="Magier">Magier (+2 Intelligenz)</option>
    </select>
  </select>
  </label><br>


   <label>Klasse:
   <label for="rasse">Rasse:</label>
    <select id="klasse" onchange="updateAttributes()">
  <select id="rasse">
      <option value="">-- Wähle --</option>
    <option value="">Wähle...</option>
      <option value="krieger">Krieger</option>
    <option value="Mensch">Mensch (+1 Charisma)</option>
      <option value="magier">Magier</option>
    <option value="Elf">Elf (+1 Geschick)</option>
    </select>
  </select>
  </label><br>


   <label>Subklasse:
   <button onclick="berechneWerte()">Werte berechnen</button>
    <select id="subklasse" onchange="updateAttributes()">
  <button onclick="exportiereDaten()">Charakterdaten exportieren</button>
      <option value="">-- Wähle --</option>
      <option value="berserker">Berserker</option>
      <option value="feuerzauberer">Feuerzauberer</option>
    </select>
  </label><br><br>


   <h3>Attribute</h3>
   <div class="output" id="ausgabe"></div>
  <table class="wikitable">
    <tr><th>Attribut</th><th>Wert</th></tr>
    <tr><td>Stärke</td><td><input id="stärke" type="number" readonly></td></tr>
    <tr><td>Agilität</td><td><input id="agilität" type="number" readonly></td></tr>
    <tr><td>Konstitution</td><td><input id="konstitution" type="number" readonly></td></tr>
    <tr><td>Intelligenz</td><td><input id="intelligenz" type="number" readonly></td></tr>
    <tr><td>Resistenz</td><td><input id="resistenz" type="number" readonly></td></tr>
    <tr><td>Charisma</td><td><input id="charisma" type="number" readonly></td></tr>
    <tr><td>Geschick</td><td><input id="geschick" type="number" readonly></td></tr>
    <tr><td>Wahrnehmung</td><td><input id="wahrnehmung" type="number" readonly></td></tr>
  </table>
</div>
</div>


<script>
<script>
const basis = {
  function berechneWerte() {
  stärke: 5,
    const name = document.getElementById("name").value;
  agilität: 5,
    const klasse = document.getElementById("klasse").value;
  konstitution: 5,
    const rasse = document.getElementById("rasse").value;
  intelligenz: 5,
 
  resistenz: 5,
    // Grundwerte
  charisma: 5,
    let werte = {
  geschick: 5,
      Stärke: 5,
  wahrnehmung: 5,
      Intelligenz: 5,
};
      Charisma: 5,
      Geschick: 5
    };
 
    // Klassenboni
    if (klasse === "Krieger") werte["Stärke"] += 2;
    if (klasse === "Magier") werte["Intelligenz"] += 2;
 
    // Rassenboni
    if (rasse === "Mensch") werte["Charisma"] += 1;
    if (rasse === "Elf") werte["Geschick"] += 1;
 
    const daten = {
      Name: name,
      Klasse: klasse,
      Rasse: rasse,
      Attribute: werte
    };


const boni = {
    document.getElementById("ausgabe").textContent = JSON.stringify(daten, null, 2);
  rasse: {
    elf: { agilität: 2, intelligenz: 1 },
    ork: { stärke: 2, konstitution: 1 },
    mensch: { charisma: 1, geschick: 1, intelligenz: 1 },
  },
  subrasse: {
    waldelf: { geschick: 1 },
    hochmodrasse: { resistenz: 1 },
  },
  klasse: {
    krieger: { stärke: 2, konstitution: 1 },
    magier: { intelligenz: 2, resistenz: 1 },
  },
  subklasse: {
    berserker: { stärke: 1, resistenz: 1 },
    feuerzauberer: { intelligenz: 1, wahrnehmung: 1 },
   }
   }
};


function updateAttributes() {
  function exportiereDaten() {
  let attr = { ...basis };
    const ausgabe = document.getElementById("ausgabe").textContent;
    if (!ausgabe) {
      alert("Bitte erst Daten berechnen!");
      return;
    }


  const r = document.getElementById('rasse').value;
    const blob = new Blob([ausgabe], { type: "application/json" });
  const sr = document.getElementById('subrasse').value;
    const url = URL.createObjectURL(blob);
  const k = document.getElementById('klasse').value;
    const a = document.createElement("a");
  const sk = document.getElementById('subklasse').value;


  [boni.rasse[r], boni.subrasse[sr], boni.klasse[k], boni.subklasse[sk]].forEach(bonus => {
    a.href = url;
    if (!bonus) return;
     a.download = "charakter.json";
     for (const key in bonus) {
     a.click();
      attr[key] += bonus[key];
     }
  });


  for (const key in attr) {
     URL.revokeObjectURL(url);
     document.getElementById(key).value = attr[key];
   }
   }
}
</script>
</script>
</html>

Version vom 25. Juli 2025, 17:30 Uhr

Charakter Creator

Abgerufen von „https://wiki.dunkelherzen.dedyn.io/index.php?title=CharakterCreator&oldid=536“