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

fixed problems for depployment

Browse Source
This commit is contained in:
Quentin Roussel
2024-04-24 15:50:43 +00:00
parent e592aa33cb
commit 31eb15f006
20 changed files with 254 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
traque-front/components/team/actionDrawer.jsx
View File

@@ -4,6 +4,7 @@ import BlueButton, { GreenButton, RedButton } from "../util/button";
import TextInput from "../util/textInput";
import { useTeamConnexion } from "@/context/teamConnexionContext";
import { EnemyTeamModal } from "./enemyTeamModal";
import Image from "next/image";
export default function ActionDrawer() {
const [visible, setVisible] = useState(false);
@@ -29,10 +30,10 @@ export default function ActionDrawer() {
return (
<div className={"fixed w-screen bottom-0 z-10 bg-gray-100 flex justify-center rounded-t-2xl transition-all duration-200 flex flex-col " + (visible ? "h-full" : "h-20")}>
<img src="/icons/arrow_up.png" className={"w-full object-scale-down h-ful max-h-20 transition-all cursor-pointer duration-200 " + (visible && "rotate-180")} onClick={() => setVisible(!visible)} />
<Image src="/icons/arrow_up.png" className={"w-full object-scale-down h-ful max-h-20 transition-all cursor-pointer duration-200 " + (visible && "rotate-180")} onClick={() => setVisible(!visible)} />
{visible && <div className="flex justify-between flex-col w-full h-full">
<div className="flex flex-row justify-around">
<img src="/icons/logout.png" onClick={logout} className='p-3 mx-2 w-14 h-14 bg-red-500 rounded-lg cursor-pointer bg-red z-20' />
<Image src="/icons/logout.png" onClick={logout} className='p-3 mx-2 w-14 h-14 bg-red-500 rounded-lg cursor-pointer bg-red z-20' />
</div>
<div className='shadow-2xl bg-white p-1 flex flex-col text-center mb-1 mx-auto w-4/5 rounded'>
<div>

3
traque-front/components/team/enemyTeamModal.jsx
View File

@@ -1,6 +1,7 @@
import useGame from "@/hook/useGame";
import { RedButton } from "../util/button";
import { useEffect, useRef } from "react";
import Image from "next/image";
export function EnemyTeamModal({ visible, onClose }) {
const { teamId, enemyName } = useGame();
@@ -22,7 +23,7 @@ export function EnemyTeamModal({ visible, onClose }) {
<div className='fixed w-screen h-screen bg-black bg-opacity-50 z-10 text-center'></div>
<div className='fixed w-11/12 h-5/6 p-5 z-20 mx-auto inset-x-0 my-auto inset-y-0 flex flex-col justify-center rounded-xl transition-all shadow-xl bg-white '>
<h1 className="w-full text-center text-3xl mb-5">{enemyName}</h1>
<img ref={imageRef} src={SERVER_URL + "/photo/enemy?team=" + teamId.toString()} className='w-full h-full object-contain' />
<Image ref={imageRef} src={SERVER_URL + "/photo/enemy?team=" + teamId.toString()} className='w-full h-full object-contain' />
<div className="h-20">
<RedButton onClick={onClose}>Close</RedButton>
</div>

2
traque-front/components/team/map.jsx
View File

@@ -71,7 +71,7 @@ export function LiveMap({ ...props }) {
shadowSize: [41, 41]
})}>
<Popup>
Position de l'ennemi
Position de l&aposennemi
</Popup>
</Marker>}
<MapPan center={currentPosition} />

2
traque-front/components/team/notification.jsx
View File

@@ -41,7 +41,7 @@ export function Notification({socket }) {
return (
Object.keys(bgColorMap).map((key) =>
notification?.type == key &&
<div className={classNames + bgColorMap[key]} onClick={() => setVisible(false)}>
<div key={key} className={classNames + bgColorMap[key]} onClick={() => setVisible(false)}>
<p className='text-center text-xl'>{notification?.text}</p>
</div>
));

3
traque-front/components/team/placementOverlay.jsx
View File

@@ -1,12 +1,13 @@
import { useTeamConnexion } from "@/context/teamConnexionContext";
import useGame from "@/hook/useGame"
import Image from "next/image";
export default function PlacementOverlay() {
const { name, ready } = useGame();
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' />
<Image 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 className='fixed top-0 p-3 w-full bg-gray-300 shadow-xl rounded-b-xl flex flex-col z-10 justify-center items-center'>
<div className='text-2xl my-3'>Placement</div>
<div className='text-md'>{name}</div>

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

@@ -1,6 +1,7 @@
import useGame from "@/hook/useGame"
import { GreenButton, LogoutButton } from "../util/button";
import { useRef } from "react";
import Image from "next/image";
export function WaitingScreen() {
const { name, teamId } = useGame();
@@ -35,13 +36,13 @@ export function WaitingScreen() {
Jeu en préparation, veuillez patienter...
</div>
<div className='text-2xl text-center my-10'>
<p>Uploadez une photo où tous les membres de l'équipe sont visibles</p>
<p>Uploadez une photo où tous les membres de l&aposéquipe sont visibles</p>
<input type="file" name="file" accept="image/*" className=" my-5 block w-full text-slate-500 file:mr-4 file:py-2 file:px-4 file:rounded-md file:border-0 file:bg-blue-50 file:text-blue-700 hover:file:bg-blue-100"/>
<div className="h-20">
<GreenButton onClick={sendImage}>Envoyer</GreenButton>
</div>
</div>
{teamId && <img ref={imageRef} src={SERVER_URL + "/photo/my?team=" + teamId.toString()} className='w-screen h-1/2 object-contain' />}
{teamId && <Image ref={imageRef} src={SERVER_URL + "/photo/my?team=" + teamId.toString()} className='w-screen h-1/2 object-contain' />}
</div>
)
}

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

@@ -1,4 +1,5 @@
import { useTeamConnexion } from "@/context/teamConnexionContext";
import Image from "next/image";
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">
@@ -20,5 +21,5 @@ export function GreenButton({ children, ...props }) {
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' />
return <Image 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' />
}