Skip to content

Commit

Permalink
Merge pull request #24 from emmanueposu/pbranch
Browse files Browse the repository at this point in the history 
Pbranch
  • Loading branch information
@demuthsa
demuthsa authored May 14, 2024
2 parents 7093217 + 88bff73 commit 887bd35
Show file tree
Hide file tree
Showing 23 changed files with 99 additions and 235 deletions.
6 changes: 0 additions & 6 deletions package-lock.json
View file

This file was deleted.

1 change: 0 additions & 1 deletion package.json
View file

This file was deleted.

88 changes: 0 additions & 88 deletions trivia-forge/dist/assets/index-BE7_8Dwe.js
View file

This file was deleted.

5 changes: 0 additions & 5 deletions trivia-forge/dist/assets/index-DkrhZ241.css
View file

This file was deleted.

1 change: 0 additions & 1 deletion trivia-forge/dist/assets/react-CHdo91hT.svg
View file

This file was deleted.

17 changes: 0 additions & 17 deletions trivia-forge/dist/index.html
View file

This file was deleted.

1 change: 0 additions & 1 deletion trivia-forge/dist/vite.svg
View file

This file was deleted.

4 changes: 2 additions & 2 deletions trivia-forge/frontend/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@

<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<link rel="icon" type="image/svg+xml" href="/fire.svg" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React</title>
</head>

<body>
Expand Down
3 changes: 3 additions & 0 deletions trivia-forge/frontend/public/fire.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 0 additions & 1 deletion trivia-forge/frontend/public/vite.svg
View file

This file was deleted.

2 changes: 0 additions & 2 deletions trivia-forge/frontend/src/App.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -242,6 +242,4 @@ footer {

.card:hover {
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
/* border: solid;
border-color: darkgrey; */
}
4 changes: 1 addition & 3 deletions trivia-forge/frontend/src/App.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,4 @@
import { useState } from 'react';
import reactLogo from './assets/react.svg';
import viteLogo from '/vite.svg';
import './App.css';
import { BrowserRouter, Routes, Route } from "react-router-dom";
import Home from "./Pages/HomePage";
Expand Down Expand Up @@ -30,7 +28,7 @@ function App() {
<Route path="/triviaGen" element={<TriviaGenPage />} />
<Route path="/review" element={<TriviaReviewPage />} />
<Route path="/myTrivia" element={<MyTrivia />} />
<Route path="/SignUpPage" element={<SignUpPage />} />
<Route path="/signUp" element={<SignUpPage />} />
</Routes>

</main>
Expand Down
42 changes: 0 additions & 42 deletions trivia-forge/frontend/src/Components/BootstrapTable.jsx
View file

This file was deleted.

6 changes: 3 additions & 3 deletions trivia-forge/frontend/src/Components/GameQuestions.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,12 @@ function GameQuestions(game) {

useEffect(() => {
if (categories) {
const data = new Set();
const category_ids = new Set();
for (let i = 0; i < categories.length; i++) {
data.add(categories[i].id)
category_ids.add(categories[i].id)
};

getQuestions(data).then( res => {
getQuestions(category_ids).then( res => {
setQuestions(res);
});
}
Expand Down
12 changes: 6 additions & 6 deletions trivia-forge/frontend/src/Components/Nav.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@ import React from "react";
import { Navbar } from "react-bootstrap";
import { Nav, Button, Modal, Form } from "react-bootstrap";
import { useState } from 'react';
import { Link } from "react-router-dom"
const loginIcon = "https://yxdrsdfocuonvorowgaa.supabase.co/storage/v1/object/sign/UI%20Assets/Login%20Icon.svg?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1cmwiOiJVSSBBc3NldHMvTG9naW4gSWNvbi5zdmciLCJpYXQiOjE3MTQwNDQ1NjQsImV4cCI6NDg2NzY0NDU2NH0.-IE25tSqh2pH4EwagAEHzml4lv0mJwZgptA73XO2zpY&t=2024-04-25T11%3A29%3A24.290Z"
import { Link } from "react-router-dom";

function Navigation() {
const [show, setShow] = useState(false);
Expand All @@ -19,9 +18,10 @@ function Navigation() {
<Nav.Link href="/triviaGen">Create New Trivia</Nav.Link>
<Nav.Link href="/myTrivia">My Trivia</Nav.Link>
</Nav>
<Nav>
<img src={loginIcon} id="test"></img>
<Button onClick={handleShow}>Log In</Button>
<Nav style={{marginRight: ".5rem"}}>
<Button onClick={handleShow}>
<i className="bi bi-person-circle" style={{marginRight: ".5rem"}}></i>Log In
</Button>
</Nav>

</Navbar>
Expand All @@ -44,7 +44,7 @@ function Navigation() {
id="inputPassword"
/>
</Form>
<p>Not a member? <Link onClick={handleClose} to="/SignUpPage">Sign Up</Link></p>
<p>Not a member? <Link onClick={handleClose} to="/signUp">Sign Up</Link></p>
</Modal.Body>

<Modal.Footer>
Expand Down
86 changes: 61 additions & 25 deletions trivia-forge/frontend/src/Components/Slideshow.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,17 @@
import { React, useState, useEffect } from "react";
import Carousel from 'react-bootstrap/Carousel';
import { getCategories, getQuestions ,getChoices } from "../Services/TF-db_services";
const slideshowBackground = "https://yxdrsdfocuonvorowgaa.supabase.co/storage/v1/object/sign/UI%20Assets/white-solid-color-background?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1cmwiOiJVSSBBc3NldHMvd2hpdGUtc29saWQtY29sb3ItYmFja2dyb3VuZCIsImlhdCI6MTcxNTE3MDQ0NywiZXhwIjo0ODY4NzcwNDQ3fQ.dPaQP-yvK0-k6wBJWrI6FqrXGEqv6Vv-a8Th99zGSyA&t=2024-05-08T12%3A14%3A08.001Z"
import Spinner from 'react-bootstrap/Spinner';
import Button from "react-bootstrap/esm/Button";


function Slideshow(game) {
const [loading, setLoading] = useState("border");
const [spinnerVisibility, setSpinnerVisibility] = useState("initial");
const [hintColor, setHintColor] = useState("#240046");
const [categories, setCategories] = useState(null);
const [questions, setQuestions] = useState(null);
const [choices, setChoices] = useState(null);
const [questionsAndChoices, setQuestionsAndChoices] = useState(null);

useEffect(() => {
getCategories(game.data).then( res => {
Expand All @@ -17,44 +21,76 @@ function Slideshow(game) {

useEffect(() => {
if (categories) {
const data = new Set();
let category_ids = new Set();
for (let i = 0; i < categories.length; i++) {
data.add(categories[i].id)
category_ids.add(categories[i].id);
};
getQuestions(data).then( res => {
getQuestions(category_ids).then( res => {
setQuestions(res);
});
}
}, [categories]);

// useEffect(() => {
// if (questions) {
// const data = new Set();
// for (let i = 0; i < categories.length; i++) {
// data.add(categories[i].id)
// };
// getQuestions(data).then( res => {
// setQuestions(res);
// });
// }
// }, [questions]);
useEffect(() => {
if (questions) {
const questionObj = {};
for (let i = 0; i < questions.length; i++) {
questionObj[questions[i].id] = questions[i];
questionObj[questions[i].id]["choices"] = [];
};
getChoices(questionObj).then( res => {
let temp = []
for (let key in res) {
temp.push(res[key])
temp.push(res[key].answer)
}
setQuestionsAndChoices(temp);
setLoading(false);
setSpinnerVisibility("none");
});
}
}, [questions]);

function handleShowHint() {
if (hintColor == "#240046") {
setHintColor("white")
} else {
setHintColor("#240046")
}
}



return (
<>
{questions &&(
<Carousel data-bs-theme="dark" className="h-100">
{questions.map((q, index) => (
<Carousel.Item key={index}>
<img src={slideshowBackground} className="d-block"/>
<div className="h-100 d-flex align-items-center justify-content-center" style={{backgroundColor: "#240046" }}>
<Spinner animation={loading} role="status" variant="light" className="" style={{ height: "9rem", width: "9rem", display: spinnerVisibility }} />
{questionsAndChoices &&(
<Carousel className="flex-grow-1 h-100" interval={null}>
{questionsAndChoices.map((item, i) => (
<Carousel.Item key={i} className="" >
<div className="" style={{ height: "65vh" }}>
</div>
<Carousel.Caption>
<h3>{q.problem}</h3>
{typeof item === 'string' ? (
<h1 className="p-4 mb-5">{item}</h1>
) : (
<div className="d-flex flex-column align-items-center">
<h1 className="p-4">{item.problem}</h1>
<div className="w-75">
{item.choices.map((c, j) => (
<h4 key={j} className="rounded-5 p-2 w-25 m-auto mt-4" style={{border: "2px solid orange", backgroundColor: "", color: ""}}>{c}</h4>
))}
</div>
<Button onClick={() => handleShowHint()} className="mt-5" style={{backgroundColor: "turquoise", border:"none", color:"#240046" }}>Hint</Button>
<h4 style={{color: hintColor}} className="mt-3">{item.hint}</h4>
</div>
)}
</Carousel.Caption>
</Carousel.Item>
</Carousel.Item>
))}
</Carousel>
)}
</>
</div>
)

}
Expand Down
9 changes: 5 additions & 4 deletions trivia-forge/frontend/src/Pages/HomePage.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,18 +9,19 @@ function Home() {

return (
<Container className="homepage-container">
<title>Home</title>
<Row>
<Col>
<svg class="header-animation">
<text x="50%" y="50%" dy=".35em" text-anchor="middle">
<svg className="header-animation">
<text x="50%" y="50%" dy=".35em" textAnchor="middle">
Trivia Forge
</text>
</svg>
</Col >
</Row>
<Row>
<Col>
<Button variant="primary"> <FaRegFolderOpen /> My Trivia Games </Button>
<Button variant="primary" onClick={() => navigate('/myTrivia')}> <FaRegFolderOpen /> My Trivia Games </Button>
</Col>
</Row>
<Row>
Expand All @@ -35,7 +36,7 @@ function Home() {
</Row>
<Row>
<Col>
<Button variant="primary"> <FaUserPlus /> Sign Up </Button>
<Button variant="primary" onClick={() => navigate('/signUp')}> <FaUserPlus /> Sign Up </Button>
</Col>
</Row>
</Container>
Expand Down
Loading

0 comments on commit 887bd35

Please sign in to comment.