starnakin/42_ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chat functional

Browse Source
This commit is contained in:
Xamora
2023-12-15 20:32:43 +01:00
parent 7e2c29e78b
commit bcb072f7d9
16 changed files with 456 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

165
frontend/static/js/views/Search.js
View File

@ -1,5 +1,6 @@
import AbstractView from "./AbstractView.js";
import {client} from "../index.js";
import {Message} from "../api/chat/message.js"
export default class extends AbstractView {
constructor(params) {
@ -8,16 +9,20 @@ export default class extends AbstractView {
async postInit() {
let search = document.getElementById("form");
let search = document.getElementById("input_user");
search.addEventListener("input", this.users)
let chat_input = document.getElementById("input_chat");
//chat_input.addEventListener("keydown", this.chat_manager)
this.users();
this.chat();
}
async users() {
let search = document.getElementById("form").value;
let search = document.getElementById("input_user").value.toLowerCase();
let logged = await client.isAuthentificate();
@ -25,7 +30,7 @@ export default class extends AbstractView {
let list_users = document.getElementById('list_users');
list_users.innerHTML = "";
users.filter(user => user.username.startsWith(search) == true).forEach((user) => {
users.filter(user => user.username.toLowerCase().startsWith(search) == true).forEach((user) => {
var new_user = document.createElement("li");
// username
@ -38,20 +43,41 @@ export default class extends AbstractView {
new_user.appendChild(document.createTextNode(" "));
// chat
if (logged) {
let chat = document.createElement("a");
let array = [
client.me.user_id,
user.user_id,
];
console.log(client.me.id);
chat.addEventListener("click", async function(){
console.log("click");
await client.channels.createChannel([client.me.user_id , user.user_id]);
if (logged && client.me.user_id != user.user_id) {
let add_chat = document.createElement("a");
add_chat.addEventListener("click", async () => {
if (client.channel != undefined) {
client.channel.members_id.forEach((member_id) => {
if (member_id == user.user_id)
client.channel = undefined;
});
if (client.channel == undefined)
return this.hideChat();
client.channel.disconnect();
}
client.channel = await client.channels.createChannel([client.me.user_id , user.user_id], this.chat);
this.chat();
});
//chat.href = `/chat`
chat.appendChild(document.createTextNode("Chat"));
new_user.appendChild(chat);
add_chat.appendChild(document.createTextNode("Chat"));
new_user.appendChild(add_chat);
/*new_user.appendChild(document.createTextNode(" "));
let remove = document.createElement("a");
remove.addEventListener("click", async () => {
if (client.me.user_id != user.user_id) {
await client.channels.deleteChannel([client.me.user_id , user.user_id]);
if
client.channel.disconnect();
client.channel = undefined;
this.chat()
}
});
remove.appendChild(document.createTextNode("Remove"));
new_user.appendChild(remove);*/
}
// break line
@ -69,15 +95,112 @@ export default class extends AbstractView {
}
async chat() {
let logged = await client.isAuthentificate();
let reload = document.getElementById("messages");
if (reload != null)
reload.remove();
reload = document.getElementById("members");
if (reload != null)
reload.remove();
if (client.channel == undefined || !logged)
return ;
let chats = document.getElementById("chats");
if (document.getElementById("chat") == null) {
let chat = document.createElement("div");
chat.id = "chat";
chats.appendChild(chat);
}
// div des messages
let messages = document.createElement("div");
messages.id = "messages";
if (document.getElementById("input_chat") == null)
chat.appendChild(messages);
else
document.getElementById("input_chat").before(messages);
// Input pour rentrer un message
if (document.getElementById("input_chat") == null) {
let chat_input = document.createElement("input");
chat_input.id="input_chat";
chat_input.type="text";
chat_input.name="message";
chat_input.placeholder="message bozo";
chat_input.maxLength=255;
chat.appendChild(chat_input);
chat_input.addEventListener("keydown", async () => {
if (event.keyCode == 13 && client.channel != undefined) {
//let chat_input = document.getElementById("input_chat");
let chat_text = chat_input.value;
await client.channel.sendMessageChannel(chat_text)
// Reset
chat_input.value = "";
}
});
}
// nom des membres du chat
let users = await client.profiles.all();
let members = document.createElement("h2");
members.id = "members";
let usernames = "";
client.channel.members_id.forEach((member_id) => {
if (member_id != client.me.user_id) {
if (usernames.length > 0)
usernames += ", ";
usernames += (users.filter(user => user.user_id == member_id)[0].username);
}
});
members.appendChild(document.createTextNode(usernames));
messages.before(members);
// les messages
client.channel.messages.forEach((message) => {
let text = document.createElement("p");
text.appendChild(document.createTextNode(message.content));
if (message.author_id == client.me.user_id)
text.id = "you";
else
text.id = "other";
messages.appendChild(text);
});
}
async hideChat() {
let close = document.getElementById("chat");
if (close != null)
close.remove();
}
async leavePage() {
if (client.channel != undefined)
client.channel.disconnect();
client.channel = undefined
}
async getHtml() {
return `
<link rel="stylesheet" href="/static/css/search.css">
<input id="form" type="text" name="message" placeholder="userbozo"/>
<div id="users">
<ul id="list_users">
</ul>
<div id="chats">
<div id="users">
<input id="input_user" type="text" name="message" placeholder="userbozo"/>
<ul id="list_users">
</ul>
</div>
</div>
`;