Add character data and enhance character sheet layout with dynamic content

_layouts/character-sheet.html

@@ -2,4 +2,53 @@
 layout: page
 ---
 
+<div class="row">
+  {% if page.image %}
+  <div class="col s6 m4 l1">
+    <img src="{{ page.image | relative_url }}" />
+  </div>
+  {% endif %}
+  <div class="col {% if page.image %}s6 m8 l11{% else %}s12 m12 l12{% endif %}">
+    <p>
+      <strong class="cyberpunk-font-og">Straßenname:</strong>
+      <span id="streetname" class="cyberpunk-font"></span>
+    </p>
+    <p>
+      <strong class="cyberpunk-font-og">Alter:</strong>
+      <span id="age" class="cyberpunk-font"></span>
+    </p>
+    <p>
+      <strong class="cyberpunk-font-og">Rolle:</strong>
+      <span id="role" class="cyberpunk-font"></span>
+    </p>
+    <p>
+      <strong class="cyberpunk-font-og">Rollenfähigkeit:</strong>
+      <span id="role-ability" class="cyberpunk-font"></span>
+    </p>
+    <p>
+      <strong class="cyberpunk-font-og">Unterkunft:</strong>
+      <span id="housing" class="cyberpunk-font"></span>
+    </p>
+    <p>
+      <strong class="cyberpunk-font-og">Lebensstil:</strong>
+      <span id="lifestyle" class="cyberpunk-font"></span>
+    </p>
+    <p>
+      <strong class="cyberpunk-font-og">Lebenskosten:</strong>
+      <span id="costs" class="cyberpunk-font"></span>
+    </p>
+  </div>
+</div>
+{{ content }}
 
+<script>
+  fetch("{{ page.datasource | relative_url }}")
+    .then(response => response.json())
+    .then(character => {
+      document.getElementById('streetname').innerText = character.handle;
+      document.getElementById('age').innerText = character.age;
+      document.getElementById('role').innerText = character.role[0].name + " Rang: " + character.role[0].rank;
+      document.getElementById('housing').innerText = character.housing.type;
+      document.getElementById('lifestyle').innerText = character.lifestyle;
+    });
+</script>

_subpages/chase.md

@@ -2,6 +2,8 @@
 layout: character-sheet
 title: Chase Révolte
 permalink: /characters/chase
+image: /assets/img/Netrunner.png
+datasource: /assets/game-data/characters/chase.json
 ---
 
-
+Test

assets/game-data/characters/carver.json

@@ -0,0 +1,53 @@
+{
+  "name": "Carver Wright",
+  "handle": "Crash",
+  "age": 45,
+  "roles": [
+    {
+      "name": "Tech",
+      "rank": 4,
+      "skills": []
+    }
+  ],
+  "attributes": {
+    "int": 7,
+    "ref": 8,
+    "dex": 7,
+    "tech": 7,
+    "cool": 5,
+    "will": 4,
+    "luck": 7,
+    "move": 5,
+    "body": 7,
+    "emp": 5,
+    "humanity": 58
+  },
+  "skills": [
+    { "name": "", "rank": 5 },
+    { "name": "", "rank": 3 },
+    { "name": "", "rank": 4 },
+    { "name": "", "rank": 4 },
+    { "name": "", "rank": 4 },
+    { "name": "", "rank": 6 },
+    { "name": "", "rank": 3 },
+    { "name": "Sprache: Streetslang", "rank": 2 },
+    { "name": "Sprache: Muttersprache", "rank": 4 },
+    { "name": "Ortskunde: zu Hause", "rank": 4 },
+    { "name": "", "rank": 3 },
+    { "name": "", "rank": 4 },
+    { "name": "", "rank": 4 },
+    { "name": "", "rank": 4 },
+    { "name": "", "rank": 4 },
+    { "name": "", "rank": 3 },
+    { "name": "", "rank": 5 },
+    { "name": "", "rank": 6 },
+    { "name": "", "rank": 5 },
+    { "name": "", "rank": 4 }
+  ],
+  "housing": {
+    "type": "Frachtcontainer",
+    "location": "Night City",
+    "owned": false
+  },
+  "lifestyle": "Kibble"
+}

assets/game-data/characters/chase.json

@@ -0,0 +1,47 @@
+{
+  "name": "Chase Révolte",
+  "handle": null,
+  "age": 25,
+  "roles": [{ "name": "Netrunner", "rank": 4 }],
+  "attributes": {
+    "int": 6,
+    "ref": 8,
+    "dex": 8,
+    "tech": 5,
+    "cool": 7,
+    "will": 4,
+    "luck": 8,
+    "move": 5,
+    "body": 7,
+    "emp": 4,
+    "humanity": 46
+  },
+  "skills": [
+    { "name": "Concentration", "rank": 5 },
+    { "name": "Conceal/Reveal Object", "rank": 3 },
+    { "name": "Perception", "rank": 4 },
+    { "name": "Athletics", "rank": 4 },
+    { "name": "Stealth", "rank": 4 },
+    { "name": "Cryptography", "rank": 6 },
+    { "name": "Education", "rank": 3 },
+    { "name": "Sprache: Streetslang", "rank": 2 },
+    { "name": "Sprache: Muttersprache", "rank": 4 },
+    { "name": "Ortskunde: zu Hause", "rank": 2 },
+    { "name": "Brawling", "rank": 3 },
+    { "name": "Evasion", "rank": 4 },
+    { "name": "Handgun", "rank": 4 },
+    { "name": "Conversation", "rank": 4 },
+    { "name": "Human Perception", "rank": 4 },
+    { "name": "Persuasion", "rank": 3 },
+    { "name": "Basic Tech", "rank": 5 },
+    { "name": "Cybertech", "rank": 6 },
+    { "name": "Electronics/Security Tech", "rank": 5 },
+    { "name": "First Aid", "rank": 4 }
+  ],
+  "housing": {
+    "type": "Frachtcontainer",
+    "location": "Night City",
+    "owned": false
+  },
+  "lifestyle": "Kibble"
+}

assets/game-data/housings.json

@@ -0,0 +1,46 @@
+{
+  "Leben auf der Straße":{
+    "rent": 0,
+    "price": 0
+  },
+  "Leben auf der Straße in einem Fahrzeug": {
+    "rent": 0,
+    "price": 0
+  },
+  "Kastenhotel": {
+    "rent": 500,
+    "price": 0
+  },
+  "Frachtcontainer": {
+    "rent": 1000,
+    "price": 15000
+  },
+  "Atelierwohung": {
+    "rent": 1500,
+    "price": 25000
+  },
+  "Dreizimmerwohnung": {
+    "rent": 2500,
+    "price": 35000
+  },
+  "Konzernwohnung": {
+    "rent": "bereitgestellt",
+    "price": 0
+  },
+  "Hochwertige Wohnung": {
+    "rent": 7500,
+    "price": 85000
+  },
+  "Luxus-Penthouse": {
+    "rent": 15000,
+    "price": 150000
+  },
+  "Konzern-Beaverville-Haus": {
+    "rent": "bereitgestellt",
+    "price": 200000
+  },
+  "Konzern-Beaverville-McMansion": {
+    "rent": "bereitgestellt",
+    "price": 500000
+  }
+}

assets/game-data/lifestyles.json

@@ -0,0 +1,18 @@
+{
+  "Kibble": {
+    "cost": 100,
+    "description": "Du isst furchtbares Essen, das du nicht einmal für einen Hund kaufen würdest, den du magst. Einmal im Monat kannst du dir einen Film oder einen Braindance ansehen."
+  },
+  "Generisches Fertigfutter": {
+    "cost": 300,
+    "description": "Du isst Essen, dass vergleichsweise besser schmeckt als Kibble. Du kannst es dir leisten jedes Wochenende in eine gute Bar zu gehen und dort zu feiern oder dich für gutes Essen in ein Restaurant setzen."
+  },
+  "Gutes Fertigfutter": {
+    "cost": 600,
+    "description": "Dein Essen hat die gleiche Qualität wie die meisten Restaurants, und obwohl es zwar künstlich ist, schmeckt es doch fast wie echtes Essen. Du besuchst hervorragende Bars und Restaurants, wenn du ausgehst. Einmal im Monat kannst du dir ein Live-Konzert oder ein Sportereignis ansehen."
+  },
+  "Frischfutter": {
+    "cost": 1500,
+    "description": "Du isst richtiges Essen. Einmal im Monat, wenn du müde und fern der Heimat bist, kannst du in ein nahegelegenes Hotel gehen und musst dir keine Sorgen ums Budget machen. Du besuchst eine VIP-Bar. Einmal im Monat kannst du in einem Weltklasse-Restaurant essen gehen."
+  }
+}

assets/js/service-worker.js.html

@@ -26,6 +26,12 @@ const urlsToCache = [
   BASE_PATH + "/assets/fonts/Oxanium.woff2",
   BASE_PATH + "/assets/img/Netrunner.png",
   BASE_PATH + "/assets/img/Tech.png",
+  /* Game Data */
+  BASE_PATH + "/assets/game-data/housings.json",
+  BASE_PATH + "/assets/game-data/lifestyles.json",
+  BASE_PATH + "/assets/game-data/skills.json",
+  BASE_PATH + "/assets/game-data/characters/chase.json",
+  BASE_PATH + "/assets/game-data/characters/carver.json",
 ];
 
 // Installations-Event: Dateien werden in den Cache geladen