From 6c14f313dd4ed4029cea0dff0a6564ac4a21977c Mon Sep 17 00:00:00 2001
From: kzongker <katrina@zongker.net>
Date: Mon, 3 Jun 2024 14:59:03 -0500
Subject: [PATCH] jsonUpdate

---
 humans.json | 120 +++++++++++++++++++++++++++++++++++++++++++++
 stats.js    | 137 +++++-----------------------------------------------
 2 files changed, 132 insertions(+), 125 deletions(-)
 create mode 100644 humans.json

diff --git a/humans.json b/humans.json
new file mode 100644
index 0000000..8d4be4a
--- /dev/null
+++ b/humans.json
@@ -0,0 +1,120 @@
+[{
+    "name": "Hiccup Horrendous Haddock III",
+    "dragon": "Toothless",
+    "age": "15/20/21",
+    "bravery": 4,
+    "intelligence": 5,
+    "speed": 5,
+    "attack": 2,
+    "defense": 3,
+    "image": "Images/Fanart/Hiccup.jpg",
+    "color": "black"
+},
+{
+    "name": "Astrid Hofferson",
+    "dragon": "Stormfly",
+    "age": "15/20/21",
+    "bravery": 4,
+    "intelligence": 5,
+    "speed": 4,
+    "attack": 4,
+    "defense": 3,
+    "image": "Images/Fanart/astrid.jpg",
+    "color": "sky"
+},
+{
+    "name": "Ruffnut Thorston",
+    "dragon": "Barf (& Belch)",
+    "age": "14/19/20",
+    "bravery": 4,
+    "intelligence": 2,
+    "speed": 3,
+    "attack": 5,
+    "defense": 1,
+    "image": "Images/Fanart/Thorstons.jpg",
+    "color": "green"
+},
+{
+    "name": "Tuffnut Thorston",
+    "dragon": "Belch (& Barf)",
+    "age": "14/19/20",
+    "bravery": 2,
+    "intelligence": 3,
+    "speed": 2,
+    "attack": 5,
+    "defense": 3,
+    "image": "Images/Fanart/Thorstons.jpg",
+    "color": "green"
+},
+{
+    "name": "Fishlegs Ingerman",
+    "dragon": "Meatlug",
+    "age": "14/19/20",
+    "bravery": 1,
+    "intelligence": 5,
+    "speed": 1,
+    "attack": 4,
+    "defense": 4,
+    "image": "Images/Fanart/fishlegsig.jpg",
+    "color": "brown"
+},
+{
+    "name": "Snotlout Jorgenson",
+    "dragon": "Hookfang",
+    "age": "15/20/21",
+    "bravery": 5,
+    "intelligence": 3,
+    "speed": 3,
+    "attack": 5,
+    "defense": 3,
+    "image": "Images/Fanart/Snotloutig.jpg",
+    "color": "scarlet"
+},
+{
+    "name": "Jeremy Zongker",
+    "dragon": "Snaggleclaw",
+    "age": "24/29/30",
+    "bravery": 3,
+    "intelligence": 5,
+    "speed": 4,
+    "attack": 4,
+    "defense": 3,
+    "image": "Images/Fanart/Hiccup.jpg",
+    "color": "blue"
+},
+{
+    "name": "Alyssa Zongker",
+    "dragon": "Emberglow",
+    "age": "13/17/18",
+    "bravery": 5,
+    "intelligence": 4,
+    "speed": 4,
+    "attack": 1,
+    "defense": 2,
+    "image": "Images/Fanart/ruffnut.jpg",
+    "color": "green"
+},
+{
+    "name": "Violet Zongker",
+    "dragon": "Indigo",
+    "age": "26/31/32",
+    "bravery": 3,
+    "intelligence": 4,
+    "speed": 3,
+    "attack": 3,
+    "defense": 4,
+    "image": "Images/Fanart/astrid.jpg",
+    "color": "indigo"
+},
+{
+    "name": "Thorn Zongker",
+    "dragon": "Tigerlily",
+    "age": "17/22/23",
+    "bravery": 2,
+    "intelligence": 4,
+    "speed": 4,
+    "attack": 1,
+    "defense": 3,
+    "image": "Images/Fanart/Thorstons.jpg",
+    "color": "chartreuse"
+}]
\ No newline at end of file
diff --git a/stats.js b/stats.js
index deda0d3..32e4b78 100644
--- a/stats.js
+++ b/stats.js
@@ -16,135 +16,22 @@ function card1ColorChange() {
 }; */
 
 //start human array
-const humans = [{
-    name: "Hiccup Horrendous Haddock III",
-    dragon: "Toothless",
-    age: "15/20/21",
-    bravery: 4,
-    intelligence: 5,
-    speed: 5,
-    attack: 2,
-    defense: 3,
-    image: "Images/Fanart/Hiccup.jpg",
-    color: "black",
-},
-{
-    name: "Astrid Hofferson",
-    dragon: "Stormfly",
-    age: "15/20/21",
-    bravery: 4,
-    intelligence: 5,
-    speed: 4,
-    attack: 4,
-    defense: 3,
-    image: "Images/Fanart/astrid.jpg",
-    color: "sky",
-},
-{
-    name: "Ruffnut Thorston",
-    dragon: "Barf (& Belch)",
-    age: "14/19/20",
-    bravery: 4,
-    intelligence: 2,
-    speed: 3,
-    attack: 5,
-    defense: 1,
-    image: "Images/Fanart/Thorstons.jpg",
-    color: "green",
-},
-{
-    name: "Tuffnut Thorston",
-    dragon: "Belch (& Barf)",
-    age: "14/19/20",
-    bravery: 2,
-    intelligence: 3,
-    speed: 2,
-    attack: 5,
-    defense: 3,
-    image: "Images/Fanart/Thorstons.jpg",
-    color: "green",
-},
-{
-    name: "Fishlegs Ingerman",
-    dragon: "Meatlug",
-    age: "14/19/20",
-    bravery: 1,
-    intelligence: 5,
-    speed: 1,
-    attack: 4,
-    defense: 4,
-    image: "Images/Fanart/fishlegsig.jpg",
-    color: "brown",
-},
-{
-    name: "Snotlout Jorgenson",
-    dragon: "Hookfang",
-    age: "15/20/21",
-    bravery: 5,
-    intelligence: 3,
-    speed: 3,
-    attack: 5,
-    defense: 3,
-    image: "Images/Fanart/Snotloutig.jpg",
-    color: "scarlet",
-},
-{
-    name: "Jeremy Zongker",
-    dragon: "Snaggleclaw",
-    age: "24/29/30",
-    bravery: 3,
-    intelligence: 5,
-    speed: 4,
-    attack: 4,
-    defense: 3,
-    image: "Images/Fanart/Hiccup.jpg",
-    color: "blue",
-},
-{
-    name: "Alyssa Zongker",
-    dragon: "Emberglow",
-    age: "13/17/18",
-    bravery: 5,
-    intelligence: 4,
-    speed: 4,
-    attack: 1,
-    defense: 2,
-    image: "Images/Fanart/ruffnut.jpg",
-    color: "green",
-},
-{
-    name: "Violet Zongker",
-    dragon: "Indigo",
-    age: "26/31/32",
-    bravery: 3,
-    intelligence: 4,
-    speed: 3,
-    attack: 3,
-    defense: 4,
-    image: "Images/Fanart/astrid.jpg",
-    color: "indigo",
-},
-{
-    name: "Thorn Zongker",
-    dragon: "Tigerlily",
-    age: "17/22/23",
-    bravery: 2,
-    intelligence: 4,
-    speed: 4,
-    attack: 1,
-    defense: 3,
-    image: "Images/Fanart/Thorstons.jpg",
-    color: "chartreuse",
-}];
+let humans = [];
+async function loadData() {
+    const response = await fetch("./humans.json");
+    humans = await response.json();
+}
 //end human array
 
 //start human card functions
 function pageLoader() {
-    fillCard();
-    fillOptions();
-    fillOptionsTwo();
-    fillColors();
-    fillImages();
+    loadData().then(() => {
+        fillCard();
+        fillOptions();
+        fillOptionsTwo();
+        fillColors();
+        fillImages();
+    });
 }
 
 function fillCard() {