From 80bc389f6f450ae7ad6be036af7f3bc170b83ac4 Mon Sep 17 00:00:00 2001
From: Mikayla Dobson <mikaylaherself@gmail.com>
Date: Mon, 18 Jul 2022 18:57:32 -0500
Subject: [PATCH] renders card components randomly extracted from a shuffled
 deck

---
 package-lock.json                      |  29 +++-
 package.json                           |   6 +-
 src/App.css                            |  52 +++----
 src/components/Card/Card.tsx           |  16 ++-
 src/components/Gameboard/CardRow.tsx   |  19 ++-
 src/components/Gameboard/Gameboard.tsx |  46 ++++++-
 src/components/Player/Player.tsx       |  44 ++++++
 src/{util => data}/cards.json          | 180 ++++++++++++-------------
 src/data/nobles.json                   | 104 ++++++++++++++
 src/util/types.ts                      |  29 +++-
 10 files changed, 385 insertions(+), 140 deletions(-)
 create mode 100644 src/components/Player/Player.tsx
 rename src/{util => data}/cards.json (88%)
 create mode 100644 src/data/nobles.json

diff --git a/package-lock.json b/package-lock.json
index 99d0815..df21d6d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,11 +9,13 @@
       "version": "0.0.0",
       "dependencies": {
         "react": "^18.2.0",
-        "react-dom": "^18.2.0"
+        "react-dom": "^18.2.0",
+        "uuid": "^8.3.2"
       },
       "devDependencies": {
         "@types/react": "^18.0.15",
         "@types/react-dom": "^18.0.6",
+        "@types/uuid": "^8.3.4",
         "@vitejs/plugin-react": "^2.0.0",
         "typescript": "^4.6.4",
         "vite": "^3.0.0"
@@ -503,6 +505,12 @@
       "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==",
       "dev": true
     },
+    "node_modules/@types/uuid": {
+      "version": "8.3.4",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-8.3.4.tgz",
+      "integrity": "sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==",
+      "dev": true
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-2.0.0.tgz",
@@ -1377,6 +1385,14 @@
         "browserslist": ">= 4.21.0"
       }
     },
+    "node_modules/uuid": {
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/vite": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/vite/-/vite-3.0.0.tgz",
@@ -1785,6 +1801,12 @@
       "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==",
       "dev": true
     },
+    "@types/uuid": {
+      "version": "8.3.4",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-8.3.4.tgz",
+      "integrity": "sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==",
+      "dev": true
+    },
     "@vitejs/plugin-react": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-2.0.0.tgz",
@@ -2299,6 +2321,11 @@
         "picocolors": "^1.0.0"
       }
     },
+    "uuid": {
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg=="
+    },
     "vite": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/vite/-/vite-3.0.0.tgz",
diff --git a/package.json b/package.json
index 150b97e..18ba0f6 100644
--- a/package.json
+++ b/package.json
@@ -10,13 +10,15 @@
   },
   "dependencies": {
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "uuid": "^8.3.2"
   },
   "devDependencies": {
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
+    "@types/uuid": "^8.3.4",
     "@vitejs/plugin-react": "^2.0.0",
     "typescript": "^4.6.4",
     "vite": "^3.0.0"
   }
-}
\ No newline at end of file
+}
diff --git a/src/App.css b/src/App.css
index 2c5e2ef..6806254 100644
--- a/src/App.css
+++ b/src/App.css
@@ -1,41 +1,41 @@
 #root {
+  display: flex;
+  align-items: center;
+  justify-content: center;
   max-width: 1280px;
   margin: 0 auto;
   padding: 2rem;
   text-align: center;
 }
 
-.logo {
-  height: 6em;
-  padding: 1.5em;
-  will-change: filter;
-}
-.logo:hover {
-  filter: drop-shadow(0 0 2em #646cffaa);
-}
-.logo.react:hover {
-  filter: drop-shadow(0 0 2em #61dafbaa);
+.card-row {
+  display: flex;
+  flex-flow: column nowrap;
+  margin: 2rem;
+  width: 80vw;
 }
 
-@keyframes logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  a:nth-of-type(2) .logo {
-    animation: logo-spin infinite 20s linear;
-  }
+.card-row-cards-visible {
+  display: flex;
+  flex-flow: row nowrap;
+  width: 100%;
+  justify-content: space-around;
 }
 
 .card {
-  padding: 2em;
+  width: 25%;
 }
 
-.read-the-docs {
-  color: #888;
+
+.tier-1 {
+  background-color: green;
 }
+
+.tier-2 {
+  background-color: yellow;
+  color: black;
+}
+
+.tier-3 {
+  background-color: blue;
+}
\ No newline at end of file
diff --git a/src/components/Card/Card.tsx b/src/components/Card/Card.tsx
index d989f3c..f4b2f6f 100644
--- a/src/components/Card/Card.tsx
+++ b/src/components/Card/Card.tsx
@@ -6,10 +6,18 @@ type CardProps = {
 
 export default function Card({ data }: CardProps) {
     return (
-        <div className="card">
-            <p>{data.gemValue}</p>
-            <p>{data.tier}</p>
-            <p>{data.points || 0}</p>
+        <div className={`card`}>
+            <div className="top-row">
+                <p>Counts as: {data.gemValue}</p>
+                <p>Point value: {data.points || 0}</p>
+                <p>Cost:</p>
+                { Object.keys(data.resourceCost).map((key, value) => {
+                    return (
+                        // @ts-ignore
+                        <p>{key}: {data.resourceCost[key]}</p>
+                    )
+                }) }
+            </div>
         </div>
     )
 }
\ No newline at end of file
diff --git a/src/components/Gameboard/CardRow.tsx b/src/components/Gameboard/CardRow.tsx
index d1cf7a6..fc02b6f 100644
--- a/src/components/Gameboard/CardRow.tsx
+++ b/src/components/Gameboard/CardRow.tsx
@@ -1,14 +1,19 @@
+import { v4 } from 'uuid';
 import { CardData } from "../../util/types"
 import Card from "../Card/Card"
 
-export default function CardRow(tier: number, cards: CardData[]) {
+interface CardRowProps {
+    tier: number,
+    cards: CardData[]
+}
+
+export default function CardRow({tier, cards}: CardRowProps) {
     return (
-        <>
-        <p>Tier: {tier}</p>
-        <div>
-            <p>Cards:</p>
-            { cards.map((cardData: CardData) => <Card data={cardData} />) }
+        <div className={`card-row tier-${tier}`}>
+            <p>Tier: {tier}</p>
+            <div className="card-row-cards-visible">
+                { cards && cards.map((cardData: CardData) => <Card key={v4()} data={cardData} />) }
+            </div>
         </div>
-        </>
     )
 }
\ No newline at end of file
diff --git a/src/components/Gameboard/Gameboard.tsx b/src/components/Gameboard/Gameboard.tsx
index 878fbc1..9bf8cc0 100644
--- a/src/components/Gameboard/Gameboard.tsx
+++ b/src/components/Gameboard/Gameboard.tsx
@@ -1,26 +1,47 @@
 import { useEffect, useState } from 'react';
-import { CardData, NobleData, GemValue } from '../../util/types';
-import CardDeck from '../../util/cards.json';
+import { CardData, NobleData } from '../../util/types';
+import CardRow from './CardRow';
+import CardDeck from '../../data/cards.json';
+import Nobles from '../../data/nobles.json';
 
 export default function Gameboard() {
     const [state, setState] = useState({
         deck: CardDeck,
-        nobles: new Array<NobleData>,
+        nobles: Nobles.nobles,
         cardRows: {
             tierOne: new Array<CardData>,
             tierTwo: new Array<CardData>,
             tierThree: new Array<CardData>
         },
+        tradingResources: {
+            ruby: 7,
+            sapphire: 7,
+            emerald: 7,
+            diamond: 7,
+            onyx: 7,
+            gold: 5
+        }
     })
 
+    const [view, setView] = useState(<p>Loading...</p>)
+
     useEffect(() => {
         initializeBoard();
-        console.log(state || null);
+        console.log(state);
     }, [])
 
+    useEffect(() => {
+        setView(
+            <>
+            <CardRow tier={1} cards={state.cardRows.tierOne} />
+            <CardRow tier={2} cards={state.cardRows.tierTwo} />
+            <CardRow tier={3} cards={state.cardRows.tierThree} />
+            </>
+        )
+    }, [state.cardRows]);
+
     const shuffleDeck = () => {
         if (!state.deck) return;
-
         let newDeck = state.deck;
 
         for (const [key, value] of Object.entries(newDeck)) {
@@ -35,8 +56,22 @@ export default function Gameboard() {
         setState({ ...state, deck: newDeck });
     }
 
+    const setNobles = () => {
+        let newNobles = state.nobles;
+        let shuffledNobles = new Array<NobleData>;
+
+        while (shuffledNobles.length < 4) {
+            const rand = Math.floor(Math.random() * newNobles.length);
+            const randNoble = newNobles.splice(rand,1)[0];
+            shuffledNobles.push(randNoble);
+        }
+        
+        setState({ ...state, nobles: shuffledNobles });
+    }
+
     const initializeBoard = () => {
         shuffleDeck();
+        setNobles();
 
         let newState = state;
 
@@ -55,6 +90,7 @@ export default function Gameboard() {
     return (
         <div>
             <h1>Gameboard</h1>
+            { view }
         </div>
     )
 }
\ No newline at end of file
diff --git a/src/components/Player/Player.tsx b/src/components/Player/Player.tsx
new file mode 100644
index 0000000..4617449
--- /dev/null
+++ b/src/components/Player/Player.tsx
@@ -0,0 +1,44 @@
+import { useState } from "react";
+import { CardData, GemValue, NobleData, PlayerData } from "../../util/types";
+
+interface PlayerProps {
+    data: PlayerData
+}
+
+export default function Player({ data }: PlayerProps) {
+    const [state, setState] = useState({
+        name: data.name,
+        starter: data.starter,
+        points: data.points,
+        nobles: data.nobles,
+        cards: data.cards,
+        inventory: data.inventory
+    })
+
+    const buyCard = (cardData: CardData) => {
+        let newCards = state.cards;
+        newCards.push(cardData);
+        setState({ ...state, cards: newCards })
+    }
+
+    const getChips = (payload: (string | GemValue)[]) => {
+        let newInventory = state.inventory;
+        for (let value of payload) {
+            for (let key in newInventory) {
+                if (value === key) {
+                    // @ts-ignore
+                    newInventory[value] += 1;
+                }
+            }
+        }
+
+        setState({ ...state, inventory: newInventory });
+    }
+
+    return (
+        <div className="player-ui">
+            <p>Name: {data.name}</p>
+            <p>Score: {data.points}</p>
+        </div>
+    )
+}
\ No newline at end of file
diff --git a/src/util/cards.json b/src/data/cards.json
similarity index 88%
rename from src/util/cards.json
rename to src/data/cards.json
index 2717b06..e6df941 100644
--- a/src/util/cards.json
+++ b/src/data/cards.json
@@ -1,7 +1,7 @@
 {
     "tierOne": [
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 1,
                 "emerald": 1,
@@ -12,7 +12,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 1,
                 "emerald": 0,
@@ -23,7 +23,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 1,
                 "emerald": 1,
@@ -34,7 +34,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 0,
                 "emerald": 1,
@@ -45,7 +45,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 1,
                 "emerald": 1,
@@ -56,7 +56,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 2,
                 "emerald": 0,
@@ -67,7 +67,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 0,
                 "emerald": 2,
@@ -78,7 +78,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 3,
                 "emerald": 1,
@@ -89,7 +89,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 1,
                 "emerald": 3,
@@ -100,7 +100,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -111,7 +111,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 1,
                 "emerald": 2,
@@ -122,7 +122,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 1,
                 "emerald": 1,
@@ -133,7 +133,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 1,
@@ -144,7 +144,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 0,
                 "emerald": 1,
@@ -155,7 +155,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 2,
                 "emerald": 2,
@@ -166,7 +166,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 2,
                 "emerald": 1,
@@ -177,7 +177,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 2,
                 "emerald": 1,
@@ -188,7 +188,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 0,
                 "emerald": 0,
@@ -199,7 +199,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 1,
                 "emerald": 0,
@@ -210,7 +210,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 0,
                 "emerald": 0,
@@ -221,7 +221,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 1,
                 "emerald": 0,
@@ -232,7 +232,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 1,
                 "emerald": 0,
@@ -243,7 +243,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 1,
                 "emerald": 0,
@@ -254,7 +254,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 0,
                 "emerald": 1,
@@ -265,7 +265,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 0,
                 "emerald": 2,
@@ -276,7 +276,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 2,
@@ -287,7 +287,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 2,
                 "emerald": 0,
@@ -298,7 +298,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 2,
                 "emerald": 0,
@@ -309,7 +309,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 0,
                 "emerald": 0,
@@ -320,7 +320,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 2,
@@ -331,7 +331,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -342,7 +342,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -353,7 +353,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 3,
@@ -364,7 +364,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 0,
                 "emerald": 0,
@@ -375,7 +375,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 3,
                 "emerald": 0,
@@ -386,7 +386,7 @@
             "points": 0
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 4,
                 "sapphire": 0,
                 "emerald": 0,
@@ -397,7 +397,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -408,7 +408,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 4,
                 "emerald": 0,
@@ -419,7 +419,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 4,
@@ -430,7 +430,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -443,7 +443,7 @@
     ],
     "tierTwo": [
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -454,7 +454,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 0,
                 "emerald": 5,
@@ -465,7 +465,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 3,
                 "emerald": 0,
@@ -476,7 +476,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -487,7 +487,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 5,
@@ -498,7 +498,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -509,7 +509,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 5,
                 "sapphire": 0,
                 "emerald": 0,
@@ -520,7 +520,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 5,
                 "emerald": 3,
@@ -531,7 +531,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 5,
                 "sapphire": 0,
                 "emerald": 0,
@@ -542,7 +542,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 5,
                 "emerald": 0,
@@ -553,7 +553,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 3,
                 "emerald": 0,
@@ -564,7 +564,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 1,
                 "emerald": 4,
@@ -575,7 +575,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 1,
                 "sapphire": 0,
                 "emerald": 0,
@@ -586,7 +586,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 6,
@@ -597,7 +597,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 2,
                 "emerald": 0,
@@ -608,7 +608,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -619,7 +619,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 4,
                 "emerald": 2,
@@ -630,7 +630,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 2,
                 "emerald": 2,
@@ -641,7 +641,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 3,
@@ -652,7 +652,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -663,7 +663,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 0,
                 "emerald": 0,
@@ -674,7 +674,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 4,
                 "sapphire": 0,
                 "emerald": 1,
@@ -685,7 +685,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 0,
                 "emerald": 2,
@@ -696,7 +696,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 0,
                 "emerald": 3,
@@ -707,7 +707,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 2,
                 "sapphire": 3,
                 "emerald": 0,
@@ -718,7 +718,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 2,
                 "emerald": 2,
@@ -729,7 +729,7 @@
             "points": 1
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 6,
                 "sapphire": 0,
                 "emerald": 0,
@@ -740,7 +740,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 6,
                 "emerald": 0,
@@ -751,7 +751,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 3,
                 "emerald": 0,
@@ -762,7 +762,7 @@
             "points": 2
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 2,
                 "emerald": 3,
@@ -775,7 +775,7 @@
     ],
     "tierThree": [
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 7,
@@ -786,7 +786,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -797,7 +797,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 0,
                 "emerald": 0,
@@ -808,7 +808,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 3,
                 "emerald": 6,
@@ -819,7 +819,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 7,
                 "sapphire": 0,
                 "emerald": 0,
@@ -830,7 +830,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 3,
                 "emerald": 0,
@@ -841,7 +841,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 6,
                 "sapphire": 0,
                 "emerald": 3,
@@ -852,7 +852,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -863,7 +863,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 7,
                 "emerald": 0,
@@ -874,7 +874,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 6,
                 "emerald": 3,
@@ -885,7 +885,7 @@
             "points": 4
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 5,
                 "emerald": 3,
@@ -896,7 +896,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 3,
                 "emerald": 0,
@@ -907,7 +907,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 5,
                 "sapphire": 3,
                 "emerald": 3,
@@ -918,7 +918,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 3,
                 "emerald": 5,
@@ -929,7 +929,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 0,
                 "emerald": 3,
@@ -940,7 +940,7 @@
             "points": 3
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 3,
                 "emerald": 0,
@@ -951,7 +951,7 @@
             "points": 5
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 0,
                 "emerald": 0,
@@ -962,7 +962,7 @@
             "points": 5
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 3,
                 "sapphire": 0,
                 "emerald": 7,
@@ -973,7 +973,7 @@
             "points": 5
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 0,
                 "sapphire": 7,
                 "emerald": 3,
@@ -984,7 +984,7 @@
             "points": 5
         },
         {
-            "cost": {
+            "resourceCost": {
                 "ruby": 7,
                 "sapphire": 0,
                 "emerald": 0,
diff --git a/src/data/nobles.json b/src/data/nobles.json
new file mode 100644
index 0000000..56cf3a6
--- /dev/null
+++ b/src/data/nobles.json
@@ -0,0 +1,104 @@
+{
+    "nobles": [
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 0,
+                "sapphire": 4,
+                "emerald": 4,
+                "onyx": 0,
+                "diamond": 0
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 0,
+                "sapphire": 3,
+                "emerald": 0,
+                "onyx": 3,
+                "diamond": 3
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 3,
+                "sapphire": 0,
+                "emerald": 3,
+                "onyx": 3,
+                "diamond": 0
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 4,
+                "sapphire": 0,
+                "emerald": 0,
+                "onyx": 4,
+                "diamond": 0
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 0,
+                "sapphire": 0,
+                "emerald": 0,
+                "onyx": 4,
+                "diamond": 4
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 3,
+                "sapphire": 3,
+                "emerald": 3,
+                "onyx": 0,
+                "diamond": 0
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 0,
+                "sapphire": 3,
+                "emerald": 3,
+                "onyx": 0,
+                "diamond": 3
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 3,
+                "sapphire": 0,
+                "emerald": 0,
+                "onyx": 3,
+                "diamond": 3
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 4,
+                "sapphire": 0,
+                "emerald": 4,
+                "onyx": 0,
+                "diamond": 0
+            }
+        },
+        {
+            "points": 3,
+            "resourceCost": {
+                "ruby": 0,
+                "sapphire": 4,
+                "emerald": 0,
+                "onyx": 0,
+                "diamond": 4
+            }
+        }
+    ]
+}
\ No newline at end of file
diff --git a/src/util/types.ts b/src/util/types.ts
index bac1ae9..3f1fc69 100644
--- a/src/util/types.ts
+++ b/src/util/types.ts
@@ -1,3 +1,21 @@
+export interface GameInformation {
+    players: PlayerData[],
+    nobles: NobleData[],
+    cardsInPlay: CardData[],
+    fullDeck: FullDeck
+}
+
+export interface PlayerData {
+    name: string,
+    starter: boolean,
+    points: number,
+    nobles: NobleData[],
+    cards: CardData[],
+    inventory: {
+        [Property in keyof ResourceCost]: number
+    }
+}
+
 export interface FullDeck {
     tierOne: CardData[],
     tierTwo: CardData[],
@@ -5,10 +23,10 @@ export interface FullDeck {
 }
 
 export interface CardData {
-    gemValue: GemValue
-    tier: number
+    gemValue: GemValue | string
+    tier?: number
     points?: number
-    cost: ResourceCost
+    resourceCost: ResourceCost
 }
 
 export interface ResourceCost {
@@ -17,11 +35,12 @@ export interface ResourceCost {
     emerald: number,
     diamond: number,
     onyx: number,
+    gold?: number
 }
 
 export interface NobleData {
-    points: 3,
-    cost: ResourceCost
+    points: number,
+    resourceCost: ResourceCost
 }
 
 export enum GemValue {