From b61531d8d2d2eac3b43c0fd8fd72e3089d05bb7e Mon Sep 17 00:00:00 2001 From: Lara REALI Date: Mon, 26 Jun 2023 00:32:42 +0200 Subject: [PATCH 1/6] color for qr input + text in chat input + w = wall --- .../react/src/components/Game/PlayButton.tsx | 14 ++--- .../react/src/components/Messages/Chats.tsx | 54 +++++++++---------- .../react/src/components/Messages/Modal.tsx | 14 +++-- containers/react/src/styles/App.css | 7 +-- 4 files changed, 44 insertions(+), 45 deletions(-) diff --git a/containers/react/src/components/Game/PlayButton.tsx b/containers/react/src/components/Game/PlayButton.tsx index c42523c2..0adf2bb8 100644 --- a/containers/react/src/components/Game/PlayButton.tsx +++ b/containers/react/src/components/Game/PlayButton.tsx @@ -8,27 +8,27 @@ function PlayButton() { const history = useNavigate(); // const handleButtonClick = () => { - // let path = `play`; + // let path = `play`; // history(path); // }; const handleButtonClick = () => { let path = `play?`; - + const superpowerCheckbox = document.querySelector('input[value="superpower"]'); if (superpowerCheckbox && superpowerCheckbox.checked) { path += 'superpower=true&'; } - + const obstacleCheckbox = document.querySelector('input[value="obstacle"]'); if (obstacleCheckbox && obstacleCheckbox.checked) { path += 'obstacle=true&'; } - + const speedCheckbox = document.querySelector('input[value="speed"]'); if (speedCheckbox && speedCheckbox.checked) { path += 'speed=true&'; } - + // Remove the trailing '&' character path = path.slice(0, -1); console.log(path) @@ -40,7 +40,7 @@ function PlayButton() { {/* !buttonClicked && */}
-

Super Power

+

Super Power
( w = wall power )

Obstacle

Faster and Faster

@@ -48,4 +48,4 @@ function PlayButton() { ); } -export default PlayButton; \ No newline at end of file +export default PlayButton; diff --git a/containers/react/src/components/Messages/Chats.tsx b/containers/react/src/components/Messages/Chats.tsx index c1ce0fe1..6301b683 100644 --- a/containers/react/src/components/Messages/Chats.tsx +++ b/containers/react/src/components/Messages/Chats.tsx @@ -36,7 +36,7 @@ const TouchDiv = styled.div` margin-top: 21px; cursor: pointer; justify-content: space-around; - + &:hover { color: #F4F3EF; } @@ -71,7 +71,7 @@ const SideP = styled.p` //======================================================================================================== //======================================================================================================== -// Logical part +// Logical part //======================================================================================================== //======================================================================================================== @@ -84,7 +84,7 @@ interface MessageProps { } function Chats(){ - + const [isLoading, setIsLoading] = useState(true); const [conversations, setConversation] = useState([]); const [partyInvite, setPartyInvite] = useState([]); @@ -100,7 +100,7 @@ function Chats(){ const socket = useRef(null); // const socket = Socket | null // socket = useRef( useRef(null)); - + useEffect(()=> { @@ -137,7 +137,7 @@ function Chats(){ console.log("muted hehe"); //set mute var to true and do nothing }); - + setIsLoading(false) } @@ -159,7 +159,7 @@ function Chats(){ }, []) useEffect(()=> { - + const updateChat = async ()=> { // if (currentChat) // console.log(currentChat.id) @@ -188,7 +188,7 @@ function Chats(){ }, [incomingMessage, currentChat]) - useEffect(()=> { + useEffect(()=> { const getMessage = async ()=> { if (!currentChat) @@ -238,7 +238,7 @@ function Chats(){ setNewMessage(""); if (socket.current) socket.current.emit('sendMessage', message); - } + } catch(err){ console.log(err) } @@ -252,7 +252,7 @@ function Chats(){ } - + const [friend, setFriend] = useState(""); // const [modalOpen, setModalOpen] = useState(false); const [addFriend, setAddFriend] = useState(false); @@ -269,19 +269,19 @@ function Chats(){ const [selectTags, setSelectTag] = useState([{ id: 1, selectedOption: ''}]); const [users, setUsers] = useState([]); - + const openNewGameModal = () => { setNewGameModalOpen(true); }; - + const closeNewGameModal = () => { setNewGameModalOpen(false); }; - + const openNewConversationModal = () => { setNewConversationModalOpen(true); }; - + const closeNewConversationModal = () => { setNewConversationModalOpen(false); }; @@ -300,7 +300,7 @@ function Chats(){ const handleFriend = (event: { target: { value: React.SetStateAction; }; }) => { setFriend(event.target.value); }; - + const handleAddFriend = async () => { try{ console.log("friend= ", friend); @@ -321,7 +321,7 @@ function Chats(){ console.log(err) } }; - + const handleBlockFriend = async () => { try{ const res = await api.post("/block", {username: friend}) @@ -339,12 +339,12 @@ function Chats(){ console.log(err) } }; - + const closeAddFriend = () => { setAddFriend(false); setShowAddFriendAlert(false); }; - + const closeBlock = () => { setBlock(false); setShowBlockAlert(false); @@ -353,7 +353,7 @@ function Chats(){ const handleOptionChange = (selectId: number, selectedOption: string) => { console.log("selected Option=", selectedOption) setFriend(selectedOption); - setSelectTag((prevTags) => + setSelectTag((prevTags) => prevTags.map((tag) => tag.id === selectId ? { ...tag, selectedOption } : tag ) @@ -362,14 +362,14 @@ function Chats(){ //======================================================================================================== //======================================================================================================== -// HTML +// HTML //======================================================================================================== //======================================================================================================== return (
- +
{/* profile */} @@ -395,7 +395,7 @@ function Chats(){ - (block ? setBlock(false) : setBlock(true))} > @@ -410,7 +410,7 @@ function Chats(){ {currentChat ? ( - (setting ? setSetting(false) : setSetting(true))} > @@ -434,7 +434,7 @@ function Chats(){ onChange={(a) => handleOptionChange(selectTag.id, a.target.value)} > {users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.username)).map((item, index) => ( {currentChat && isAdmin ? ( - (setting ? setSetting(false) : setSetting(true))} > @@ -533,7 +533,7 @@ function Chats(){
- + )})} @@ -569,7 +569,7 @@ function Chats(){ // - ); + ); } -export default Chats \ No newline at end of file +export default Chats diff --git a/containers/react/src/components/Messages/Modal.tsx b/containers/react/src/components/Messages/Modal.tsx index 86c2e2f0..925d6801 100644 --- a/containers/react/src/components/Messages/Modal.tsx +++ b/containers/react/src/components/Messages/Modal.tsx @@ -59,7 +59,7 @@ const Modal = ({handleClose}: ModalProps) => { const handleOptionChange = (selectId: number, selectedOption: string) => { console.log("selected Option=", selectedOption) - setSelectTag((prevTags) => + setSelectTag((prevTags) => prevTags.map((tag) => tag.id === selectId ? { ...tag, selectedOption } : tag ) @@ -123,7 +123,7 @@ const Modal = ({handleClose}: ModalProps) => { onChange={(a) => handleOptionChange(selectTag.id, a.target.value)} > {users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.nickname)).map((item, index) => (