diff --git a/public/cross.svg b/public/cross.svg
deleted file mode 100644
index e21b852..0000000
--- a/public/cross.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
diff --git a/src/views/Game/components/DNFDialog.tsx b/src/views/Game/components/DNFDialog.tsx
index 765c104..9a59781 100644
--- a/src/views/Game/components/DNFDialog.tsx
+++ b/src/views/Game/components/DNFDialog.tsx
@@ -11,6 +11,7 @@ import {
DialogTitle,
Stack,
Typography,
+ useTheme,
} from "@mui/material";
import { FunctionComponent } from "react";
import useGame from "../../../stores/game";
@@ -82,18 +83,8 @@ const DNFDialog: FunctionComponent = (props) => {
>
{player.username}
-
-
+
+
);
})}
@@ -119,4 +110,29 @@ const DNFDialog: FunctionComponent = (props) => {
);
};
+const PlayerCross: FunctionComponent = () => {
+ const theme = useTheme();
+
+ return (
+
+ );
+};
+
export default DNFDialog;
diff --git a/src/views/Game/components/Header.tsx b/src/views/Game/components/Header.tsx
index 2d13038..6c362f6 100644
--- a/src/views/Game/components/Header.tsx
+++ b/src/views/Game/components/Header.tsx
@@ -20,11 +20,14 @@ import { MdWbSunny } from "react-icons/md";
import { BsMoonStarsFill } from "react-icons/bs";
import { useGameMetrics } from "../../../stores/metrics";
import DNFDialog from "./DNFDialog";
+import { useSounds } from "../../../hooks/sounds";
const Header: FunctionComponent = () => {
const theme = useTheme();
const navigate = useNavigate();
+ const sound = useSounds();
+
const game = useGame((state) => ({
gameStartTimestamp: state.gameStartTimestamp,
turnStartTimestamp: state.turnStartTimestamp,
@@ -105,7 +108,9 @@ const Header: FunctionComponent = () => {
sx={{
color: "primary.contrastText",
}}
- onClick={() => setRemoteDialogOpen(true)}
+ onClick={() => {
+ setRemoteDialogOpen(true);
+ }}
>
@@ -117,6 +122,8 @@ const Header: FunctionComponent = () => {
color: "primary.contrastText",
}}
onClick={() => {
+ sound.play("click");
+
settings.SetThemeMode(
settings.themeMode === "light" ? "dark" : "light"
);
diff --git a/src/views/Login/New/index.tsx b/src/views/Login/New/index.tsx
index 44a54ea..18c013e 100644
--- a/src/views/Login/New/index.tsx
+++ b/src/views/Login/New/index.tsx
@@ -50,6 +50,16 @@ const NewGameView: FunctionComponent = () => {
play("baladada");
};
+ const changeGameMode = (mode: GameMode) => {
+ setPlayers([]);
+ play("click");
+ };
+
+ const changeNumberOfPlayers = (value: number) => {
+ setNumberOfPlayers(value);
+ play("click");
+ };
+
return (
<>
@@ -104,9 +114,7 @@ const NewGameView: FunctionComponent = () => {
{
- setGameMode(value);
- }}
+ onChange={changeGameMode}
/>
@@ -121,9 +129,7 @@ const NewGameView: FunctionComponent = () => {
min={MIN_PLAYERS}
max={MAX_PLAYERS}
value={numberOfPlayers}
- onChange={(value) => {
- setNumberOfPlayers(value);
- }}
+ onChange={changeNumberOfPlayers}
/>
diff --git a/src/views/Login/components/PlayerItem.tsx b/src/views/Login/components/PlayerItem.tsx
index 6d597c9..e16958c 100644
--- a/src/views/Login/components/PlayerItem.tsx
+++ b/src/views/Login/components/PlayerItem.tsx
@@ -25,8 +25,8 @@ const PlayerItem: FunctionComponent = (props) => {
const [image, setImage] = useState(null);
const [locked, setLocked] = useState(false);
- const [username, setUsername] = useState("player1"); // TODO: remove
- const [password, setPassword] = useState("test");
+ const [username, setUsername] = useState(""); // TODO: remove
+ const [password, setPassword] = useState("");
const login = async () => {
if (props.hidePassword) {