4nk/ihm_client
5
0
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases Wiki Activity

js_chat_ko

Browse Source
This commit is contained in:
Pascal 2025-01-07 19:27:47 +01:00
parent 0c02c30c1e
commit be112a7579
1 changed files with 20 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/pages/chat/chat.ts
View File

@ -230,12 +230,10 @@ class ChatElement extends HTMLElement {
// Send a messsage
private sendMessage() {
const messageInput = this.shadowRoot?.querySelector('#message-input') as HTMLInputElement;
if (!messageInput) return;
if (!messageInput || !this.selectedMemberId) return;
const messageText = messageInput.value.trim();
if (messageText === '' || this.selectedMemberId === null) {
return;
}
if (messageText === '') return;
const newMessage: Message = {
id: Date.now(),
@ -255,7 +253,13 @@ class ChatElement extends HTMLElement {
// Automatic response after 2 seconds
setTimeout(() => {
if (this.selectedMemberId) {
const autoReply = this.generateAutoReply(`Member ${this.selectedMemberId}`);
const autoReply = {
id: Date.now(),
sender: "Member",
text: "OK...",
time: new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }),
type: 'text' as const
};
messageStore.addMessage(this.selectedMemberId, autoReply);
this.messagesMock = messageStore.getMessages();
this.loadMemberChat(this.selectedMemberId);
@ -271,45 +275,34 @@ class ChatElement extends HTMLElement {
// Load the list of members
private loadMemberChat(memberId: string | number) {
private async loadMemberChat(memberId: string | number) {
this.selectedMemberId = String(memberId);
const memberMessages = this.messagesMock.find(m => String(m.memberId) === String(memberId));
// Find the process and the role of the member
let memberInfo = { processName: '', roleName: '', memberName: '' };
groupsMock.forEach(process => {
process.roles.forEach(role => {
const member = role.members.find(m => String(m.id) === String(memberId));
if (member) {
memberInfo = {
processName: process.name,
roleName: role.name,
memberName: member.name
};
}
});
});
const chatHeader = this.shadowRoot?.querySelector('#chat-header');
const messagesContainer = this.shadowRoot?.querySelector('#messages');
if (!chatHeader || !messagesContainer) return;
chatHeader.textContent = `Chat with ${memberInfo.roleName} ${memberInfo.memberName} from ${memberInfo.processName}`;
const memberAddress = String(memberId);
const emojis = await addressToEmoji(memberAddress);
chatHeader.textContent = `Chat with ${emojis}`;
messagesContainer.innerHTML = '';
if (memberMessages) {
memberMessages.messages.forEach((message: Message) => {
for (const message of memberMessages.messages) {
const messageElement = document.createElement('div');
messageElement.className = 'message-container';
const messageContent = document.createElement('div');
messageContent.className = 'message';
if (message.type === 'file') {
messageContent.innerHTML = `<a href="${message.fileData}" download="${message.fileName}" target="_blank">${message.fileName}</a>`;
messageContent.classList.add('user');
} else {
messageContent.innerHTML = `<strong>${message.sender}</strong>: ${message.text} <span style="float: right;">${message.time}</span>`;
const senderEmojis = await addressToEmoji(memberAddress);
messageContent.innerHTML = `<strong>${senderEmojis}</strong>: ${message.text} <span style="float: right;">${message.time}</span>`;
if (message.sender === "4NK") {
messageContent.classList.add('user');
}
@ -317,10 +310,9 @@ class ChatElement extends HTMLElement {
messageElement.appendChild(messageContent);
messagesContainer.appendChild(messageElement);
});
}
}
this.scrollToBottom(messagesContainer);
}
@ -344,12 +336,7 @@ class ChatElement extends HTMLElement {
const memberContainer = document.createElement('div');
memberContainer.className = 'member-container';
// Afficher l'adresse SP
const addressSpan = document.createElement('span');
addressSpan.className = 'member-address';
addressSpan.textContent = member.sp_addresses?.[0] || 'No address';
// Ajouter les emojis pour l'adresse
const emojiSpan = document.createElement('span');
emojiSpan.className = 'member-emoji';
if (member.sp_addresses?.[0]) {
@ -357,7 +344,6 @@ class ChatElement extends HTMLElement {
emojiSpan.textContent = emojis;
}
memberContainer.appendChild(addressSpan);
memberContainer.appendChild(emojiSpan);
memberItem.appendChild(memberContainer);
@ -483,10 +469,8 @@ class ChatElement extends HTMLElement {
nameSpan.textContent = `Process : `;
nameSpan.className = 'process-name';
// Ajouter d'abord le nom
container.appendChild(nameSpan);
// Puis ajouter les emojis
await addressToEmoji(processId).then(emojis => {
const emojiSpan = document.createElement('span');
emojiSpan.className = 'process-emoji';
@ -496,7 +480,6 @@ class ChatElement extends HTMLElement {
li.appendChild(container);
// Créer et ajouter la liste des rôles
const roleList = document.createElement('ul');
roleList.className = 'role-list';
@ -511,7 +494,6 @@ class ChatElement extends HTMLElement {
roleNameSpan.className = 'role-name';
roleNameSpan.textContent = roleName;
// Ajouter l'événement de clic
roleContainer.addEventListener('click', (event) => {
event.stopPropagation();
this.toggleMembers(roles[roleName], roleItem);