From 47fe7027e20834c030796366fae2ab8c8fb1891e Mon Sep 17 00:00:00 2001
From: PureZinc <139257470+PureZinc@users.noreply.github.com>
Date: Mon, 15 Jul 2024 19:19:10 -0400
Subject: [PATCH] Applied new XP System

---
 src/components/tree/XP.js  | 23 ++++++++++++++++++-----
 src/modules/skills.js      | 18 ++++++++++--------
 src/objects/definitions.js | 14 ++++++++++++++
 3 files changed, 42 insertions(+), 13 deletions(-)
 create mode 100644 src/objects/definitions.js

diff --git a/src/components/tree/XP.js b/src/components/tree/XP.js
index 4755735..47c9f1b 100644
--- a/src/components/tree/XP.js
+++ b/src/components/tree/XP.js
@@ -1,11 +1,24 @@
 import "./tree.css"
 
+
 export const XP = ({xp}) => {
-  //"#73FF79"
+  const xpTypes = [
+    {type: "Mental", amount: xp.mental, color: "#2F54EB"},
+    {type: "Physical", amount: xp.physical, color: "#6A1B9A"},
+    {type: "Financial", amount: xp.financial, color: "#FF9800"},
+    {type: "Social", amount: xp.social, color: "#CA99A9"},
+    {type: "Spiritual", amount: xp.spiritual, color: "#4CAF50"},
+    {type: "Overall", amount: xp.overall(), color: "#1A4117", class:"xp-text"},
+  ]
   return (
-    <div style={{display: "flex", flexDirection: "row"}}>
-      <span className={"xp-text"} style={{color: "#1A4117"}}>+{xp}</span>
-      <span className={"xp-text"} style={{marginLeft: 5}}>XP</span>
+    <div style={{display: "flex", flexDirection: "column"}}>
+      {xpTypes.map((xpt, index) => (
+        xpt.amount !== 0 &&
+        <div key={index} style={{display: "flex", flexDirection: "row"}}>
+          <span className={xpt.class} style={{color: xpt.color}}>{xpt.type}:</span>
+          <span className={xpt.class} style={{marginLeft: 5}}>+{xpt.amount} XP</span>
+        </div>
+      ))}
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/src/modules/skills.js b/src/modules/skills.js
index e70a092..ce79699 100644
--- a/src/modules/skills.js
+++ b/src/modules/skills.js
@@ -1,3 +1,5 @@
+import { XP } from "../objects/definitions";
+
 export const fetchSkillData = () => {
   return [
     {
@@ -8,7 +10,7 @@ export const fetchSkillData = () => {
       frequency: 1,
       interval: "day",
       timelimit: 3,
-      xp: 50,
+      xp: new XP(25, 0, 0, 0, 25),
       clickable: true,
     },
     {
@@ -19,7 +21,7 @@ export const fetchSkillData = () => {
       frequency: 1,
       interval: "day",
       timelimit: 7,
-      xp: 150,
+      xp: new XP(75, 0, 0, 0, 75),
       clickable: true,
     },
     {
@@ -30,7 +32,7 @@ export const fetchSkillData = () => {
       frequency: 4,
       interval: "week",
       timelimit: 14,
-      xp: 125,
+      xp: new XP(0, 125, 0, 0, 0),
       clickable: true,
     },
     {
@@ -38,15 +40,15 @@ export const fetchSkillData = () => {
       clickable: false,
     },
     {
-      title: "Discipline",
-      level: 1,
+      title: "Download Now!",
+      level: 0,
       goal: "Download Skilltree and level up IRL",
-      xp: 4200,
+      xp: new XP(840, 840, 840, 840, 840),
       timelimit: 365,
       interval: "day",
       frequency: 1,
-      image: require("../images/skills/discipline.png"),
-      clickable: true,
+      image: require("../images/logos/Gold-Logo.png"),
+      clickable: true
     },
     {
       title: "???",
diff --git a/src/objects/definitions.js b/src/objects/definitions.js
new file mode 100644
index 0000000..e4593e2
--- /dev/null
+++ b/src/objects/definitions.js
@@ -0,0 +1,14 @@
+export class XP {
+    constructor(mental=0, physical=0, financial=0, social=0, spiritual=0) {
+        this.mental = mental;
+        this.physical = physical;
+        this.financial = financial;
+        this.social = social;
+        this.spiritual = spiritual;
+    }
+
+    // Returns the total XP gained
+    overall() {
+        return this.mental + this.physical + this.financial + this.social + this.spiritual;
+    };
+}