Jbranch4

trivia-forge/frontend/package.json

@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "axios": "^1.6.8",
     "bootstrap": "^5.3.3",
     "openai": "^4.38.3",
     "react": "^18.2.0",

trivia-forge/frontend/src/App.css

@@ -5,29 +5,52 @@
 
 /* Header Animation */
 .header-animation {
-	font-family: "Russo One", sans-serif;
-	width: 100%; height: 100%;
+  font-family: "Russo One", sans-serif;
+  width: 100%;
+  height: 100%;
 }
+
 .header-animation text {
-	animation: stroke 5s infinite alternate;
-	stroke-width: 2;
-	stroke: #365FA0;
-	font-size: 100px;
+  animation: stroke 5s infinite alternate;
+  stroke-width: 2;
+  stroke: #365FA0;
+  font-size: 100px;
 }
+
 @keyframes stroke {
-	0%   {
-		fill: rgba(72,138,204,0); stroke: rgba(54,95,160,1);
-		stroke-dashoffset: 25%; stroke-dasharray: 0 50%; stroke-width: 2;
-	}
-	70%  {fill: rgba(72,138,204,0); stroke: rgba(54,95,160,1); }
-	80%  {fill: rgba(72,138,204,0); stroke: rgba(54,95,160,1); stroke-width: 3; }
-	100% {
-		fill: rgba(72,138,204,1); stroke: rgba(54,95,160,0);
-		stroke-dashoffset: -25%; stroke-dasharray: 50% 0; stroke-width: 0;
-	}
-}
-
-.wrapper {background-color: #FFFFFF};
+  0% {
+    fill: rgba(72, 138, 204, 0);
+    stroke: rgba(54, 95, 160, 1);
+    stroke-dashoffset: 25%;
+    stroke-dasharray: 0 50%;
+    stroke-width: 2;
+  }
+
+  70% {
+    fill: rgba(72, 138, 204, 0);
+    stroke: rgba(54, 95, 160, 1);
+  }
+
+  80% {
+    fill: rgba(72, 138, 204, 0);
+    stroke: rgba(54, 95, 160, 1);
+    stroke-width: 3;
+  }
+
+  100% {
+    fill: rgba(72, 138, 204, 1);
+    stroke: rgba(54, 95, 160, 0);
+    stroke-dashoffset: -25%;
+    stroke-dasharray: 50% 0;
+    stroke-width: 0;
+  }
+}
+
+.wrapper {
+  background-color: #FFFFFF
+}
+
+;
 /* End Header Animation  */
 
 .App {
@@ -106,7 +129,8 @@ footer {
   border: 3px solid #ee7600;
   font-family: 'Fredoka One', cursive;
   font-size: 40px;
-  border-radius: 70px; /* Rounded corners */
+  border-radius: 70px;
+  /* Rounded corners */
   box-shadow: 0 8px #999;
   /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3), 0 6px 20px rgba(0, 0, 0, 0.1); */
   width: 40%;
@@ -120,4 +144,4 @@ footer {
   background: linear-gradient(to bottom, #ff6700, #ff8c00);
   border: 3px solid #ee7600;
   outline: none;
-}
+}

trivia-forge/frontend/src/Model/Category.jsx

@@ -0,0 +1,16 @@
+export class Category {
+    constructor(id, name, gameID) {
+        this.id = id;
+        this.name = name;
+        this.gameID = gameID
+        this.questions = [];
+    }
+
+    toJsonObject() {
+        return {
+            id: this.id,
+            name: this.name,
+            gameID: this.gameID
+        }
+    }
+}

trivia-forge/frontend/src/Model/Choice.jsx

@@ -0,0 +1,15 @@
+export class Choice {
+    constructor(id, choice, questionID) {
+        this.id = id;
+        this.choice = choice;
+        this.questionID = questionID;
+    }
+
+    toJsonObject() {
+        return {
+            id: this.id,
+            choice: this.choice,
+            questionID: this.questionID
+        }
+    }
+}   

trivia-forge/frontend/src/Model/Game.jsx

@@ -0,0 +1,22 @@
+export class Game {
+    constructor(id, userID, date, name, questions) {
+        this.id = id;
+        this.date = date;
+        this.name = name;
+        this.questions = [];
+        this.userID = userID;
+    }
+
+    addGame(question) {
+        this.questions.push(question);
+    }
+
+    toJsonObject() {
+        return {
+            id: this.id,
+            date: this.date,
+            name: this.name,
+            userID: this.userID
+        }
+    }
+}

trivia-forge/frontend/src/Model/Question.jsx

@@ -0,0 +1,22 @@
+export class Question {
+    constructor(id, question, answer, categoryID) {
+        this.id = id;
+        this.question = question;
+        this.answer = answer;
+        this.categoryID = categoryID;
+        this.choices = [];
+    }
+
+    addChoice(choice) {
+        this.choices.push(choice);
+    }
+
+    toJsonObject() {
+        return {
+            id: this.id,
+            question: this.question,
+            answer: this.answer,
+            categoryID: this.category
+        }
+    }
+}

trivia-forge/frontend/src/Model/User.jsx

@@ -0,0 +1,23 @@
+export class User {
+    constructor(id, date, email, password, profilePic) {
+        this.id = id;
+        this.date = date;
+        this.email = email;
+        this.password = password;
+        this.profilePic = profilePic;
+        this.games = [];
+    }
+
+    addGame(game) {
+        this.games.push(game);
+    }
+    toJsonObject() {
+        return {
+            id: this.id,
+            date: this.date,
+            email: this.email,
+            password: this.password,
+            profilePic: this.profilePic
+        }
+    }
+}