public/traque
1
0
Fork 0
mirror of https://git.rezel.net/LudoTech/traque.git synced 2026-02-09 10:20:16 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

game over basic frontend

Browse Source
This commit is contained in:
Quentin Roussel
2024-04-20 13:23:06 +02:00
parent fa078ccbda
commit 643343b903
3 changed files with 22 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
traque-front/components/team/waitingScreen.jsx
View File

@@ -1,12 +1,10 @@
import { useTeamConnexion } from "@/context/teamConnexionContext";
import useGame from "@/hook/useGame"
import { GreenButton } from "../util/button";
import { GreenButton, LogoutButton } from "../util/button";
import { useRef } from "react";
export function WaitingScreen() {
const { name, teamId } = useGame();
const imageRef = useRef(null);
const { logout } = useTeamConnexion();
const SERVER_URL = "https://" + process.env.NEXT_PUBLIC_SOCKET_HOST + ":" + process.env.NEXT_PUBLIC_SOCKET_PORT;
function sendImage() {
@@ -29,6 +27,7 @@ export function WaitingScreen() {
return (
<div className='h-full flex flex-col items-center justify-center'>
<LogoutButton />
<div className='text-4xl mt-10 text-center'>
Equipe : {name}
</div>
@@ -43,7 +42,6 @@ export function WaitingScreen() {
</div>
</div>
{teamId && <img ref={imageRef} src={SERVER_URL + "/photo/my?team=" + teamId.toString()} className='w-screen h-1/2 object-contain' />}
<img src="/icons/logout.png" onClick={logout} className='w-12 h-12 bg-red-500 p-2 top-1 right-1 rounded-lg cursor-pointer bg-red fixed z-20' />
</div>
)
}

7
traque-front/components/util/button.jsx
View File

@@ -1,3 +1,5 @@
import { useTeamConnexion } from "@/context/teamConnexionContext";
export default function BlueButton({ children, ...props }) {
return (<button {...props} className="bg-blue-600 hover:bg-blue-500 text-lg ease-out duration-200 text-white w-full h-full p-4 shadow-sm rounded">
{children}
@@ -14,4 +16,9 @@ export function GreenButton({ children, ...props }) {
return (<button {...props} className="bg-green-600 hover:bg-green-500 text-lg ease-out duration-200 text-white w-full h-full p-4 shadow-sm rounded">
{children}
</button>)
}
export function LogoutButton() {
const { logout } = useTeamConnexion();
return <img src="/icons/logout.png" onClick={logout} className='w-12 h-12 bg-red-500 p-2 top-1 right-1 rounded-lg cursor-pointer bg-red fixed z-20' />
}