CharakterCreator: Unterschied zwischen den Versionen

Aus Dunkelherzen Wiki
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
<!DOCTYPE html>
<html>
<html>
<style>
<head>
  .creator-form {
  <meta charset="UTF-8" />
    max-width: 800px;
  <style>
    margin: auto;
    .creator-form {
    font-family: sans-serif;
      max-width: 800px;
  }
      margin: auto;
      font-family: sans-serif;
    }


  .creator-form label {
    .creator-form label {
    font-weight: bold;
      font-weight: bold;
    display: block;
      display: block;
    margin-top: 10px;
      margin-top: 10px;
  }
    }


  .creator-form input,
    .creator-form input,
  .creator-form select {
    .creator-form select {
    width: 100%;
      width: 100%;
    padding: 5px;
      padding: 5px;
    margin-bottom: 10px;
      margin-bottom: 10px;
  }
    }


  .creator-form button {
    .creator-form button {
    margin-top: 15px;
      margin-top: 15px;
    padding: 10px;
      padding: 10px;
    width: 100%;
      width: 100%;
  }
    }


  .attribute-inputs {
    .attribute-inputs {
    display: grid;
      display: grid;
    grid-template-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
    gap: 10px;
      gap: 10px;
  }
    }


  .output {
    .output {
    margin-top: 20px;
      margin-top: 20px;
    padding: 10px;
      padding: 10px;
    background: #f8f8f8;
      background: #f8f8f8;
    border: 1px solid #ccc;
      border: 1px solid #ccc;
    white-space: pre-wrap;
      white-space: pre-wrap;
  }
    }


  .points-remaining {
    .points-remaining {
    font-weight: bold;
      font-weight: bold;
    color: #b00;
      color: #b00;
    margin-top: 10px;
      margin-top: 10px;
  }
    }
</style>
  </style>
</head>
<body>
  <div class="creator-form">
    <h2>Charakter Creator</h2>


<div class="creator-form">
    <label for="name">Name:</label>
  <h2>Charakter Creator</h2>
    <input type="text" id="name" placeholder="Name des Charakters">


  <label for="name">Name:</label>
    <label for="speziestyp">Speziestyp:</label>
  <input type="text" id="name" placeholder="Name des Charakters">
    <select id="speziestyp">
      <option value="">Keine</option>
      <option value="Humanoid">Humanoid</option>
      <option value="Ätherer">Ätherer</option>
      <option value="Mensch-Ätherer">Mensch-Ätherer</option>
      <option value="Andere Ätherer">Andere Ätherer</option>
      <option value="Non-Humanoide / Andere">Non-Humanoide / Andere</option>
      <option value="Xeutano">Xeutano</option>
      <option value="Androidenartige">Androidenartige</option>
    </select>


  <label for="klasse">Klasse:</label>
    <label for="rasse">Rasse:</label>
  <select id="klasse">
    <select id="rasse">
    <option value="">Keine</option>
      <option value="">Keine</option>
    <option value="Arbeiter">Arbeiter</option>
      <option value="Mensch">Mensch</option>
    <option value="Barde">Barde</option>
      <option value="Elf">Elf</option>
    <option value="Bote">Bote</option>
     </select>
    <option value="Gelehrter">Gelehrter</option>
    <option value="Gläubiger">Gläubiger</option>
     <option value="Kind">Kind</option>
    <option value="Krieger">Krieger</option>
    <option value="Schurke">Schurke</option>
    <option value="Schütze">Schütze</option>
    <option value="Seelenkünstler">Seelenkünstler</option>
    <option value="Soldat">Soldat</option>
    <option value="Techniker">Techniker</option>
    <option value="Vagabunde">Vagabunde</option>
  </select>


  <label for="subklasse">Subklasse:</label>
    <label for="subspezies">Subspezies:</label>
  <select id="subklasse">
    <select id="subspezies">
    <option value="">Keine (+15 GP Ausgleich)</option>
      <option value="">Keine (+20 GP Ausgleich)</option>
    <option value="Auserwählter">Auserwählter</option>
      <option value="Waldelf">Waldelf</option>
    <option value="Diener">Diener</option>
      <option value="Stadelf">Stadelf</option>
    <option value="Drogenjunkie">Drogenjunkie</option>
     </select>
    <option value="Dummkopf">Dummkopf</option>
    <option value="Dunkler Künstler">Dunkler Künstler</option>
    <option value="Gesetzloser">Gesetzloser</option>
    <option value="Glücksspieler">Glücksspieler</option>
    <option value="Händler">Händler</option>
    <option value="Koch">Koch</option>
    <option value="Kopfgeldjäger">Kopfgeldjäger</option>
    <option value="Ödländer">Ödländer</option>
    <option value="Okkultist">Okkultist</option>
    <option value="Pazifist">Pazifist</option>
    <option value="Politiker">Politiker</option>
     <option value="Revolutionär">Revolutionär</option>
    <option value="Seefahrer">Seefahrer</option>
    <option value="Spion">Spion</option>
    <option value="Mutant">Mutant</option>
  </select>


  <label for="rasse">Rasse:</label>
    <label for="klasse">Klasse:</label>
  <select id="rasse">
    <select id="klasse">
    <option value="">Keine</option>
      <option value="">Keine</option>
    <option value="Mensch">Mensch</option>
      <option value="Arbeiter">Arbeiter</option>
    <option value="Elf">Elf</option>
      <option value="Barde">Barde</option>
  </select>
      <option value="Bote">Bote</option>
      <option value="Gelehrter">Gelehrter</option>
      <option value="Gläubiger">Gläubiger</option>
      <option value="Kind">Kind</option>
      <option value="Krieger">Krieger</option>
      <option value="Schurke">Schurke</option>
      <option value="Schütze">Schütze</option>
      <option value="Seelenkünstler">Seelenkünstler</option>
      <option value="Soldat">Soldat</option>
      <option value="Techniker">Techniker</option>
      <option value="Vagabunde">Vagabunde</option>
    </select>


  <label for="subspezies">Subspezies:</label>
    <label for="subklasse">Subklasse:</label>
  <select id="subspezies">
    <select id="subklasse">
    <option value="">Keine (+20 GP Ausgleich)</option>
      <option value="">Keine (+15 GP Ausgleich)</option>
    <option value="Waldelf">Waldelf</option>
      <option value="Auserwählter">Auserwählter</option>
    <option value="Stadelf">Stadelf</option>
      <option value="Diener">Diener</option>
  </select>
      <option value="Drogenjunkie">Drogenjunkie</option>
      <option value="Dummkopf">Dummkopf</option>
      <option value="Dunkler Künstler">Dunkler Künstler</option>
      <option value="Gesetzloser">Gesetzloser</option>
      <option value="Glücksspieler">Glücksspieler</option>
      <option value="Händler">Händler</option>
      <option value="Koch">Koch</option>
      <option value="Kopfgeldjäger">Kopfgeldjäger</option>
      <option value="Ödländer">Ödländer</option>
      <option value="Okkultist">Okkultist</option>
      <option value="Pazifist">Pazifist</option>
      <option value="Politiker">Politiker</option>
      <option value="Revolutionär">Revolutionär</option>
      <option value="Seefahrer">Seefahrer</option>
      <option value="Spion">Spion</option>
      <option value="Mutant">Mutant</option>
    </select>


  <label for="gegenstaende">Gegenstände wählen:</label>
    <label for="gegenstaende">Gegenstände wählen:</label>
  <select id="gegenstaende">
    <select id="gegenstaende">
    <option value="0">Keine</option>
      <option value="0">Keine</option>
    <option value="1">1 Gegenstand (-10 GP)</option>
      <option value="1">1 Gegenstand (-10 GP)</option>
    <option value="2">2 Gegenstände (-20 GP)</option>
      <option value="2">2 Gegenstände (-20 GP)</option>
    <option value="3">3 Gegenstände (-30 GP)</option>
      <option value="3">3 Gegenstände (-30 GP)</option>
  </select>
    </select>


  <div class="points-remaining" id="punkteInfo"></div>
    <div class="points-remaining" id="punkteInfo"></div>


  <label>Attribute:</label>
    <label>Attribute:</label>
  <div class="attribute-inputs" id="attributeInputs"></div>
    <div class="attribute-inputs" id="attributeInputs"></div>


  <button onclick="berechneCharakter()">Charakter berechnen</button>
    <button onclick="berechneCharakter()">Charakter berechnen</button>
  <button onclick="exportiereCharakter()">Exportieren</button>
    <button onclick="exportiereCharakter()">Exportieren</button>


  <div class="output" id="ausgabe"></div>
    <div class="output" id="ausgabe"></div>
</div>
  </div>


<script>
  <script>
  const attributeListe = [
    const attributeListe = [
    "Agilität", "Ausdauer", "Charisma", "Geschick",
      "Agilität", "Ausdauer", "Charisma", "Geschick",
    "Intelligenz", "Konstitution", "Resistenz",
      "Intelligenz", "Konstitution", "Resistenz",
    "Stärke", "Wahrnehmung"
      "Stärke", "Wahrnehmung"
  ];
    ];


  const basisPunkte = 160;
    const basisPunkte = 160;


  const klassenBoni = {
    const zeroBoni = () =>
  "Arbeiter":        { "Agilität": 0, "Ausdauer": 4, "Charisma": 0, "Geschick": 4, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 4, "Wahrnehmung": 0 },
       Object.fromEntries(attributeListe.map(attr => [attr, 0]));
  "Barde":          { "Agilität": 0, "Ausdauer": 0, "Charisma": 8, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
  "Bote":            { "Agilität": 0, "Ausdauer": 0, "Charisma": 4, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
  "Gelehrter":       { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 4, "Konstitution": 0, "Resistenz": 4, "Stärke": 0, "Wahrnehmung": 0 },
  "Gläubiger":      { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 3, "Stärke": 0, "Wahrnehmung": 0 },
  "Kind":            { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
  "Krieger":        { "Agilität": 0, "Ausdauer": 1, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 1, "Resistenz": 0, "Stärke": 2, "Wahrnehmung": 0 },
  "Schurke":        { "Agilität": 3, "Ausdauer": 0, "Charisma": 1, "Geschick": 3, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 1, "Stärke": 0, "Wahrnehmung": 0 },
  "Schütze":        { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 2, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 2 },
  "Seelenkünstler":  { "Agilität": 0, "Ausdauer": 3, "Charisma": 0, "Geschick": 4, "Intelligenz": 4, "Konstitution": 0, "Resistenz": -5, "Stärke": 0, "Wahrnehmung": 0 },
  "Soldat":          { "Agilität": 0, "Ausdauer": 2, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 4, "Resistenz": 2, "Stärke": 0, "Wahrnehmung": 0 },
  "Techniker":      { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 4, "Intelligenz": 3, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 3 },
  "Vagabunde":      { "Agilität": 0, "Ausdauer": 1, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 1, "Stärke": 0, "Wahrnehmung": 0 }
};


const subklassenBoni = {
    const klassenBoni = Object.fromEntries([
  "Auserwählter":       { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
       "Arbeiter", "Barde", "Bote", "Gelehrter", "Gläubiger", "Kind", "Krieger", "Schurke",
  "Diener":            { "Agilität": 4, "Ausdauer": 4, "Charisma": 0, "Geschick": 4, "Intelligenz": 0, "Konstitution": 4, "Resistenz": -10, "Stärke": 4, "Wahrnehmung": 4 },
       "Schütze", "Seelenkünstler", "Soldat", "Techniker", "Vagabunde"
  "Drogenjunkie":       { "Agilität": 0, "Ausdauer": 1, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 1, "Resistenz": 1, "Stärke": 0, "Wahrnehmung": 0 },
    ].map(name => [name, zeroBoni()]));
  "Dummkopf":          { "Agilität": 3, "Ausdauer": 4, "Charisma": 3, "Geschick": -2, "Intelligenz": -3, "Konstitution": 4, "Resistenz": 4, "Stärke": 3, "Wahrnehmung": 3 },
  "Dunkler Künstler":  { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
  "Gesetzloser":        { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
  "Glücksspieler":      { "Agilität": 1, "Ausdauer": 0, "Charisma": 1, "Geschick": 1, "Intelligenz": 0, "Konstitution": -4, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 1 },
  "Händler":            { "Agilität": 0, "Ausdauer": 0, "Charisma": 4, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 1, "Stärke": 0, "Wahrnehmung": 1 },
  "Koch":              { "Agilität": 0, "Ausdauer": 2, "Charisma": 1, "Geschick": 4, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 1, "Stärke": 0, "Wahrnehmung": 0 },
  "Kopfgeldjäger":      { "Agilität": 1, "Ausdauer": 1, "Charisma": -2, "Geschick": 1, "Intelligenz": 0, "Konstitution": 1, "Resistenz": 1, "Stärke": 1, "Wahrnehmung": 1 },
  "Ödländer":          { "Agilität": 0, "Ausdauer": 2, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 2, "Resistenz": 2, "Stärke": 0, "Wahrnehmung": 0 },
  "Okkultist":          { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 2, "Stärke": 0, "Wahrnehmung": 0 },
  "Pazifist":          { "Agilität": 0, "Ausdauer": 0, "Charisma": 8, "Geschick": 0, "Intelligenz": 2, "Konstitution": 0, "Resistenz": 2, "Stärke": -2, "Wahrnehmung": 0 },
  "Politiker":          { "Agilität": 0, "Ausdauer": 0, "Charisma": 6, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 2, "Stärke": 0, "Wahrnehmung": 0 },
  "Revolutionär":      { "Agilität": 1, "Ausdauer": 1, "Charisma": 1, "Geschick": 1, "Intelligenz": 1, "Konstitution": 1, "Resistenz": 1, "Stärke": 1, "Wahrnehmung": 1 },
  "Seefahrer":          { "Agilität": 0, "Ausdauer": 3, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 3, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
  "Spion":              { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
  "Mutant":            { "Agilität": 0, "Ausdauer": 2, "Charisma": 0, "Geschick": 0, "Intelligenz": 0, "Konstitution": 2, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 }
};


    const subklassenBoni = Object.fromEntries([
      "Auserwählter", "Diener", "Drogenjunkie", "Dummkopf", "Dunkler Künstler", "Gesetzloser",
      "Glücksspieler", "Händler", "Koch", "Kopfgeldjäger", "Ödländer", "Okkultist",
      "Pazifist", "Politiker", "Revolutionär", "Seefahrer", "Spion", "Mutant"
    ].map(name => [name, zeroBoni()]));


  const rassenBoni = {
    const speziestypBoni = Object.fromEntries([
    "Mensch": { "Agilität": 0, "Ausdauer": 0, "Charisma": 1, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
      "Humanoid", "Ätherer", "Mensch-Ätherer", "Andere Ätherer",
     "Elf":    { "Agilität": 1, "Ausdauer": 0, "Charisma": 0, "Geschick": 1, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 }
      "Non-Humanoide / Andere", "Xeutano", "Androidenartige"
  };
     ].map(name => [name, zeroBoni()]));


  const subspeziesBoni = {
    const rassenBoni = {
    "Waldelf": { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 1, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 1 },
      "Mensch": { "Agilität": 0, "Ausdauer": 0, "Charisma": 1, "Geschick": 0, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 },
    "Stadelf": { "Agilität": 0, "Ausdauer": 0, "Charisma": 1, "Geschick": 0, "Intelligenz": 1, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 }
      "Elf":   { "Agilität": 1, "Ausdauer": 0, "Charisma": 0, "Geschick": 1, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 }
  };
    };


  const attributeInputs = document.getElementById("attributeInputs");
    const subspeziesBoni = {
  attributeListe.forEach(attr => {
      "Waldelf": { "Agilität": 0, "Ausdauer": 0, "Charisma": 0, "Geschick": 1, "Intelligenz": 0, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 1 },
    const input = document.createElement("input");
      "Stadelf": { "Agilität": 0, "Ausdauer": 0, "Charisma": 1, "Geschick": 0, "Intelligenz": 1, "Konstitution": 0, "Resistenz": 0, "Stärke": 0, "Wahrnehmung": 0 }
    input.type = "number";
     };
    input.min = "0";
    input.value = "0";
    input.id = `attr_${attr}`;
    input.oninput = updateRemainingPoints;
    const label = document.createElement("label");
     label.textContent = attr;
    label.htmlFor = input.id;
    attributeInputs.appendChild(label);
    attributeInputs.appendChild(input);
  });


  function getBonus(boni, key) {
    const attributeInputs = document.getElementById("attributeInputs");
     return boni[key] || Object.fromEntries(attributeListe.map(attr => [attr, 0]));
     attributeListe.forEach(attr => {
  }
      const input = document.createElement("input");
      input.type = "number";
      input.min = "0";
      input.value = "0";
      input.id = `attr_${attr}`;
      input.oninput = updateRemainingPoints;
      const label = document.createElement("label");
      label.textContent = attr;
      label.htmlFor = input.id;
      attributeInputs.appendChild(label);
      attributeInputs.appendChild(input);
    });


  function sumUserInput() {
    function getBonus(boni, key) {
    return attributeListe.reduce((sum, attr) => {
       return boni[key] || zeroBoni();
       const val = parseInt(document.getElementById(`attr_${attr}`).value) || 0;
     }
      return sum + val;
     }, 0);
  }


  function updateRemainingPoints() {
    function sumUserInput() {
    let total = basisPunkte;
      return attributeListe.reduce((sum, attr) => {
    if (!document.getElementById("subspezies").value) total += 20;
        const val = parseInt(document.getElementById(`attr_${attr}`).value) || 0;
    if (!document.getElementById("subklasse").value) total += 15;
        return sum + val;
      }, 0);
    }


     const gegenstaende = parseInt(document.getElementById("gegenstaende").value) || 0;
     function updateRemainingPoints() {
    total -= gegenstaende * 10;
      let total = basisPunkte;
      if (!document.getElementById("subspezies").value) total += 20;
      if (!document.getElementById("subklasse").value) total += 15;


    const used = sumUserInput();
      const gegenstaende = parseInt(document.getElementById("gegenstaende").value) || 0;
    const remaining = total - used;
      total -= gegenstaende * 10;


    document.getElementById("punkteInfo").textContent = `Verbleibende Punkte: ${remaining} / ${total}`;
      const used = sumUserInput();
  }
      const remaining = total - used;


  function berechneCharakter() {
      document.getElementById("punkteInfo").textContent = `Verbleibende Punkte: ${remaining} / ${total}`;
    const name = document.getElementById("name").value;
     }
    const klasse = document.getElementById("klasse").value;
     const subklasse = document.getElementById("subklasse").value;
    const rasse = document.getElementById("rasse").value;
    const subspezies = document.getElementById("subspezies").value;
    const gegenstaende = parseInt(document.getElementById("gegenstaende").value) || 0;


     const basisAttribute = {};
     function berechneCharakter() {
    attributeListe.forEach(attr => {
      const name = document.getElementById("name").value;
      basisAttribute[attr] = parseInt(document.getElementById(`attr_${attr}`).value) || 0;
      const speziestyp = document.getElementById("speziestyp").value;
    });
      const rasse = document.getElementById("rasse").value;
      const subspezies = document.getElementById("subspezies").value;
      const klasse = document.getElementById("klasse").value;
      const subklasse = document.getElementById("subklasse").value;
      const gegenstaende = parseInt(document.getElementById("gegenstaende").value) || 0;
 
      const basisAttribute = {};
      attributeListe.forEach(attr => {
        basisAttribute[attr] = parseInt(document.getElementById(`attr_${attr}`).value) || 0;
      });


    const gesamt = {};
      const gesamt = {};
    attributeListe.forEach(attr => {
      attributeListe.forEach(attr => {
      gesamt[attr] =
        gesamt[attr] =
        basisAttribute[attr] +
          basisAttribute[attr] +
        getBonus(klassenBoni, klasse)[attr] +
          getBonus(speziestypBoni, speziestyp)[attr] +
        getBonus(subklassenBoni, subklasse)[attr] +
          getBonus(rassenBoni, rasse)[attr] +
        getBonus(rassenBoni, rasse)[attr] +
          getBonus(subspeziesBoni, subspezies)[attr] +
        getBonus(subspeziesBoni, subspezies)[attr];
          getBonus(klassenBoni, klasse)[attr] +
    });
          getBonus(subklassenBoni, subklasse)[attr];
      });


    const daten = {
      const daten = {
      Name: name,
        Name: name,
      Klasse: klasse,
        Speziestyp: speziestyp,
      Subklasse: subklasse || "Keine (15 Punkte erhalten)",
        Rasse: rasse,
      Rasse: rasse,
        Subspezies: subspezies || "Keine (20 Punkte erhalten)",
      Subspezies: subspezies || "Keine (20 Punkte erhalten)",
        Klasse: klasse,
      Gegenstände: `${gegenstaende} (${gegenstaende * 10} Punkte abgezogen)`,
        Subklasse: subklasse || "Keine (15 Punkte erhalten)",
      Verwendete_Punkte: sumUserInput(),
        Gegenstände: `${gegenstaende} (${gegenstaende * 10} Punkte abgezogen)`,
      Gesamt_Punkte: basisPunkte + (subklasse ? 0 : 15) + (subspezies ? 0 : 20) - (gegenstaende * 10),
        Verwendete_Punkte: sumUserInput(),
      Attribute: gesamt
        Gesamt_Punkte: basisPunkte + (subklasse ? 0 : 15) + (subspezies ? 0 : 20) - (gegenstaende * 10),
    };
        Attribute: gesamt
      };


    document.getElementById("ausgabe").textContent = JSON.stringify(daten, null, 2);
      document.getElementById("ausgabe").textContent = JSON.stringify(daten, null, 2);
  }
    }


  function exportiereCharakter() {
    function exportiereCharakter() {
    const daten = document.getElementById("ausgabe").textContent;
      const daten = document.getElementById("ausgabe").textContent;
    if (!daten) {
      if (!daten) {
      alert("Bitte zuerst berechnen!");
        alert("Bitte zuerst berechnen!");
       return;
        return;
      }
      const blob = new Blob([daten], { type: "application/json" });
      const url = URL.createObjectURL(blob);
      const a = document.createElement("a");
      a.href = url;
      a.download = "charakter.json";
      a.click();
       URL.revokeObjectURL(url);
     }
     }
    const blob = new Blob([daten], { type: "application/json" });
    const url = URL.createObjectURL(blob);
    const a = document.createElement("a");
    a.href = url;
    a.download = "charakter.json";
    a.click();
    URL.revokeObjectURL(url);
  }


  document.addEventListener("DOMContentLoaded", function () {
    document.addEventListener("DOMContentLoaded", function () {
    const inputs = document.querySelectorAll("select, input[type='number']");
      const inputs = document.querySelectorAll("select, input[type='number']");
    inputs.forEach(el => {
      inputs.forEach(el => {
      el.addEventListener("input", updateRemainingPoints);
        el.addEventListener("input", updateRemainingPoints);
      el.addEventListener("change", updateRemainingPoints);
        el.addEventListener("change", updateRemainingPoints);
      });
      updateRemainingPoints();
     });
     });
    updateRemainingPoints();
   </script>
   });
</body>
</script>
</html>
</html>

Version vom 28. Juli 2025, 18:40 Uhr

<!DOCTYPE html>

Charakter Creator