diff --git a/backend/package-lock.json b/backend/package-lock.json index 8a7aa85..96cf9fc 100644 --- a/backend/package-lock.json +++ b/backend/package-lock.json @@ -7146,6 +7146,7 @@ "version": "5.4.5", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz", "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==", + "dev": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" diff --git a/backend/src/eventRecipients.ts b/backend/src/eventRecipients.ts index 9c97f9e..5ec54e0 100644 --- a/backend/src/eventRecipients.ts +++ b/backend/src/eventRecipients.ts @@ -33,7 +33,11 @@ export function scheduleSend(clientId: ClientId, event: AppEvent) { //todo: Enqueue the event for sending. } -// eslint-disable-next-line @typescript-eslint/no-unused-vars -export function doSendEvent(clientId: ClientId) { - //todo: Send all the events in the queue to the client, only if the response object is available. +export function doSendEvents(clientId: ClientId) { + const res = clients.get(clientId); + const events = eventQueue.get(clientId) || []; + if (res && events.length > 0) { + res.json({ events }); + eventQueue.set(clientId, []); + } } diff --git a/frontend/public/UNO_Logo.svg b/frontend/public/UNO_Logo.svg new file mode 100644 index 0000000..278a3ed --- /dev/null +++ b/frontend/public/UNO_Logo.svg @@ -0,0 +1,175 @@ + + + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/frontend/src/index.css b/frontend/src/index.css index b5c61c9..a168df0 100644 --- a/frontend/src/index.css +++ b/frontend/src/index.css @@ -1,3 +1,7 @@ @tailwind base; @tailwind components; @tailwind utilities; + +body::-webkit-scrollbar { + display: none; +} diff --git a/frontend/src/library/button.tsx b/frontend/src/library/button.tsx index d9f5396..319076e 100644 --- a/frontend/src/library/button.tsx +++ b/frontend/src/library/button.tsx @@ -11,7 +11,14 @@ type ButtonProps = { }; function Button({ onClick, children }: ButtonProps) { - return ; + return ( + + ); } export default Button; diff --git a/frontend/src/library/heading.tsx b/frontend/src/library/heading.tsx index e69de29..510cf54 100644 --- a/frontend/src/library/heading.tsx +++ b/frontend/src/library/heading.tsx @@ -0,0 +1,13 @@ +type InputProps = { + name?: string; +}; + +const heading = ({ name }: InputProps) => { + return ( +
+

{name}

+
+ ); +}; + +export default heading; diff --git a/frontend/src/pages/PlayOptions.tsx b/frontend/src/pages/PlayOptions.tsx index 6600ba6..df10c29 100644 --- a/frontend/src/pages/PlayOptions.tsx +++ b/frontend/src/pages/PlayOptions.tsx @@ -1,26 +1,61 @@ +import { useState } from 'react'; import { useNavigate } from 'react-router-dom'; -import Input from '../library/input'; import Button from '../library/button'; +import Heading from '../library/heading'; +import '../index.css'; -function PlayOptions() { +const PlayOptions = () => { + const [gameCode, setGameCode] = useState(''); const navigate = useNavigate(); - function handleCreateGame() { - console.log('Creating a new game'); + const CreateGame = () => { + // Logic to create a game + console.log('Create Game'); navigate('/game'); - } + }; + + const JoinGame = () => { + // Logic to join a game + console.log('Join Game with code:', gameCode); + }; return ( - <> -
-

Create a new game

- -
-
-

Join a game

- +
+
+
+ UNO Logo +

+ Ready for Action? +

+
+
+
+
+ +
+ +
+
+
+ +
+
+ setGameCode(e.target.value)} + className="border-2 border-red-600 rounded-lg p-1 mb-4 text-md w-full bg-black text-white" + /> +
+ +
+
- +
); -} +}; export default PlayOptions;