color for qr input + text in chat input + w = wall
This commit is contained in:
parent
1e9946859c
commit
b61531d8d2
@ -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<HTMLInputElement>('input[value="superpower"]');
|
||||
if (superpowerCheckbox && superpowerCheckbox.checked) {
|
||||
path += 'superpower=true&';
|
||||
}
|
||||
|
||||
|
||||
const obstacleCheckbox = document.querySelector<HTMLInputElement>('input[value="obstacle"]');
|
||||
if (obstacleCheckbox && obstacleCheckbox.checked) {
|
||||
path += 'obstacle=true&';
|
||||
}
|
||||
|
||||
|
||||
const speedCheckbox = document.querySelector<HTMLInputElement>('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() {
|
||||
<button onClick={handleButtonClick} className="playButton">Play</button>
|
||||
{/* !buttonClicked && <button onClick={handleButtonClick}>Draw on Canvas</button> */}
|
||||
<div className='checkbox'>
|
||||
<p><input className="inside_checkbox" type="checkbox" value="superpower"/> Super Power </p>
|
||||
<p><input className="inside_checkbox" type="checkbox" value="superpower"/> Super Power <br/> ( w = wall power ) </p>
|
||||
<p><input className="inside_checkbox" type="checkbox" value="obstacle"/> Obstacle </p>
|
||||
<p><input className="inside_checkbox" type="checkbox" value="speed"/> Faster and Faster </p>
|
||||
</div>
|
||||
@ -48,4 +48,4 @@ function PlayButton() {
|
||||
);
|
||||
}
|
||||
|
||||
export default PlayButton;
|
||||
export default PlayButton;
|
||||
|
||||
@ -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<boolean>(true);
|
||||
const [conversations, setConversation] = useState([]);
|
||||
const [partyInvite, setPartyInvite] = useState([]);
|
||||
@ -100,7 +100,7 @@ function Chats(){
|
||||
const socket = useRef<Socket | null>(null);
|
||||
// const socket = Socket<DefaultEventsMap, DefaultEventsMap> | null
|
||||
// socket = useRef( useRef<SocketIOClient.Socket | null>(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<User[]>([]);
|
||||
|
||||
|
||||
|
||||
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<string>; }; }) => {
|
||||
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 (
|
||||
<div className="chat">
|
||||
|
||||
|
||||
<div className='navbar'>
|
||||
{/* <img src={DefaultPic} alt="profile" className="pic"/> */}
|
||||
<IoLogoOctocat className="catchat"/>
|
||||
@ -395,7 +395,7 @@ function Chats(){
|
||||
</AnimatePresence>
|
||||
</TouchDiv>
|
||||
<TouchDiv>
|
||||
<motion.div
|
||||
<motion.div
|
||||
onClick={() => (block ? setBlock(false) : setBlock(true))}
|
||||
>
|
||||
<ImBlocked/>
|
||||
@ -410,7 +410,7 @@ function Chats(){
|
||||
{currentChat ? (
|
||||
|
||||
<TouchDiv>
|
||||
<motion.div
|
||||
<motion.div
|
||||
onClick={() => (setting ? setSetting(false) : setSetting(true))}
|
||||
>
|
||||
<RiListSettingsLine/>
|
||||
@ -434,7 +434,7 @@ function Chats(){
|
||||
onChange={(a) => handleOptionChange(selectTag.id, a.target.value)}
|
||||
>
|
||||
<option value="">{
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select an option"
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select a user"
|
||||
}</option>
|
||||
{users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.username)).map((item, index) => (
|
||||
<option key={index} value={item.username}>
|
||||
@ -472,7 +472,7 @@ function Chats(){
|
||||
</TouchDiv>
|
||||
{currentChat && isAdmin ? (
|
||||
<TouchDiv>
|
||||
<motion.div
|
||||
<motion.div
|
||||
onClick={() => (setting ? setSetting(false) : setSetting(true))}
|
||||
>
|
||||
<RiListSettingsLine/>
|
||||
@ -533,7 +533,7 @@ function Chats(){
|
||||
</div>
|
||||
</UserChat>
|
||||
</div>
|
||||
|
||||
|
||||
)})}
|
||||
</div>
|
||||
|
||||
@ -569,7 +569,7 @@ function Chats(){
|
||||
</div>
|
||||
</div>
|
||||
// </div>
|
||||
);
|
||||
);
|
||||
}
|
||||
|
||||
export default Chats
|
||||
export default Chats
|
||||
|
||||
@ -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)}
|
||||
>
|
||||
<option value="">{
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select an option"
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select a user"
|
||||
}</option>
|
||||
{users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.nickname)).map((item, index) => (
|
||||
<option key={index} value={item.username}>
|
||||
@ -137,9 +137,7 @@ const Modal = ({handleClose}: ModalProps) => {
|
||||
<GrAdd onClick={addNewSelectedTag}/>
|
||||
</div>
|
||||
<div className="div_submit">
|
||||
<Link to='#' className="submit" onClick={ saveSelectedOptions}>Submit</Link>
|
||||
|
||||
<Link to="#" className="submit" onClick={() => handleClose}>Cancel</Link>
|
||||
<Link to='#' className="submit" onClick={saveSelectedOptions}>Submit</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -150,9 +148,9 @@ const Modal = ({handleClose}: ModalProps) => {
|
||||
<select
|
||||
value={channel}
|
||||
onChange={(event) => setChannel(event.target.value)}
|
||||
|
||||
|
||||
>
|
||||
<option value="">Select an option</option>
|
||||
<option value="">Select a channel</option>
|
||||
{convs.map((conv) => (
|
||||
!(!conv.group || conv.private || (conv.banned && user && conv.banned.includes(user.username)) || (conv.members && user && conv.members.includes(user.username))) && (
|
||||
<option key={conv.id} value={conv.id}>
|
||||
@ -179,4 +177,4 @@ const Modal = ({handleClose}: ModalProps) => {
|
||||
)
|
||||
}
|
||||
|
||||
export default Modal
|
||||
export default Modal
|
||||
|
||||
@ -15,9 +15,10 @@ input.qr{
|
||||
border-radius: 5px;
|
||||
background-color: rgb(0, 0, 0);
|
||||
margin : 1%;
|
||||
color:rgb(42, 41, 41);
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color:rgb(42, 41, 41);
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.desactivate {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user