Skip to content

Commit

Permalink
chore(format/lint): Run next eslint against the repo
Browse files Browse the repository at this point in the history
  • Loading branch information
@joshzcold
joshzcold committed Jan 11, 2025
1 parent fc6015d commit 317d7d4
Show file tree
Hide file tree
Showing 20 changed files with 662 additions and 781 deletions.
170 changes: 63 additions & 107 deletions src/components/Admin/CSVLoader.jsx
View file

Large diffs are not rendered by default.

82 changes: 38 additions & 44 deletions src/components/Admin/Players.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,15 @@ export default function Players(props) {
return (
<div>
{team.map((x, i) => (
<div key={`teamSection-player-${x.id}`} className="border-2 flex flex-row space-x-5 items-center m-2">
<div key={`teamSection-player-${x.id}`} className="m-2 flex flex-row items-center space-x-5 border-2">
{/* information about player */}
<div className="flex-grow">
<div className="grow">
<p className="uppercase text-foreground">{x.name}</p>
</div>
<div className="flex flex-row space-x-2">
{/* Toggle visibility button */}
<button
className={`border-4 ${x.hidden ? 'bg-secondary-300' : 'bg-success-300'} hover:opacity-80 p-2 rounded-lg`}
className={`border-4 ${x.hidden ? "bg-secondary-300" : "bg-success-300"} rounded-lg p-2 hover:opacity-80`}
id={`player${i}Team${teamNumber}HideGameButton`}
onClick={() => {
game.registeredPlayers[x.id].hidden = !game.registeredPlayers[x.id].hidden;
Expand All @@ -41,47 +41,41 @@ export default function Players(props) {
room: props.room,
})
);
}}
}}
>
{x.hidden ? <EyeOff /> : <Eye />}
</button>
{/* Remove player button */}
<button
id={`player${i}Team${teamNumber}QuitButton`}
className="border-4 bg-failure-300 hover:bg-failure-500 p-2 rounded-lg"
onClick={() => {
// props.send({action: "quit", id: })
props.ws.current.send(
JSON.stringify({
action: "quit",
host: false,
id: x.id,
room: props.room,
})
);
}}
>
{/* cancel.svg */}
<svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 717 718"
<button
id={`player${i}Team${teamNumber}QuitButton`}
className="rounded-lg border-4 bg-failure-300 p-2 hover:bg-failure-500"
onClick={() => {
// props.send({action: "quit", id: })
props.ws.current.send(
JSON.stringify({
action: "quit",
host: false,
id: x.id,
room: props.room,
})
);
}}
>
<path
d="M651.22 154c98 139 85 334-40 459s-318 137-458 40c-16-12-34-26-49-40c-15-15-28-32-39-49c-98-139-86-334 39-459s319-137 459-40c16 12 33 26 48 40c15 15 29 32 40 49zm-522 345l370-370c-104-63-242-50-331 39c-90 90-102 228-39 331zm458-280l-370 369c104 63 242 50 331-39c90-90 102-227 39-330z"
fill="#ffffff"
/>
<rect
x="0"
y="0"
width="717"
height="718"
fill="rgba(0, 0, 0, 0)"
/>
</svg>
</button>
{/* cancel.svg */}
<svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 717 718"
>
<path
d="M651.22 154c98 139 85 334-40 459s-318 137-458 40c-16-12-34-26-49-40c-15-15-28-32-39-49c-98-139-86-334 39-459s319-137 459-40c16 12 33 26 48 40c15 15 29 32 40 49zm-522 345l370-370c-104-63-242-50-331 39c-90 90-102 228-39 331zm458-280l-370 369c104 63 242 50 331-39c90-90 102-227 39-330z"
fill="#ffffff"
/>
<rect x="0" y="0" width="717" height="718" fill="rgba(0, 0, 0, 0)" />
</svg>
</button>
</div>
</div>
))}
Expand All @@ -90,18 +84,18 @@ export default function Players(props) {
}

return (
<div className="flex-grow ">
<div className="h-48 overflow-y-scroll border-4 rounded p-2 text-center flex flex-row flex-grow">
<div className="grow ">
<div className="flex h-48 grow flex-row overflow-y-scroll rounded border-4 p-2 text-center">
{/* team 1 section */}
<div className="flex-grow">
<div className="grow">
<p className="text-foreground">{game.teams[0].name}</p>
<hr />
{teamSection(team1, 1)}
</div>
{/* seperator */}
<div className="bg-secondary-300 border h-full" />
<div className="h-full border bg-secondary-300" />
{/* team 2 section */}
<div className="flex-grow">
<div className="grow">
<p className="text-foreground">{game.teams[1].name}</p>
<hr />
{teamSection(team2, 2)}
Expand Down
234 changes: 107 additions & 127 deletions src/components/Admin/Settings.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,143 +4,123 @@ import ThemeSwitcher from "@/components/Admin/ThemeSwitcher";
import InfoTooltip from "@/components/ui/tooltip";

function debounce(callback, wait = 400) {
let timeout;
return (...args) => {
clearTimeout(timeout);
timeout = setTimeout(function () {
callback.apply(this, args);
}, wait);
};
let timeout;
return (...args) => {
clearTimeout(timeout);
timeout = setTimeout(function () {
callback.apply(this, args);
}, wait);
};
}



function FinalRoundTitleChanger(props) {
const { i18n, t } = useTranslation();
return (
<div className="flex flex-row space-x-5 items-center">
<p className="text-xl text-foreground">{t("Final Round Title")}:</p>
<input
id="finalRoundTitleChangerInput"
className="border-4 rounded text-xl w-32 bg-secondary-500 text-foreground p-1 placeholder-secondary-900"
onChange={debounce((e) => {
props.game.settings.final_round_title = e.target.value;
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: props.game });
})}
defaultValue={props.game.settings.final_round_title}
placeholder={t("fast money")}
></input>
</div>
);
const { i18n, t } = useTranslation();
return (
<div className="flex flex-row items-center space-x-5">
<p className="text-xl text-foreground">{t("Final Round Title")}:</p>
<input
id="finalRoundTitleChangerInput"
className="w-32 rounded border-4 bg-secondary-500 p-1 text-xl text-foreground placeholder:text-secondary-900"
onChange={debounce((e) => {
props.game.settings.final_round_title = e.target.value;
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: props.game });
})}
defaultValue={props.game.settings.final_round_title}
placeholder={t("fast money")}
></input>
</div>
);
}

export default function AdminSettings(props) {
let game = props.game;
const { i18n, t } = useTranslation();

function HideGameQuestions(props) {
return (
<div className="flex flex-col">
<div className="flex flex-row space-x-5 items-center">
<div>
<p className="text-xl normal-case text-foreground">
{t("Hide questions")}:
</p>
</div>
<input
id="hideQuestionsInput"
className="w-4 h-4 rounded placeholder-secondary-900"
checked={game.settings.hide_questions}
onChange={(e) => {
game.settings.hide_questions = e.target.checked;
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: game });
}}
type="checkbox"
></input>
</div>
<div>
<p className="text-sm normal-case text-secondary-900 italic max-w-xs">
{t("hide questions on the game window and player buzzer screens")}
</p>
</div>
</div>
);
}
let game = props.game;
const { i18n, t } = useTranslation();

const BuzzerSoundSettings = (props) => {
return (
<div className="flex flex-col space-y-4">
<div className="flex flex-col">
<div className="flex flex-row space-x-5 items-center">
<div className="flex flex-row items-center space-x-2">
<InfoTooltip message={t("Allow players to hear sound on their devices when they press their buzzer")} />
<p className="text-xl normal-case text-foreground">
{t("Player Buzzer Sounds")}
</p>
</div>
<input
className="w-4 h-4 rounded placeholder-secondary-900"
checked={game.settings.enable_player_buzzer_sound}
onChange={(e) => {
game.settings.enable_player_buzzer_sound = e.target.checked;
if (!e.target.checked) {
game.settings.first_buzzer_sound_only = false;
}
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: game });
}}
type="checkbox"
></input>
</div>
</div>
function HideGameQuestions(props) {
return (
<div className="flex flex-col">
<div className="flex flex-row items-center space-x-5">
<div>
<p className="text-xl normal-case text-foreground">{t("Hide questions")}:</p>
</div>
<input
id="hideQuestionsInput"
className="size-4 rounded placeholder:text-secondary-900"
checked={game.settings.hide_questions}
onChange={(e) => {
game.settings.hide_questions = e.target.checked;
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: game });
}}
type="checkbox"
></input>
</div>
<div>
<p className="max-w-xs text-sm normal-case italic text-secondary-900">
{t("hide questions on the game window and player buzzer screens")}
</p>
</div>
</div>
);
}

<div className={`flex flex-col ${!game.settings.enable_player_buzzer_sound ? 'opacity-50' : ''}`}>
<div className="flex flex-row space-x-5 items-center">
<div className="flex flex-row items-center space-x-2">
<InfoTooltip message={t("Only play sound for the first player to buzz in")} />
<p className="text-xl normal-case text-foreground">
{t("First Press Only")}
</p>
</div>
<input
className="w-4 h-4 rounded placeholder-secondary-900"
checked={game.settings.first_buzzer_sound_only}
disabled={!game.settings.enable_player_buzzer_sound}
onChange={(e) => {
game.settings.first_buzzer_sound_only = e.target.checked;
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: game });
}}
type="checkbox"
></input>
</div>
</div>
const BuzzerSoundSettings = (props) => {
return (
<div className="flex flex-col space-y-4">
<div className="flex flex-col">
<div className="flex flex-row items-center space-x-5">
<div className="flex flex-row items-center space-x-2">
<InfoTooltip message={t("Allow players to hear sound on their devices when they press their buzzer")} />
<p className="text-xl normal-case text-foreground">{t("Player Buzzer Sounds")}</p>
</div>
);
}
<input
className="size-4 rounded placeholder:text-secondary-900"
checked={game.settings.enable_player_buzzer_sound}
onChange={(e) => {
game.settings.enable_player_buzzer_sound = e.target.checked;
if (!e.target.checked) {
game.settings.first_buzzer_sound_only = false;
}
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: game });
}}
type="checkbox"
></input>
</div>
</div>

return (
<>
<div className="grid grid-cols-2 gap-y-10 gap-x-48">
<HideGameQuestions
game={game}
setGame={props.setGame}
send={props.send}
/>
<ThemeSwitcher game={game} setGame={props.setGame} send={props.send} />
<FinalRoundTitleChanger
game={game}
setGame={props.setGame}
send={props.send}
/>
<BuzzerSoundSettings
game={game}
setGame={props.setGame}
send={props.send}
/>
<div className={`flex flex-col ${!game.settings.enable_player_buzzer_sound ? "opacity-50" : ""}`}>
<div className="flex flex-row items-center space-x-5">
<div className="flex flex-row items-center space-x-2">
<InfoTooltip message={t("Only play sound for the first player to buzz in")} />
<p className="text-xl normal-case text-foreground">{t("First Press Only")}</p>
</div>
</>
<input
className="size-4 rounded placeholder:text-secondary-900"
checked={game.settings.first_buzzer_sound_only}
disabled={!game.settings.enable_player_buzzer_sound}
onChange={(e) => {
game.settings.first_buzzer_sound_only = e.target.checked;
props.setGame((prv) => ({ ...prv }));
props.send({ action: "data", data: game });
}}
type="checkbox"
></input>
</div>
</div>
</div>
);
};

return (
<>
<div className="grid grid-cols-2 gap-x-48 gap-y-10">
<HideGameQuestions game={game} setGame={props.setGame} send={props.send} />
<ThemeSwitcher game={game} setGame={props.setGame} send={props.send} />
<FinalRoundTitleChanger game={game} setGame={props.setGame} send={props.send} />
<BuzzerSoundSettings game={game} setGame={props.setGame} send={props.send} />
</div>
</>
);
}
Loading

0 comments on commit 317d7d4

Please sign in to comment.