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

etienne apprend à coder pitié

Browse Source
This commit is contained in:
AdrienLSH
2024-05-14 08:16:21 +02:00
parent c4dc5b4e39
commit e2d56cff85
9 changed files with 126 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/static/js/api/Client.js
View File

@ -1,9 +1,15 @@
import { Account } from "./Account.js";
import { MatchMaking } from "./Matchmaking.js";
import { Profiles } from "./Profiles.js";
import { Channels } from './chat/Channels.js';
import { MyProfile } from "./MyProfile.js";
<<<<<<< Updated upstream
import { Channel } from "./chat/Channel.js";
||||||| Stash base
import { Tourmanents } from "./tournament/Tournaments.js";
import { Channel } from "./chat/Channel.js";
=======
import { Tourmanents } from "./tournament/Tournaments.js";
>>>>>>> Stashed changes
import Notice from "./Notice.js";
import LanguageManager from './LanguageManager.js';
@ -50,16 +56,6 @@ class Client
*/
this._logged = undefined;
/**
* @type {Channels}
*/
this.channels = new Channels(this);
/**
* @type {Channel}
*/
this.channel = undefined;
/**
* @type {Notice}
*/

45
frontend/static/js/api/chat/Channel.js
View File

@ -1,10 +1,10 @@
import {Message} from "./Message.js";
class Channel {
constructor(client, channel_id, members_id, messages, reload) {
constructor(client, channel, members, messages, reload) {
this.client = client;
this.channel_id = channel_id;
this.members_id = members_id;
this.channel = channel;
this.members = members;
this.messages = [];
if (messages != undefined)
this.updateMessages(messages);
@ -13,16 +13,18 @@ class Channel {
}
// reload = function to use when we receive a message
async connect(reload) {
let url = `${window.location.protocol[4] === 's' ? 'wss' : 'ws'}://${window.location.host}/ws/chat/${this.channel_id}`;
connect(reload) {
const url = location.origin.replace('http', 'ws') +
'/ws/chat/' +
this.channel;
this.chatSocket = new WebSocket(url);
this.chatSocket.onmessage = (event) =>{
let data = JSON.parse(event.data);
this.messages.push(new Message(
this.channel_id,
data.author_id,
this.channel,
data.author,
data.content,
data.time,
));
@ -31,28 +33,22 @@ class Channel {
};
}
async disconnect() {
disconnect() {
this.chatSocket.close();
}
updateMessages(messages)
{
messages = JSON.parse(messages);
let new_messages = [];
this.messages = [];
messages.forEach((message) => {
message = message.fields;
new_messages.push(new Message(
message.channel_id,
message.author_id,
this.messages.push(new Message(
message.channel,
message.author,
message.content,
message.time,
));
});
//console.log(new_messages);
this.messages = new_messages;
return new_messages;
}
async sendMessageChannel(message, receivers_id) {
@ -65,19 +61,6 @@ class Channel {
'receivers_id':receivers_id,
}));
}
async deleteChannel() {
let response = await this.client._delete("/api/chat/" + this.channel_id, {
});
let data = await response.json();
return data;
}
async sendInvite() {
}
}
export {Channel};

26
frontend/static/js/api/chat/Channels.js
View File

@ -1,6 +1,6 @@
import {Channel} from "./Channel.js";
class Channels {
export default class Channels {
constructor(client) {
this.client = client;
this.channel = undefined;
@ -8,32 +8,16 @@ class Channels {
async createChannel(members_id, reload) {
let response = await this.client._post("/api/chat/", {
const response = await this.client._post("/api/chat/", {
members_id:members_id
});
if (response.status >= 300)
return undefined;
let data = await response.json();
const data = await response.json();
console.log(data)
let messages;
if (response.status == 200)
messages = data.messages;
this.channel = new Channel(this.client, data.channel_id, members_id, messages, reload);
return this.channel;
this.channel = new Channel(this.client, data.id, members_id, data.messages, reload);
}
async deleteChannel(members_id) {
let response = await this.client._delete("/api/chat/", {
members_id:members_id
});
let data = await response.json();
return data;
}
}
export {Channels};

6
frontend/static/js/api/chat/Message.js
View File

@ -1,7 +1,7 @@
class Message {
constructor(channel_id, author_id, content, time) {
this.channel_id = channel_id;
this.author_id = author_id;
constructor(channel, author, content, time) {
this.channel = channel;
this.author = author;
this.content = content;
this.time = time;
}

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

@ -1,35 +1,37 @@
import AbstractView from "./abstracts/AbstractView.js";
import { client, lang } from "../index.js";
import {Message} from "../api/chat/Message.js";
import Channels from '../api/chat/Channels.js'
export default class extends AbstractView {
constructor(params) {
super(params, 'SearchWindowTitle');
}
constructor(params) {
super(params, 'SearchWindowTitle');
this.channelManager = new Channels(client);
}
async postInit() {
this.profiles = await client.profiles.all();
this.logged = await client.isAuthenticated();
this.logged = await client.isAuthenticated();
this.profiles = await client.profiles.all();
document.getElementById('username-input').oninput = () => this.display_users(this.logged, this.profiles);
let search = document.getElementById("input_user");
if (search != undefined)
search.oninput = () => this.display_users();
let chat_input = document.getElementById("input_chat");
this.last_add_chat = undefined;
this.display_users();
this.display_chat();
}
async display_users() {
let search = document.getElementById("input_user").value.toLowerCase();
const search = document.getElementById("username-input").value.toLowerCase();
let list_users = document.getElementById('list_users');
let list_users = document.getElementById('user-list');
list_users.innerHTML = "";
this.profiles.filter(user => user.username.toLowerCase().startsWith(search) == true).forEach(async (user) => {
@ -69,23 +71,23 @@ export default class extends AbstractView {
let add_chat = document.createElement("a");
add_chat.id = "add_chat_off";
add_chat.onclick = async () => {
if (client.channels.channel != undefined) {
if (this.channelManager.channel != undefined) {
// Permet de savoir si c'est le même channel
// Check to know if it's the same channel
client.channels.channel.members_id.forEach((member_id) => {
this.channelManager.channel.members_id.forEach((member_id) => {
if (member_id == user.id)
client.channels.channel = undefined;
this.channelManager.channel = undefined;
});
if (client.channels.channel == undefined) {
if (this.channelManager.channel == undefined) {
add_chat.id = "add_chat_off";
this.last_add_chat = undefined;
return await this.hide_chat();
}
await client.channels.channel.disconnect();
await this.channelManager.channel.disconnect();
}
client.channels.channel = await client.channels.createChannel([client.me.id , user.id], () => this.reload_display_messages());
await this.channelManager.createChannel([client.me.id , user.id], () => this.reload_display_messages());
this.display_chat();
if (this.last_add_chat != undefined)
this.last_add_chat.id = "add_chat_off";
@ -141,7 +143,7 @@ export default class extends AbstractView {
document.getElementById(reload).remove();
});
if (client.channels.channel === undefined || this.logged === false)
if (this.channelManager.channel === undefined || this.logged === false)
return ;
let chats = document.getElementById("chats");
@ -159,19 +161,19 @@ export default class extends AbstractView {
let messages = await this.display_messages(chat);
// Input pour rentrer un message
let chat_input = document.getElementById("input_chat") || document.createElement("input");
chat_input.id="input_chat";
let chat_input = document.getElementById("chat-input") || document.createElement("input");
chat_input.id="chat_input";
chat_input.type="text";
chat_input.name="message";
chat_input.placeholder="message bozo";
chat_input.maxLength=255;
chat.appendChild(chat_input);
let members_id = client.channels.channel.members_id;
let members_id = this.channelManager.channel.members_id;
chat_input.onkeydown = async () => {
if (event.keyCode == 13 && client.channels.channel != undefined) {
//let chat_input = document.getElementById("input_chat");
if (event.keyCode == 13 && this.channelManager.channel != undefined) {
//let chat_input = document.getElementById("chat-input");
let chat_text = chat_input.value;
let receivers_id = [];
@ -179,7 +181,7 @@ export default class extends AbstractView {
if (member_id != client.me.id)
receivers_id.push(this.profiles.filter(user => user.id == member_id)[0].id);
});
await client.channels.channel.sendMessageChannel(chat_text, receivers_id);
await this.channelManager.channel.sendMessageChannel(chat_text, receivers_id);
// Reset
chat_input.value = "";
}
@ -190,7 +192,7 @@ export default class extends AbstractView {
// Scroll to the bottom of messages
messages.scrollTop = messages.scrollHeight;
this.display_invite();
// this.display_invite();
}
@ -202,12 +204,13 @@ export default class extends AbstractView {
chat.appendChild(messages);
// les messages, réecriture seulement du dernier
client.channels.channel.messages.forEach((message) => {
this.channelManager.channel.messages.forEach((message) => {
let text = document.createElement("p");
let date = new Date(message.time);
text.title = date.toLocaleString("fr-FR");
text.appendChild(document.createTextNode(message.content));
text.id = message.author_id === client.me.id ? "you" : "other";
console.log(message.author, client.me.id)
text.id = message.author === client.me.id ? "you" : "other";
messages.appendChild(text);
});
@ -219,13 +222,13 @@ export default class extends AbstractView {
let messages = document.getElementById("messages");
let i = 0;
client.channels.channel.messages.forEach((message) => {
this.channelManager.channel.messages.forEach((message) => {
if (messages.children[i] == null || message.content != messages.children[i].innerText) {
let text = document.createElement("p");
let date = new Date(message.time);
text.title = date.toLocaleString("fr-FR");
text.appendChild(document.createTextNode(message.content));
text.id = message.author_id === client.me.id ? "you" : "other";
text.id = message.author === client.me.id ? "you" : "other";
messages.appendChild(text);
}
@ -237,7 +240,7 @@ export default class extends AbstractView {
async display_members(chat) {
let members_id = client.channels.channel.members_id;
let members_id = this.channelManager.channel.members_id;
let members = document.createElement("h2");
members.id = "members";
@ -263,7 +266,7 @@ export default class extends AbstractView {
if (chat == undefined)
return ;
let members_id = client.channels.channel.members_id;
let members_id = this.channelManager.channel.members_id;
let others = members_id.filter(id => id !== client.me.id);
let invite = document.getElementById("invite") || document.createElement("button");
@ -325,9 +328,9 @@ export default class extends AbstractView {
}
async leavePage() {
if (client.channels.channel != undefined)
client.channels.channel.disconnect();
client.channels.channel = undefined;
if (this.channelManager.channel != undefined)
this.channelManager.channel.disconnect();
this.channelManager.channel = undefined;
}
@ -337,8 +340,8 @@ export default class extends AbstractView {
<div id="chats">
<div id="users">
<input id="input_user" type="text" name="message" placeholder="userbozo"/>
<ul id="list_users">
<input id="username-input" type="text" name="message" placeholder="userbozo"/>
<ul id='user-list'>
</ul>
</div>
</div>