Skip to content

Commit

Permalink
formatted using pnpm format
Browse files Browse the repository at this point in the history
  • Loading branch information
@DoodleyJC
DoodleyJC committed Jul 25, 2024
1 parent 4542450 commit 57627f0
Show file tree
Hide file tree
Showing 5 changed files with 93 additions and 102 deletions.
86 changes: 45 additions & 41 deletions frontend/src/app/betting/matchCard.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,44 +1,48 @@
"use client";
import { Team } from "./teams"
import { Match } from "./matches"
import { Team } from "./teams";
import { Match } from "./matches";
import { useState } from "react";
export default function MatchCard(data:any){
var match:Match = data.match;
const startingWidth = 35;
const [styleVar, setStyleVar] = useState({"width" : startingWidth + "%"});
const [otherStyleVar, setOtherStyleVar] = useState({"width" : (100-startingWidth) + "%"});
function addPercent(){
var widthAux = Number(styleVar.width.match("[0-9]+")![0]) + 5;
setStyleVar({"width" : (widthAux)+"%"})
setOtherStyleVar({"width" : (100-widthAux)+"%"})
}
function removePercent(){
var widthAux = Number(styleVar.width.match("[0-9]+")![0]) - 5;
setStyleVar({"width" : (widthAux)+"%"})
setOtherStyleVar({"width" : (100-widthAux)+"%"})
}
return (
<div className="rounded-md border-2 border-amber-600 my-2">
<div className="rounded w-full flex text-center">
<div className="w-2/5 bg-red-400">
<span>{match.teams[0].name}</span>
</div>
<div className="w-1/5">
<span>VERSUS</span>
</div>
<div className="w-2/5 bg-blue-400">
<span>{match.teams[1].name}</span>
</div>
</div>
<div className="w-full">
<div className="h-4 my-2 mx-0 px-0 bg-green-500 float-left" style={styleVar}></div>
<div className="h-4 my-2 mx-0 px-0 bg-red-500 float-right" style={otherStyleVar}></div>
</div>

<div className="w-full flex">
<button onClick={addPercent} className="mx-2 border-4 rounded-md border-gray-400 bg-gray-200">add 5%</button>
<button onClick={removePercent} className="mx-2 border-4 rounded-md border-gray-400 bg-gray-200">remove 5%</button>
</div>
export default function MatchCard(data: any) {
var match: Match = data.match;
const startingWidth = 35;
const [styleVar, setStyleVar] = useState({ width: startingWidth + "%" });
const [otherStyleVar, setOtherStyleVar] = useState({ width: 100 - startingWidth + "%" });
function addPercent() {
var widthAux = Number(styleVar.width.match("[0-9]+")![0]) + 5;
setStyleVar({ width: widthAux + "%" });
setOtherStyleVar({ width: 100 - widthAux + "%" });
}
function removePercent() {
var widthAux = Number(styleVar.width.match("[0-9]+")![0]) - 5;
setStyleVar({ width: widthAux + "%" });
setOtherStyleVar({ width: 100 - widthAux + "%" });
}
return (
<div className="my-2 rounded-md border-2 border-amber-600">
<div className="flex w-full rounded text-center">
<div className="w-2/5 bg-red-400">
<span>{match.teams[0].name}</span>
</div>
)
}
<div className="w-1/5">
<span>VERSUS</span>
</div>
<div className="w-2/5 bg-blue-400">
<span>{match.teams[1].name}</span>
</div>
</div>
<div className="w-full">
<div className="float-left mx-0 my-2 h-4 bg-green-500 px-0" style={styleVar}></div>
<div className="float-right mx-0 my-2 h-4 bg-red-500 px-0" style={otherStyleVar}></div>
</div>

<div className="flex w-full">
<button onClick={addPercent} className="mx-2 rounded-md border-4 border-gray-400 bg-gray-200">
add 5%
</button>
<button onClick={removePercent} className="mx-2 rounded-md border-4 border-gray-400 bg-gray-200">
remove 5%
</button>
</div>
</div>
);
}
24 changes: 10 additions & 14 deletions frontend/src/app/betting/matches.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,13 @@
import { Team, teams } from "./teams"
interface Match{
id: number,
teams: [Team, Team]
import { Team, teams } from "./teams";
interface Match {
id: number;
teams: [Team, Team];
}
const matches: Match[] = [
{ "id" : 0, teams: [teams[0],teams[1]]},
{ "id" : 1, teams: [teams[0],teams[2]]},
{ "id" : 2, teams: [teams[1],teams[2]]}
]
{ id: 0, teams: [teams[0], teams[1]] },
{ id: 1, teams: [teams[0], teams[2]] },
{ id: 2, teams: [teams[1], teams[2]] },
];





export {matches};
export type {Match};
export { matches };
export type { Match };
45 changes: 19 additions & 26 deletions frontend/src/app/betting/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,31 +1,24 @@
import { Team, teams} from "./teams";
import { Team, teams } from "./teams";
import { matches, Match } from "./matches";
import MatchCard from "./matchCard";
export default function BettingPage(){

const matchesList = matches.map((element) => {
const undefinedTeam: Team = { "id": -1, "name" : "undefined team" }
var teamObject1 = teams.find((team) => team.id==element.teams[0].id);
var teamObject2 = teams.find((team) => team.id==element.teams[1].id);
if(teamObject1 === undefined){
teamObject1 = undefinedTeam;
}
if(teamObject2 === undefined){
teamObject2 = undefinedTeam;
}

return (

<div key={element.id}>
<MatchCard match={element}/>
</div>

)
})
export default function BettingPage() {
const matchesList = matches.map((element) => {
const undefinedTeam: Team = { id: -1, name: "undefined team" };
var teamObject1 = teams.find((team) => team.id == element.teams[0].id);
var teamObject2 = teams.find((team) => team.id == element.teams[1].id);
if (teamObject1 === undefined) {
teamObject1 = undefinedTeam;
}
if (teamObject2 === undefined) {
teamObject2 = undefinedTeam;
}

return (
<div className="text-2xl">
{matchesList}
</div>
<div key={element.id}>
<MatchCard match={element} />
</div>
);
}
});

return <div className="text-2xl">{matchesList}</div>;
}
22 changes: 10 additions & 12 deletions frontend/src/app/betting/teams.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,12 @@
interface Team{
id: number,
name: string
interface Team {
id: number;
name: string;
}
const teams:Team[] = [
const teams: Team[] = [
{ id: 0, name: "testteam0" },
{ id: 1, name: "testteam1" },
{ id: 2, name: "testteam2" },
];

{ "id": 0, "name" : "testteam0" },
{ "id": 1, "name" : "testteam1" },
{ "id": 2, "name" : "testteam2" }

]

export {teams};
export type {Team}
export { teams };
export type { Team };
18 changes: 9 additions & 9 deletions frontend/src/components/navigationbar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,44 +4,44 @@ export default function Navbar() {
return (
<div className="w-full bg-gray-900">
<nav>
<ul className="text-2xl flex h-16 items-center justify-between text-blue-500">
<ul className="flex h-16 items-center justify-between text-2xl text-blue-500">
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/">
Home
</Link>
</li>
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/">
Teams
</Link>
</li>
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/">
Standings
</Link>
</li>
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/">
Schedules
</Link>
</li>
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/">
Games
</Link>
</li>
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/betting">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/betting">
Betting
</Link>
</li>
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/">
Volunteers
</Link>
</li>
<li>
<Link className="hover:bg-gray-700 px-2 py-1 rounded bg-gray-600" href="/">
<Link className="rounded bg-gray-600 px-2 py-1 hover:bg-gray-700" href="/">
History
</Link>
</li>
Expand Down

0 comments on commit 57627f0

Please sign in to comment.