Ucalgary_Baja/BajaUofCWebsite
4
0
Fork 0
mirror of https://github.com/UofCBaja/BajaUofCWebsite.git synced 2025-06-16 05:44:17 -06:00
Code Issues Packages Projects Releases Wiki Activity

added subteams: started content for teams page

Browse Source
This commit is contained in:
darkicewolf50 2024-03-20 22:41:23 -06:00
parent 46676cc432
commit b69f2f2b38
3 changed files with 166 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/MockDB/Leadership.yml Normal file
View File

@ -0,0 +1,28 @@
Chassis:
url: https://res.cloudinary.com/dpgrgsh7g/image/upload/v1710016930/IMG-20240207-WA0000_e1jcf4.jpg
shortDescription: Chassis Description (1 line)
longDescription: Chassis Description
Drivetrain:
url: https://res.cloudinary.com/dpgrgsh7g/image/upload/v1710016930/IMG-20240207-WA0000_e1jcf4.jpg
shortDescription: Drivetrain Description (1 line)
longDescription: Drivetrain Description
Steering:
url: https://res.cloudinary.com/dpgrgsh7g/image/upload/v1710016930/IMG-20240207-WA0000_e1jcf4.jpg
shortDescription: Steering Description (1 line)
longDescription: Steering Description
Suspension:
url: https://res.cloudinary.com/dpgrgsh7g/image/upload/v1710016930/IMG-20240207-WA0000_e1jcf4.jpg
shortDescription: Suspension Description (1 line)
longDescription: Suspension Description
Electrical:
url: https://res.cloudinary.com/dpgrgsh7g/image/upload/v1710016930/IMG-20240207-WA0000_e1jcf4.jpg
shortDescription: Electrical Description (1 line)
longDescription: Electrical Description
Logistics:
url: https://res.cloudinary.com/dpgrgsh7g/image/upload/v1710016930/IMG-20240207-WA0000_e1jcf4.jpg
shortDescription: Logistics Description (1 line)
longDescription: Logistics Description
Software:
url: https://res.cloudinary.com/dpgrgsh7g/image/upload/v1710016930/IMG-20240207-WA0000_e1jcf4.jpg
shortDescription: Software Description (1 line)
longDescription: Software Description

9
src/Teams/Leadership.json
View File

@ -1,9 +0,0 @@
{
"Team Captain": "Aidan Schroeder",
"Nole Tabelon": "Chassis Lead",
"Hewitt Yee": "Drivetrain Lead",
"Alex Buzdugan": "Electrical Lead",
"Brock Tomlinson": "Business and Softawre Lead",
"Ghaith Abu-Rub": "Suspension Lead",
"Anjali Patadia": "Steering Lead"
}

158
src/Teams/SubTeams.js
View File

@ -1,41 +1,143 @@
import "./SubTeams.css";
import { useState, useEffect } from "react";
import yaml from "js-yaml";
import leadershipData from "../MockDB/Leadership.yml";
const SubTeams = () => {
// const jsonImport = (filePath) => {
// data = import(filePath);
// return data;
// };
// leadership_json = jsonImport("./Leadership.json");
// console.log(leadership_json);
const [subteamsDict, setSubteamsDict] = useState();
const [subteamsArray, setSubteamsArray] = useState();
useEffect(() => {
getLeadership();
}, []);
/**
* @param {null} null - requires nothing (link)
* @returns {Object} sponsorsDict - gets a Dictionary of our sponsors from synology drive
* @description Gets the list of sponsors from the synology drive (not implemented), converts the json file into a dictionary
* @author Brock <darkicewolf50@gmail.com>
* @todo add gPRC to backend and front end add connect to synology drive
*/
const getLeadership = async () => {
try {
const res = await fetch(leadershipData);
const rawText = await res.text();
const yamlDict = await yaml.load(rawText);
setSubteamsDict(yamlDict);
setSubteamsArray(Object.values(yamlDict));
} catch (error) {
//error checking
console.error("Error recieving data from server:");
}
};
console.log(subteamsDict);
return (
<div>
<iframe
src="https://docs.google.com/forms/d/e/1FAIpQLSfFquL6lMCBCMJelV-931J3bH6vC9zCCmVzBj_K68xVaT0pgg/viewform?embedded=true"
width="640"
height="1570"
frameborder="0"
marginheight="0"
marginwidth="0">
Loading…
</iframe>
<div>
<h2>Leadership</h2>
<p>gallery</p>
</div>
<div id="Subteams">
<h2>Get to Know Our Subteams</h2>
{subteamsDict === undefined && subteamsArray === undefined ? (
<p>Loading...</p>
) : (
<>
<table>
<tbody>
{/* this really sucks it needs to be changed */}
<tr>
<td>Aidan Schroeder</td>
<td>Team Captain</td>
{/* row 1 */}
<td>
<img
src={subteamsArray[0].url}
alt={subteamsArray[0] + "'s Icon"}
/>
</td>
{/* row 2 */}
<td>
<img
src={subteamsArray[1].url}
alt={subteamsArray[1] + "'s Icon"}
/>
</td>
{/* row 3 */}
<td>
<img
src={subteamsArray[2].url}
alt={subteamsArray[2] + "'s Icon"}
/>
</td>
{/* row 4 */}
<td>
<img
src={subteamsArray[3].url}
alt={subteamsArray[3] + "'s Icon"}
/>
</td>
{/* row 5 */}
<td>
<img
src={subteamsArray[4].url}
alt={subteamsArray[4] + "'s Icon"}
/>
</td>
{/* row 6 */}
<td>
<img
src={subteamsArray[5].url}
alt={subteamsArray[5] + "'s Icon"}
/>
</td>
{/* row 7 */}
<td>
<img
src={subteamsArray[6].url}
alt={subteamsArray[6] + "'s Icon"}
/>
</td>
</tr>
<tr>
<td>Hewitt Yee</td>
<td>Drivetrain Lead</td>
</tr>
<tr>
<td>Nole Tabelon</td>
<td>Chassis Lead</td>
{/* row 1 */}
<td>
<p>{subteamsArray[0].shortDescription}</p>
</td>
{/* row 2 */}
<td>
<p>{subteamsArray[1].shortDescription}</p>
</td>
{/* row 3 */}
<td>
<p>{subteamsArray[2].shortDescription}</p>
</td>
{/* row 4 */}
<td>
<p>{subteamsArray[3].shortDescription}</p>
</td>
{/* row 5 */}
<td>
<p>{subteamsArray[4].shortDescription}</p>
</td>
{/* row 6 */}
<td>
<p>{subteamsArray[5].shortDescription}</p>
</td>
{/* row 7 */}
<td>
<p>{subteamsArray[6].shortDescription}</p>
</td>
</tr>
</tbody>
</table>
<div>
{Object.keys(subteamsDict).map((subteamName, index) => {
const subteam = subteamsDict[subteamName];
const className = index % 2 === 0 ? "SubteamsEnd" : "";
return (
<div>
<h2 className={className}>{subteamName}</h2>
<p>{subteam.longDescription}</p>
</div>
);
})}
</div>
</>
)}
</div>
);
};