Clean up starting
This commit is contained in:
NigeParis
Maix0
parent
7532ce19d2
commit
ddfee11474
6 changed files with 73 additions and 107 deletions
|
|
@ -19,7 +19,7 @@
|
|||
"@types/qrcode": "^1.5.6",
|
||||
"js-cookie": "^3.0.5",
|
||||
"qrcode": "^1.5.4",
|
||||
"socket.io-client": "^4.8.2",
|
||||
"socket.io-client": "^4.8.3",
|
||||
"tailwindcss": "^4.1.18"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
51
frontend/pnpm-lock.yaml
generated
51
frontend/pnpm-lock.yaml
generated
|
|
@ -21,8 +21,8 @@ importers:
|
|||
specifier: ^1.5.4
|
||||
version: 1.5.4
|
||||
socket.io-client:
|
||||
specifier: ^4.8.2
|
||||
version: 4.8.2
|
||||
specifier: ^4.8.3
|
||||
version: 4.8.3
|
||||
tailwindcss:
|
||||
specifier: ^4.1.18
|
||||
version: 4.1.18
|
||||
|
|
@ -451,15 +451,6 @@ packages:
|
|||
color-name@1.1.4:
|
||||
resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
|
||||
|
||||
debug@4.3.7:
|
||||
resolution: {integrity: sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==}
|
||||
engines: {node: '>=6.0'}
|
||||
peerDependencies:
|
||||
supports-color: '*'
|
||||
peerDependenciesMeta:
|
||||
supports-color:
|
||||
optional: true
|
||||
|
||||
debug@4.4.3:
|
||||
resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==}
|
||||
engines: {node: '>=6.0'}
|
||||
|
|
@ -483,8 +474,8 @@ packages:
|
|||
emoji-regex@8.0.0:
|
||||
resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
|
||||
|
||||
engine.io-client@6.6.3:
|
||||
resolution: {integrity: sha512-T0iLjnyNWahNyv/lcjS2y4oE358tVS/SYQNxYXGAJ9/GLgH4VCvOQ/mhTjqU88mLZCQgiG8RIegFHYCdVC+j5w==}
|
||||
engine.io-client@6.6.4:
|
||||
resolution: {integrity: sha512-+kjUJnZGwzewFDw951CDWcwj35vMNf2fcj7xQWOctq1F2i1jkDdVvdFG9kM/BEChymCH36KgjnW0NsL58JYRxw==}
|
||||
|
||||
engine.io-parser@5.2.3:
|
||||
resolution: {integrity: sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==}
|
||||
|
|
@ -675,12 +666,12 @@ packages:
|
|||
set-blocking@2.0.0:
|
||||
resolution: {integrity: sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==}
|
||||
|
||||
socket.io-client@4.8.2:
|
||||
resolution: {integrity: sha512-4MY14EMsyEPFA6lM01XIYepRdV8P6dUir2hxAlAysOYcbNAy5QNHYgIHOcQ1KYM7wTcKnKEW/ZRoIxRinWRXvA==}
|
||||
socket.io-client@4.8.3:
|
||||
resolution: {integrity: sha512-uP0bpjWrjQmUt5DTHq9RuoCBdFJF10cdX9X+a368j/Ft0wmaVgxlrjvK3kjvgCODOMMOz9lcaRzxmso0bTWZ/g==}
|
||||
engines: {node: '>=10.0.0'}
|
||||
|
||||
socket.io-parser@4.2.4:
|
||||
resolution: {integrity: sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==}
|
||||
socket.io-parser@4.2.5:
|
||||
resolution: {integrity: sha512-bPMmpy/5WWKHea5Y/jYAP6k74A+hvmRCQaJuJB6I/ML5JZq/KfNieUVo/3Mh7SAqn7TyFdIo6wqYHInG1MU1bQ==}
|
||||
engines: {node: '>=10.0.0'}
|
||||
|
||||
source-map-js@1.2.1:
|
||||
|
|
@ -779,8 +770,8 @@ packages:
|
|||
resolution: {integrity: sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==}
|
||||
engines: {node: '>=8'}
|
||||
|
||||
ws@8.17.1:
|
||||
resolution: {integrity: sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ==}
|
||||
ws@8.18.3:
|
||||
resolution: {integrity: sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==}
|
||||
engines: {node: '>=10.0.0'}
|
||||
peerDependencies:
|
||||
bufferutil: ^4.0.1
|
||||
|
|
@ -1073,10 +1064,6 @@ snapshots:
|
|||
|
||||
color-name@1.1.4: {}
|
||||
|
||||
debug@4.3.7:
|
||||
dependencies:
|
||||
ms: 2.1.3
|
||||
|
||||
debug@4.4.3:
|
||||
dependencies:
|
||||
ms: 2.1.3
|
||||
|
|
@ -1089,12 +1076,12 @@ snapshots:
|
|||
|
||||
emoji-regex@8.0.0: {}
|
||||
|
||||
engine.io-client@6.6.3:
|
||||
engine.io-client@6.6.4:
|
||||
dependencies:
|
||||
'@socket.io/component-emitter': 3.1.2
|
||||
debug: 4.3.7
|
||||
debug: 4.4.3
|
||||
engine.io-parser: 5.2.3
|
||||
ws: 8.17.1
|
||||
ws: 8.18.3
|
||||
xmlhttprequest-ssl: 2.1.2
|
||||
transitivePeerDependencies:
|
||||
- bufferutil
|
||||
|
|
@ -1286,21 +1273,21 @@ snapshots:
|
|||
|
||||
set-blocking@2.0.0: {}
|
||||
|
||||
socket.io-client@4.8.2:
|
||||
socket.io-client@4.8.3:
|
||||
dependencies:
|
||||
'@socket.io/component-emitter': 3.1.2
|
||||
debug: 4.4.3
|
||||
engine.io-client: 6.6.3
|
||||
socket.io-parser: 4.2.4
|
||||
engine.io-client: 6.6.4
|
||||
socket.io-parser: 4.2.5
|
||||
transitivePeerDependencies:
|
||||
- bufferutil
|
||||
- supports-color
|
||||
- utf-8-validate
|
||||
|
||||
socket.io-parser@4.2.4:
|
||||
socket.io-parser@4.2.5:
|
||||
dependencies:
|
||||
'@socket.io/component-emitter': 3.1.2
|
||||
debug: 4.3.7
|
||||
debug: 4.4.3
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
|
||||
|
|
@ -1366,7 +1353,7 @@ snapshots:
|
|||
string-width: 4.2.3
|
||||
strip-ansi: 6.0.1
|
||||
|
||||
ws@8.17.1: {}
|
||||
ws@8.18.3: {}
|
||||
|
||||
xmlhttprequest-ssl@2.1.2: {}
|
||||
|
||||
|
|
|
|||
|
|
@ -233,24 +233,17 @@ div-private {
|
|||
items-center;
|
||||
}
|
||||
|
||||
.popup-b-clear {
|
||||
.popup-b-invite {
|
||||
@apply
|
||||
absolute
|
||||
bottom-42
|
||||
right-12
|
||||
}
|
||||
|
||||
.popup-b-invite {
|
||||
@apply
|
||||
absolute
|
||||
bottom-52
|
||||
right-12
|
||||
}
|
||||
|
||||
.popup-b-block {
|
||||
@apply
|
||||
absolute
|
||||
bottom-62
|
||||
bottom-52
|
||||
right-12
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,13 +1,11 @@
|
|||
<div class="displaybox">
|
||||
<div id="mainbox" class="mainboxDisplay">
|
||||
<button id="b-whoami" class="btn-style absolute top-4 left-6">Who am i</button>
|
||||
<button id="b-nextGame" class="btn-style absolute top-4 left-34">nextGame</button>
|
||||
<button id="b-nextGame" class="btn-style absolute top-4 left-14">nextGame</button>
|
||||
<h1 class="text-3xl font-bold text-gray-800">
|
||||
ChatterBox<span id="t-username"></span>
|
||||
</h1><br>
|
||||
<button id="b-clear" class="btn-style absolute top-4 right-6">Clear Text</button>
|
||||
<button id="b-quit" class="btn-style absolute top-14 right-6">Quit Chat</button>
|
||||
<button id="b-help" class="btn-style absolute top-14 left-6">Connected</button>
|
||||
<!-- Horizontal Message Box -->
|
||||
<div id="system-box" class="system-info">System: connecting ... </div>
|
||||
<div class="flex justify-center mt-2">
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import "./chat.css";
|
||||
import './chat.css';
|
||||
import { addRoute, setTitle, type RouteHandlerParams, type RouteHandlerReturn } from "@app/routing";
|
||||
import { showError } from "@app/toast";
|
||||
import authHtml from './chat.html?raw';
|
||||
|
|
@ -47,6 +47,8 @@ export type obj =
|
|||
Sendertext: string,
|
||||
};
|
||||
|
||||
const MAX_SYSTEM_MESSAGES = 10;
|
||||
|
||||
// get the name of the machine used to connect
|
||||
const machineHostName = window.location.hostname;
|
||||
console.log('connect to login at %chttps://' + machineHostName + ':8888/app/login',color.yellow);
|
||||
|
|
@ -215,33 +217,33 @@ async function connected(socket: Socket): Promise<void> {
|
|||
}, 16);
|
||||
};
|
||||
|
||||
async function whoami(socket: Socket) {
|
||||
try {
|
||||
const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement;
|
||||
const loggedIn = isLoggedIn();
|
||||
// async function whoami(socket: Socket) {
|
||||
// try {
|
||||
// const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement;
|
||||
// const loggedIn = isLoggedIn();
|
||||
|
||||
const res = (getUser());
|
||||
console.log('loginGuest():', res?.name);
|
||||
if (res) {
|
||||
let user = await updateUser();
|
||||
if (chatWindow) {
|
||||
socket.emit('updateClientName', {
|
||||
oldUser: '',
|
||||
user: user?.name
|
||||
});
|
||||
}
|
||||
if (user === null)
|
||||
return showError('Failed to get user: no user ?');
|
||||
setTitle(`Welcome ${user.guest ? '[GUEST] ' : ''}${user.name}`);
|
||||
} else {
|
||||
showError(`Failed to login: ${res}`);
|
||||
}
|
||||
// const res = (getUser());
|
||||
// console.log('loginGuest():', res?.name);
|
||||
// if (res) {
|
||||
// let user = await updateUser();
|
||||
// if (chatWindow) {
|
||||
// socket.emit('updateClientName', {
|
||||
// oldUser: '',
|
||||
// user: user?.name
|
||||
// });
|
||||
// }
|
||||
// if (user === null)
|
||||
// return showError('Failed to get user: no user ?');
|
||||
// setTitle(`Welcome ${user.guest ? '[GUEST] ' : ''}${user.name}`);
|
||||
// } else {
|
||||
// showError(`Failed to login: ${res}`);
|
||||
// }
|
||||
|
||||
} catch (e) {
|
||||
console.error("Login error:", e);
|
||||
showError('Failed to login: Unknown error');
|
||||
}
|
||||
};
|
||||
// } catch (e) {
|
||||
// console.error("Login error:", e);
|
||||
// showError('Failed to login: Unknown error');
|
||||
// }
|
||||
// };
|
||||
|
||||
let count = 0;
|
||||
function incrementCounter(): number {
|
||||
|
|
@ -340,27 +342,14 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
if (chatWindow && data.message.destination === "inviteMsg") {
|
||||
const messageElement = document.createElement("div-private");
|
||||
const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement;
|
||||
messageElement.innerHTML = `🎃${data.message.SenderUserName}: ${data.message.innerHtml}`;
|
||||
messageElement.innerHTML = `🏓${data.message.SenderUserName}: ${data.message.innerHtml}`;
|
||||
chatWindow.appendChild(messageElement);
|
||||
chatWindow.scrollTop = chatWindow.scrollHeight;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const MAX_SYSTEM_MESSAGES = 10;
|
||||
|
||||
if (systemWindow && data.message.destination === "system-info") {
|
||||
const messageElement = document.createElement("div");
|
||||
messageElement.textContent = `${data.message.user}: ${data.message.text}`;
|
||||
|
|
@ -380,21 +369,21 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
|
|||
profil.SenderName = getUser()?.name ?? "";
|
||||
openProfilePopup(profil);
|
||||
socket.emit('isBlockdBtn', profil);
|
||||
console.log(`DEBUG LOG: userId:${profil.userID}: senderID${profil.SenderID}' senderID:${getUser()?.id}`);
|
||||
console.log(`DEBUG LOG: user:${profil.user}: sender:${profil.SenderName}' senderID:${getUser()?.name}`);
|
||||
// console.log(`DEBUG LOG: userId:${profil.userID}: senderID${profil.SenderID}' senderID:${getUser()?.id}`);
|
||||
// console.log(`DEBUG LOG: user:${profil.user}: sender:${profil.SenderName}' senderID:${getUser()?.name}`);
|
||||
socket.emit('check_Block_button', profil);
|
||||
actionBtnPopUpClear(profil, socket);
|
||||
actionBtnPopUpInvite(profil, socket);
|
||||
actionBtnPopUpBlock(profil, socket);
|
||||
});
|
||||
|
||||
socket.on('inviteGame', (invite: ClientProfil) => {
|
||||
const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement;
|
||||
const messageElement = document.createElement("div");
|
||||
messageElement.innerHTML =`🏓${invite.SenderName}: ${invite.innerHtml}`;
|
||||
chatWindow.appendChild(messageElement);
|
||||
chatWindow.scrollTop = chatWindow.scrollHeight;
|
||||
});
|
||||
// socket.on('inviteGame', (invite: ClientProfil) => {
|
||||
// const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement;
|
||||
// const messageElement = document.createElement("div");
|
||||
// messageElement.innerHTML =`🏓${invite.SenderName}: ${invite.innerHtml}`;
|
||||
// chatWindow.appendChild(messageElement);
|
||||
// chatWindow.scrollTop = chatWindow.scrollHeight;
|
||||
// });
|
||||
|
||||
|
||||
socket.on('blockUser', (blocked: ClientProfil) => {
|
||||
|
|
@ -413,9 +402,9 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
|
|||
const blockUserBtn = document.querySelector("#popup-b-block");
|
||||
if (blockUserBtn) {
|
||||
|
||||
console.log(' =================== >>> User State:', data.userState);
|
||||
console.log(' =================== >>> UserTarget:', data.userTarget);
|
||||
console.log(' =================== >>> By:', data.by);
|
||||
// console.log(' =================== >>> User State:', data.userState);
|
||||
// console.log(' =================== >>> UserTarget:', data.userTarget);
|
||||
// console.log(' =================== >>> By:', data.by);
|
||||
let message = "";
|
||||
if (data.userState === "block") {message = "un-block", blockMessage = true} else{message = "block", blockMessage = false}
|
||||
blockUserBtn.textContent = message;
|
||||
|
|
@ -427,7 +416,7 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
|
|||
quitChat(socket);
|
||||
});
|
||||
|
||||
socket.on('privMessageCopy', (message) => {
|
||||
socket.on('privMessageCopy', (message: string) => {
|
||||
addMessage(message);
|
||||
})
|
||||
|
||||
|
|
@ -485,8 +474,8 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
|
|||
const chatWindow = document.getElementById('t-chatbox') as HTMLDivElement;
|
||||
const sendtextbox = document.getElementById('t-chat-window') as HTMLButtonElement;
|
||||
const clearText = document.getElementById('b-clear') as HTMLButtonElement;
|
||||
const bwhoami = document.getElementById('b-whoami') as HTMLButtonElement;
|
||||
const bconnected = document.getElementById('b-help') as HTMLButtonElement;
|
||||
// const bwhoami = document.getElementById('b-whoami') as HTMLButtonElement;
|
||||
// const bconnected = document.getElementById('b-help') as HTMLButtonElement;
|
||||
const username = document.getElementById('username') as HTMLDivElement;
|
||||
const buddies = document.getElementById('div-buddies') as HTMLDivElement;
|
||||
const bquit = document.getElementById('b-quit') as HTMLDivElement;
|
||||
|
|
@ -532,9 +521,9 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
|
|||
case '@msg':
|
||||
broadcastMsg(socket, msgCommand);
|
||||
break;
|
||||
case '@who':
|
||||
whoami(socket);
|
||||
break;
|
||||
// case '@who':
|
||||
// whoami(socket);
|
||||
// break;
|
||||
case '@profil':
|
||||
getProfil(socket, msgCommand[1]);
|
||||
break;
|
||||
|
|
@ -601,9 +590,9 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
|
|||
|
||||
// Whoami button to display user name addMessage(msgCommand[0]);
|
||||
|
||||
bwhoami?.addEventListener('click', async () => {
|
||||
whoami(socket);
|
||||
});
|
||||
// bwhoami?.addEventListener('click', async () => {
|
||||
// whoami(socket);
|
||||
// });
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -11,7 +11,6 @@ export async function openProfilePopup(profil: ClientProfil) {
|
|||
</br>
|
||||
<div-login-name id="loginName"> Login ID: '${profil.userID ?? ''}' </div>
|
||||
</br>
|
||||
<button id="popup-b-clear" class="btn-style popup-b-clear">Clear Text</button>
|
||||
<button id="popup-b-invite" class="btn-style popup-b-invite">U Game ?</button>
|
||||
<button id="popup-b-block" class="btn-style popup-b-block">Block User</button>
|
||||
<div id="profile-about">About: '${profil.text}' </div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue