Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Test #1

Merged
merged 6 commits into from
May 29, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
{
"rust-analyzer.linkedProjects": ["./data-simulator/Cargo.toml", "./data-importer/Cargo.toml", "./data/Cargo.toml"]
"rust-analyzer.linkedProjects": [
"./data-simulator/Cargo.toml",
"./data-importer/Cargo.toml",
"./data-provider/Cargo.toml",
"./data-saver/Cargo.toml"
]
}
2 changes: 1 addition & 1 deletion dash/src/app/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ export default function RootLayout({ children }: { children: ReactNode }) {
return (
<html
lang="en"
className={`${inter.variable} bg-zinc-900 p-4 font-sans text-white`}
className={`${inter.variable} bg-zinc-950 p-3 font-sans text-white`}
>
<head />
<body>{children}</body>
Expand Down
41 changes: 5 additions & 36 deletions dash/src/app/page.tsx
Original file line number Diff line number Diff line change
@@ -1,54 +1,23 @@
"use client";

import { useEffect, useState } from "react";
import { sseSession } from "../lib/sse";
import RaceInfo from "../components/RaceInfo";
import WeatherInfo from "../components/WeatherInfo";
import LeaderBoard from "../components/LeaderBoard";
import RaceControlMessages from "../components/RaceControlMessages";
import { RaceControlMessage } from "../types/race-control-message.type";

const messages: RaceControlMessage[] = [
{
message: "Green Flag",
time: "2023-05-07T19:31:25.372Z",
id: "a1131838-0390-40c4-b84a-0bce38bbe522",
type: "FLAG",
},
{
message: "Green Flag",
time: "2023-05-07T19:31:25.372Z",
id: "a1131838-0390-40c4-b84a-0bce38bbe522",
type: "FLAG",
},
{
message: "Green Flag",
time: "2023-05-07T19:31:25.372Z",
id: "a1131838-0390-40c4-b84a-0bce38bbe522",
type: "FLAG",
},
{
message: "Green Flag",
time: "2023-05-07T19:31:25.372Z",
id: "a1131838-0390-40c4-b84a-0bce38bbe522",
type: "FLAG",
},
];

export default function Page() {
return (
<div>
<RaceInfo />
<WeatherInfo />
<LeaderBoard />

<div className="grid grid-cols-12 gap-4">
<section className="col-span-9">
<LeaderBoard />
</section>
{/* <div className="grid grid-cols-12 gap-4">
<section className="col-span-9"></section>
<section className="col-span-3">
<RaceControlMessages messages={messages} />
<RaceControlMessages />
</section>
</div>
</div> */}
</div>
);
}
23 changes: 13 additions & 10 deletions dash/src/components/Driver.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,35 +7,38 @@ import DriverDRS from "./DriverDRS";
import DriverGap from "./DriverGap";
import DriverTire from "./DriverTire";
import DriverMiniSectors from "./DriverMiniSectors";
import DriverRPM from "./DriverRPM";

type Props = {
driver: DriverType;
position: number;
};

export default function Driver({ driver, position }: Props) {
const centerClass = "flex flex-row items-center justify-center";

return (
<motion.div className="h-18 grid grid-cols-12 items-center py-2" layout>
<div>
<motion.div className="h-18 grid grid-cols-12 items-center py-1" layout>
<div className={centerClass}>
<DriverTag driver={driver} position={position} />
</div>
<div>

<div className={centerClass}>
<DriverDRS on={driver.drs.on} possible={driver.drs.possible} />
</div>
<div>

<div className="col-span-3 flex items-center gap-2">
<DriverRPM rpm={10000} gear={0} />
<DriverTire tire={driver.tire} age={10} />
<DriverGap toFront={driver.gap} toLeader={driver.gap} />
</div>
{/* <DriverSpeed speed={driver.speed} /> */}
<div>
<DriverTire tire={driver.tire} />
</div>
<div className="col-span-5">

<div className="col-span-6">
<DriverMiniSectors
miniSectors={driver.miniSectors}
driverDisplayName={driver.displayName}
/>
</div>
{/* lap */}
</motion.div>
);
}
2 changes: 1 addition & 1 deletion dash/src/components/DriverDRS.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export default function DriverDRS({ on, possible }: Props) {
return (
<span
className={clsx(
"text-md inline-flex items-center rounded-md border-2 px-2.5 py-0.5 font-semibold",
"text-md inline-flex h-8 items-center rounded-md border-2 px-2.5 py-0.5 font-semibold",
{
"border-gray-500 text-gray-500": !on && !possible,
"border-gray-300 text-gray-300": !on && possible,
Expand Down
8 changes: 5 additions & 3 deletions dash/src/components/DriverGap.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,11 @@ type Props = {

export default function DriverGap({ toFront, toLeader }: Props) {
return (
<div className="text-lg font-semibold">
<p>{toFront}</p>
<p className="text-sm font-normal text-gray-500">LEAD: {toLeader}</p>
<div className="ml-2 text-lg font-semibold">
<p className=" leading-none">{toFront}</p>
<p className="text-sm font-medium leading-none text-gray-500">
{toLeader}
</p>
</div>
);
}
13 changes: 8 additions & 5 deletions dash/src/components/DriverMiniSectors.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,11 @@ export default function DriverMiniSectors({
return (
<div className="grid grid-cols-3 gap-x-2 gap-y-1">
{miniSectors.map((sector, index) => (
<div key={`sector.${driverDisplayName}.${index}`}>
<div className="flex h-4 flex-row gap-1">
<div
key={`sector.${driverDisplayName}.${index}`}
className="flex flex-col gap-1"
>
<div className="flex h-3 flex-row gap-1">
{sector.map((miniSector, index2) => (
<MiniSector
status={miniSector}
Expand All @@ -25,8 +28,8 @@ export default function DriverMiniSectors({
</div>

<div className="flex items-center gap-2">
<p className="text-2xl font-semibold">30.200</p>
<p>30.500</p>
<p className="text-xl font-semibold leading-none">30.200</p>
<p className="leading-none">30.500</p>
</div>
</div>
))}
Expand All @@ -37,7 +40,7 @@ export default function DriverMiniSectors({
function MiniSector({ status }: { status: MiniSectorStatusType }) {
return (
<div
className={clsx("h-4 w-4 rounded-md", {
className={clsx("h-3 w-3 rounded-[0.2rem]", {
"bg-yellow-500": status === "BAD",
"bg-emerald-500": status === "PB",
"bg-indigo-500": status === "WR",
Expand Down
33 changes: 33 additions & 0 deletions dash/src/components/DriverRPM.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import { motion } from "framer-motion";
import React from "react";

type Props = {
rpm: number;
gear: number;
};

export default function DriverRPM({ rpm, gear }: Props) {
return (
<div className="flex h-10 w-10 items-center justify-center text-blue-500">
<motion.svg
className="h-10 w-10"
viewBox="0 0 172 150"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<motion.path
d="M32.5 139.979C18.6057 126.207 10 107.109 10 86C10 44.0264 44.0264 10 86 10C127.974 10 162 44.0264 162 86C162 106.865 153.592 125.766 139.979 139.5"
stroke="currentColor"
strokeWidth="20"
strokeLinecap="round"
initial={{ pathLength: 0 }}
animate={{ pathLength: rpm / 15000 }}
/>
</motion.svg>

<p className="absolute z-10 pt-1 font-bold leading-none text-white">
{gear}
</p>
</div>
);
}
14 changes: 0 additions & 14 deletions dash/src/components/DriverSpeed.tsx

This file was deleted.

17 changes: 7 additions & 10 deletions dash/src/components/DriverTag.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,19 +13,16 @@ export default function DriverTag({ position, driver }: Props) {

return (
<div
className="flex h-10 w-min flex-row content-center gap-2 rounded-lg p-1"
className="flex w-20 justify-between gap-0.5 rounded-md p-1"
style={{ backgroundColor: foundDriver?.color }}
>
<div className="flex flex-row content-center px-2">
<p className="m-0 p-0 text-xl">{position}</p>
</div>
<p className="px-1 text-xl font-semibold">{position}</p>

<p
className="flex flex-row content-center rounded-lg bg-white px-2 py-1 font-extrabold"
style={{ color: foundDriver?.color }}
>
{driver?.displayName}
</p>
<div className="flex h-min w-min items-center justify-center rounded-md bg-white p-0.5">
<p className=" font-extrabold" style={{ color: foundDriver?.color }}>
{driver?.displayName}
</p>
</div>
</div>
);
}
8 changes: 5 additions & 3 deletions dash/src/components/DriverTire.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,16 @@ import Image from "next/image";

type Props = {
tire: TireType;
age: number;
};

export default function DriverTire({ tire }: Props) {
export default function DriverTire({ tire, age }: Props) {
const icon = `/tires/${tire.toLowerCase()}.svg`;

return (
<div>
<Image src={icon} width={40} height={40} alt={tire} />
<div className="flex flex-row items-center gap-1">
<Image src={icon} width={35} height={35} alt={tire} />
<p className="font-bold">{age}</p>
</div>
);
}
Loading