MauMau/MauMau-Client
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #4 from MauMauStudios/developmaunt

Browse Source 
Developmaunt
This commit is contained in:
Jordan Geurtsen
2023-04-07 12:12:01 +02:00
committed by GitHub
parent dce716c3d8 13f57c435e
commit 9b7bcaf0c8
4 changed files with 18 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
public/index.html
View File

@@ -5,10 +5,10 @@
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="MauMau!"/>
<meta name="description" content="Mau-Mau!"/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>Mau Mau</title>
<title>Mau-Mau</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>

15
src/layout/pages/MainLobby.tsx
View File

@@ -1,34 +1,33 @@
import React from "react";
import useTitle from "../../utils/hooks/TitleHook";
import Card from "../components/Card";
import {useNavigate} from "react-router";
const ROOM_URL = `http://${process.env.REACT_APP_API_URL}/room`;
const MainLobby = () => {
useTitle('MauLobby');
useTitle('Mau-Mau Lobby');
const navigateTo = useNavigate();
const handleCreateRoom = () => {
fetch(ROOM_URL, {
method: 'POST',
}).then(r => r.json()).then(data => {
window.location.href = `/room/${data}`;
navigateTo(`/room/${data}`)
});
}
const gotoRooms = () => {
window.location.href = '/rooms';
}
return (
<div className={"main-lobby"}>
<h1 className={"main-lobby__title mau"}>MauMau</h1>
<h1 className={"main-lobby__title mau"}>Mau-Mau</h1>
<div className={"main-lobby__container"}>
<div className={"main-lobby__container-button clickable"} onClick={handleCreateRoom}>
<h2 className={"mau"}>Host Game</h2>
<Card cardString={'SPADES ACE'} isClickable/>
</div>
<div className={"main-lobby__container-button clickable"} onClick={gotoRooms}>
<div className={"main-lobby__container-button clickable"} onClick={() => navigateTo('/rooms')}>
<h2 className={"mau"}>Join Game</h2>
<Card cardString={'SPADES ACE'} isHidden isClickable/>
</div>

6
src/layout/pages/Room.tsx
View File

@@ -1,6 +1,6 @@
import useWebSocket from "react-use-websocket";
import React from "react";
import {useParams} from "react-router";
import {useNavigate, useParams} from "react-router";
import {GHButton} from "../components/Button";
import useTitle from "../../utils/hooks/TitleHook";
import Hand from "../components/Hand";
@@ -18,6 +18,8 @@ const Room = () => {
useTitle('Mau!');
const navigateTo = useNavigate();
const {roomId} = useParams();
const WS_URL = `ws://${process.env.REACT_APP_API_URL}/room/${roomId}`;
@@ -43,7 +45,7 @@ const Room = () => {
const handleLeaveRoom = () => {
const socket = websocket.getWebSocket();
if (socket) socket.close();
window.location.href = '/';
navigateTo('/');
}
const handleCardSend = (card: string) => {

8
src/layout/pages/Rooms.tsx
View File

@@ -1,12 +1,13 @@
import useTitle from "../../utils/hooks/TitleHook";
import React from "react";
import {Link} from "react-router-dom";
import {useNavigate} from "react-router";
const ROOM_URL = `http://${process.env.REACT_APP_API_URL}/room`;
const Rooms = () => {
useTitle('Rooms');
useTitle('Mau-Mau Rooms');
const navigateTo = useNavigate();
const [rooms, setRooms] = React.useState<string[]>([]);
@@ -22,7 +23,8 @@ const Rooms = () => {
<ul>
{
rooms.map((room, index) => {
return <li key={index}><Link to={`room/${room}`}>{room}</Link></li>
return <li key={index} className={"clickable"}
onClick={() => navigateTo(`/room/${room}`)}>{room}</li>
})
}
</ul>