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

Merge pull request 'update malouze cooking' (#6) from main into malouze-cooking

Browse Source 
Reviewed-on: https://codeberg.org/adrien-lsh/ft_transcendence/pulls/6
This commit is contained in:
kbz_8
2024-02-14 17:53:57 +00:00
parent 6d7b52ae06 3433740d80
commit 0bd7e05c17
91 changed files with 2665 additions and 1360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
frontend/static/js/api/LanguageManager.js
View File

@ -1,45 +1,74 @@
import { reloadView } from '../index.js'
export default class LanguageManager {
constructor() {
this.availableLanguages = ['en', 'fr'];
this.availableLanguages = ['en', 'fr', 'tp', 'cr'];
this.dict = null;
this.currentLang = 'en'
this.chosenLang = localStorage.getItem('preferedLanguage') || this.currentLang;
if (this.chosenLang !== this.currentLang && this.availableLanguages.includes(this.chosenLang)) {
this.translatePage();
this.loading = this.translatePage();
this.currentLang = this.chosenLang;
} else {
this.loading = this.loadDict(this.chosenLang);
}
document.getElementById('languageDisplay').innerHTML =
document.querySelector(`#languageSelector > [value=${this.currentLang}]`)?.innerHTML;
}
async translatePage() {
if (this.currentLang === this.chosenLang)
return;
let dictUrl = `${location.origin}/static/js/lang/${this.chosenLang}.json`;
let translation = await fetch(dictUrl).then(response => {
if (response.status !== 200)
return null;
return response.json();
});
if (!translation) {
console.log(`No translation found for language ${this.chosenLang}`);
await this.loadDict(this.chosenLang);
if (!this.dict)
return 1;
}
document.querySelectorAll('[data-i18n]').forEach(el => {
let key = el.getAttribute('data-i18n');
el.innerHTML = translation[key];
el.innerHTML = this.dict[key];
})
await reloadView();
this.currentLang = this.chosenLang;
return 0;
}
async changeLanguage(lang) {
if (lang === this.currentLang || !this.availableLanguages.includes(lang))
return;
return 1;
this.chosenLang = lang;
if (await this.translatePage() !== 0)
return;
return 1;
this.currentLang = this.chosenLang;
localStorage.setItem('preferedLanguage', lang);
document.getElementById('languageDisplay').innerHTML =
document.querySelector(`#languageSelector > [value=${this.currentLang}]`)?.innerHTML;
return 0;
}
async loadDict(lang) {
let dictUrl = `${location.origin}/static/js/lang/${lang}.json`;
let response = await fetch(dictUrl);
if (response.status !== 200) {
console.log(`No translation found for language ${lang}`);
return;
}
this.dict = await response.json();
}
async waitLoading() {
await this.loading;
}
get(key, defaultTxt) {
if (!this.dict)
return defaultTxt;
return this.dict[key] || defaultTxt;
}
}

6
frontend/static/js/api/MyProfile.js
View File

@ -9,7 +9,7 @@ class MyProfile extends Profile
*/
constructor (client)
{
super(client, "me")
super(client, "../me")
}
/**
@ -19,7 +19,7 @@ class MyProfile extends Profile
*/
async change_avatar(form_data)
{
let response = await this.client._patch_file(`/api/profiles/me`, form_data);
let response = await this.client._patch_file(`/api/profiles/settings`, form_data);
let response_data = await response.json()
return response_data;
@ -27,4 +27,4 @@ class MyProfile extends Profile
}
export {MyProfile}
export {MyProfile}

11
frontend/static/js/api/account.js
View File

@ -16,19 +16,16 @@ class Account
/**
* @param {String} username
* @param {String} password
* @returns {?Promise<Object>}
* @returns {Response}
*/
async create(username, password)
{
let response = await this.client._post("/api/accounts/register", {username: username, password: password});
let response_data = await response.json()
if (response_data == "user created")
{
if (response.status === 201)
await this.client._update_logged(true);
return null;
}
return response_data
return response;
}
/**

268
frontend/static/js/api/chat/notice.js
View File

@ -1,3 +1,4 @@
import { navigateTo } from "../../index.js";
import {create_popup} from "../../utils/noticeUtils.js";
class Notice {
@ -5,11 +6,10 @@ class Notice {
this.client = client;
this.data = {};
// users online, invited by, asked friend by,
let data_variable = ["online", "invited", "asked"];
for (let i in data_variable) {
// users online, invited by ..., asked by ..., asker to ...
let data_variable = ["online", "invited", "asked", "asker"];
for (let i in data_variable)
this.data[data_variable[i]] = [];
}
this.connect();
@ -20,15 +20,20 @@ class Notice {
this.chatSocket = new WebSocket(url);
this.chatSocket.onmessage = (event) =>{
let data = JSON.parse(event.data);
//console.log("notice: ", data);
if (data.type == "invite")
this.receiveInvite(data);
else if (data.type == "online_users" || data.type == "disconnect")
this.receiveOnlineUser(data);
let send = JSON.parse(event.data);
//console.log("notice: ", send);
try {
this["receive_" + send.type](send);
}
catch (error) {
console.log("receive_" + send.type + ": Function not found");
}
}
this.chatSocket.onopen = (event) => {
this.getOnlineUser();
this.ask_friend();
}
}
@ -37,64 +42,126 @@ class Notice {
return ;
this.chatSocket.close();
}
async reconnect() {
this.disconnect();
this.connect();
}
async accept_invite(invitedBy) {
this.sendRequest({
type: "accept_invite",
targets: [invitedBy],
});
}
async sendInvite(id_inviter, id_inviteds) {
if (this.chatSocket == undefined)
return;
async receive_accept_invite(send) {
this.chatSocket.send(JSON.stringify({
this.data["invited"] = send.invites;
let id_game = send["id_game"];
navigateTo("/game/" + id_game);
}
async refuse_invite(invitedBy) {
this.sendRequest({
type: "refuse_invite",
targets: [invitedBy],
});
}
async receive_refuse_invite(send) {
this.data["invited"] = send.invites;
if (send.author_id == this.client.me.id) {
if (this.rewrite_invite !== undefined)
this.rewrite_invite();
}
else {
let sender = await this.client.profiles.getProfileId(send.author_id);
create_popup(sender.username + " refuse your invitation");
}
}
async send_invite(id_inviteds) {
this.sendRequest({
type: "invite",
targets: id_inviteds,
}));
time: new Date().getTime(),
});
}
async receiveInvite(data) {
async receive_invite(send) {
if (data.content === "notice return") {
if (data.status == 200) {
for (let target in data.targets)
this.data["invited"].push(target);
if (this.client.me == undefined)
return ;
let content = send.invites;
if (send.author_id == this.client.me.id) {
if (send.status == 200) {
for (let target in send.targets)
return create_popup("Invitation send");
}
else if (data.status == 404)
else if (send.status == 444)
return create_popup("User not connected");
else if (data.status == 409)
else if (send.status == 409)
return create_popup("Already invited");
}
else {
let sender = await this.client.profiles.getProfile(data.author_id);
this.inviter.push(data.author_id);
// Regarder qu'il est bien invité par l'auteur
// Et qu'il n'est pas déjà invité
if (!content.includes(send.author_id) ||
this.data["invited"].includes(send.author_id))
return;
this.data["invited"] = content;
let sender = await this.client.profiles.getProfileId(send.author_id);
create_popup("Invitation received by " + sender.username);
// Géré la reception de l'invitation
if (this.rewrite_invite !== undefined)
this.rewrite_invite();
}
}
async getOnlineUser() {
if (this.chatSocket == undefined)
return;
this.online_users = {};
this.chatSocket.send(JSON.stringify({
this.sendRequest({
type: "online_users",
targets: "all",
}));
targets: [],
time: new Date().getTime(),
});
}
async receiveOnlineUser(data) {
if (data.content !== undefined) {
async receive_online_users(send) {
let content = send.online;
if (content !== undefined) {
if (this.online_users.length > 0) {
if (this.data["online"].length > 0) {
// get all disconnect user
let disconnects = this.online_users.filter(id => !Object.keys(data.content).includes(id));
//let disconnects = this.data["online"].filter(id => !Object.keys(content).includes(id));
let disconnects = [];
for (const [key, value] of Object.entries(this.data["online"])) {
if (content[key] == "red" && value == "green")
disconnects.push(key);
}
// delete invite
this.data["invited"] = this.data["invited"].filter(id => !disconnects.includes(id));
@ -102,12 +169,139 @@ class Notice {
//console.log(this.data["invited"]);
}
this.data["online"] = Object.keys(data.content);
this.data["online"] = content;
if (this.rewrite_usernames !== undefined)
this.rewrite_usernames();
}
}
async ask_friend(user_id=undefined) {
this.sendRequest({
type: "ask_friend",
targets: [user_id],
time: new Date().getTime(),
});
}
async receive_ask_friend(send) {
let my_id = (this.client.me && this.client.me.id) || send.author_id;
if (send.author_id == my_id) {
if (send.status == 400)
create_popup("Friend ask error");
else if (send.status == 409)
create_popup("Already asked friend");
}
//if (!send.asked.includes(send.author_id) ||
//this.data["asked"].includes(send.author_id))
//return;
//if (!send.asker.includes(send.author_id) ||
//this.data["asker"].includes(send.author_id))
//return;
this.data["asked"] = send.asked;
this.data["asker"] = send.asker;
if (send.author_id != my_id) {
let sender = await this.client.profiles.getProfileId(send.author_id);
if (this.data["asker"].includes(send.author_id))
create_popup(sender.username + " ask you as friend");
if (this.rewrite_profile !== undefined)
await this.rewrite_profile();
}
}
async remove_friend(user_id) {
this.sendRequest({
type: "remove_friend",
targets: [user_id],
time: new Date().getTime(),
});
}
async receive_remove_friend(send) {
if (send.author_id == this.client.me.id) {
if (send.status == 400)
create_popup("Error remove Friend");
else if (send.status == 409)
create_popup("Not friend, wtf");
}
if (this.rewrite_profile !== undefined)
await this.rewrite_profile();
this.receive_online_users(send);
}
async accept_friend(user_id) {
this.sendRequest({
type: "accept_friend",
targets: [user_id],
time: new Date().getTime(),
});
}
async receive_accept_friend(send) {
this.data["asked"] = send.asked;
this.data["asker"] = send.asker;
let sender = await this.client.profiles.getProfileId(send.author_id);
if (send.author_id == this.client.me.id) {
if (send.status == 400)
create_popup("Error accept Friend");
else if (send.status == 404)
create_popup("Not found request Friend");
else if (send.status == 409)
create_popup("Already Friend, wtf");
}
else {
create_popup(sender.username + " accept your friend request");
}
if (this.rewrite_profile !== undefined)
await this.rewrite_profile();
this.receive_online_users(send);
}
async refuse_friend(user_id) {
this.sendRequest({
type: "refuse_friend",
targets: [user_id],
time: new Date().getTime(),
});
}
async receive_refuse_friend(send) {
this.data["asked"] = send.asked;
this.data["asker"] = send.asker;
let sender = await this.client.profiles.getProfileId(send.author_id);
if (send.author_id == this.client.me.id) {
if (send.status == 400)
create_popup("Error refuse Friend");
else if (send.status == 404)
create_popup("Not found request Friend");
else if (send.status == 409)
create_popup("Already Friend, WTF");
}
if (this.rewrite_profile !== undefined)
await this.rewrite_profile();
}
async sendRequest(content) {
if (this.chatSocket == undefined)
return;
this.chatSocket.send(JSON.stringify(content));
}
}
export {Notice}

12
frontend/static/js/api/client.js
View File

@ -53,7 +53,7 @@ class Client
this.tournaments = new Tourmanents(this);
/**
* @type {Boolean} A private var represent if the is is log NEVER USE IT use await isAuthentificated()
* @type {Boolean} A private var represent if the is is log NEVER USE IT use await isAuthenticated()
*/
this._logged = undefined;
@ -73,13 +73,14 @@ class Client
this.notice = new Notice(this);
this.lang = new LanguageManager;
}
/**
* The only right way to determine is the user is logged
* @returns {Promise<Boolean>}
*/
async isAuthentificate()
async isAuthenticated()
{
if (this._logged == undefined)
this._logged = await this._test_logged();
@ -114,7 +115,8 @@ class Client
headers: {
"Content-Type": "application/json",
"X-CSRFToken": getCookie("csrftoken"),
},
'Accept-Language': this.lang.currentLang,
},
body: JSON.stringify(data),
});
return response;
@ -190,6 +192,7 @@ class Client
{
this.me = new MyProfile(this);
await this.me.init();
this.notice.reconnect();
document.getElementById('navbarLoggedOut').classList.add('d-none');
document.getElementById('navbarLoggedIn').classList.remove('d-none');
document.getElementById('navbarDropdownButton').innerHTML = this.me.username;
@ -198,6 +201,7 @@ class Client
else
{
this.me = undefined;
this.notice.reconnect();
document.getElementById('navbarLoggedOut').classList.remove('d-none');
document.getElementById('navbarLoggedIn').classList.add('d-none');
document.getElementById('navbarDropdownButton').innerHTML = 'Me';
@ -232,7 +236,7 @@ class Client
}
/**
* Determine if the user is logged. NEVER USE IT, USE isAuthentificated()
* Determine if the user is logged. NEVER USE IT, USE isAuthenticated()
* @returns {Promise<Boolean>}
*/
async _test_logged()

105
frontend/static/js/api/game/Game.js
View File

@ -4,6 +4,7 @@ import { GameConfig } from "./GameConfig.js"
import { Player } from "./Player.js";
import { Time } from "./Time.js";
import { Wall } from "./Wall.js";
import { Client } from "../client.js";
class Game
{
@ -21,7 +22,7 @@ class Game
/**
*
* @returns {Number}
* @returns {Promise<Number>}
*/
async init()
{
@ -32,23 +33,52 @@ class Game
let response_data = await response.json();
/**
* @type {[Number]}
*/
this.players_id = response_data.players_id;
/**
* @type {String}
*/
this.state = response_data.state;
/**
* @type {Boolean}
*/
this.started = response_data.started;
/**
* @type {Boolean}
*/
this.finished = response_data.finished;
/**
* @type {Number}
*/
this.winner_id = this.finished ? response_data.winner_id : undefined;
if (this.finished === true)
return 0;
/**
* @type {GameConfig}
*/
this.config = new GameConfig(this.client);
let ret = await this.config.init();
if (ret !== 0)
return ret;
/**
* @type {Time}
*/
this.time = new Time();
this.last_pos = null
/**
* @type {Boolean}
*/
this._inited = false;
return 0;
@ -72,14 +102,14 @@ class Game
*
* @param {CanvasRenderingContext2D} ctx
*/
draw(ctx)
render(ctx)
{
if(ctx instanceof CanvasRenderingContext2D)
{
ctx.clearRect(0, 0, this.config.size_x, this.config.size_y);
}
this.draw_sides(ctx);
this.ball.draw(ctx);
this.ball.render(ctx);
}
_send(data)
@ -93,50 +123,25 @@ class Game
}
}
/**
* @param {Number} position
* @param {Number} time
*/
_send_paddle_position(position, time)
{
if (this.last_pos !== null && this.last_pos.time >= time)
return;
this.last_pos = {"time": time, "position": position};
this._send({"detail": "update_my_paddle_pos", ...this.last_pos});
}
_receive_player_join(player_data)
{
console.log(player_data)
let index = this.players.indexOf((player) => player.id === player_data.user_id);
this.players[index].is_connected = true;
}
_receive_player_leave(player_data)
{
let index = this.players.indexOf((player) => player.id === player_data.user_id);
this.players[index].is_connected = false;
}
_receive_update_ball(data)
{
this.ball.position_x = data.position_x
this.ball.position_y = data.position_y
this.ball.position_x = data.position_x
this.ball.position_x = data.position_x
this._send({"detail": "update_my_paddle_pos", ...{"time": time, "position": position}});
}
_receive_update_paddle(data)
{
let player = this.players.find((player) => player.id === data.user_id);
if (player === null)
{
this._receive_player_join(data);
return;
}
player.is_connected = data.is_connected;
player.update_pos(data.position.position, data.position.time);
player.from_json(data);
}
_receive_ball(data)
{
this.ball.from_json(data);
}
_receive(data)
@ -144,26 +149,30 @@ class Game
if (data.detail === "update_paddle")
this._receive_update_paddle(data);
else if (data.detail === "update_ball")
this._receive_update_ball(data);
this._receive_ball(data)
else if (data.detail === "init_game")
this._init_game(data)
else if (data.detail === "player_join")
this._receive_player_join(data)
else if (data.detail === "player_leave")
this._receive_player_leave(data)
this._init_game(data);
}
_init_game(data)
{
const ball_data = data.ball;
this.ball = new Ball(this, ball_data.position_x, ball_data.position_y, ball_data.velocity_x, ball_data.velocity_y);
/**
* @type {Ball}
*/
this.ball = (new Ball(this)).from_json(data.ball)
/**
* @type {[Wall]}
*/
this.walls = [];
const walls_data = data.walls;
walls_data.forEach((wall_data) => {
this.walls.push(new Wall().from_json(wall_data));
});
/**
* @type {[Player]}
*/
this.players = []
const players_data = data.players;
players_data.forEach((player_data) => {

5
frontend/static/js/api/game/GameConfig.js
View File

@ -24,14 +24,17 @@ class GameConfig
* @type {Number}
*/
this.size_x = response_data.MAP_SIZE_X;
/**
* @type {Number}
*/
this.size_y = response_data.MAP_SIZE_Y;
/**
* @type {Number}
*/
this.center_x = this.size_x / 2;
/**
* @type {Number}
*/
@ -63,10 +66,12 @@ class GameConfig
* @type {Number}
*/
this.ball_size = response_data.BALL_SIZE;
/**
* @type {Number}
*/
this.ball_spawn_x = this.center_x;
/**
* @type {Number}
*/

24
frontend/static/js/api/game/Segment.js
View File

@ -9,8 +9,32 @@ class Segment
*/
constructor(start, stop)
{
/**
* @type {Point}
*/
this.start = start === undefined ? new Point() : start;
/**
* @type {Point}
*/
this.stop = stop === undefined ? new Point() : stop;
}
angle()
{
let x = this.start.x - this.stop.x,
y = this.start.y - this.stop.y;
return Math.atan2(y, x);
}
len()
{
let x = this.start.x - this.stop.x,
y = this.start.y - this.stop.y;
return (x ** 2 + y ** 2) ** (1 / 2);
}
/**

4
frontend/static/js/api/game/Time.js
View File

@ -17,7 +17,9 @@ class Time
deltaTime()
{
return (this._current_frame - this._last_frame) !== NaN ? this._current_frame - this._last_frame : 0;
if (this._last_frame === undefined)
return 0;
return (this._current_frame - this._last_frame);
}
deltaTimeSecond()

2
frontend/static/js/api/matchmaking.js
View File

@ -23,7 +23,7 @@ class MatchMaking
*/
async start(receive_func, disconnect_func, mode)
{
if (!await this.client.isAuthentificate())
if (!await this.client.isAuthenticated())
return null;
let url = `${window.location.protocol[4] === 's' ? 'wss' : 'ws'}://${window.location.host}/ws/matchmaking/${mode}`;

45
frontend/static/js/api/profile.js
View File

@ -5,7 +5,7 @@ class Profile
/**
* @param {Client} client
*/
constructor (client, username, id = undefined, avatar_url = undefined)
constructor (client, username=undefined, id=undefined, avatar_url=undefined)
{
/**
* @type {Client} client
@ -31,6 +31,7 @@ class Profile
* @type {Boolean}
*/
this.isBlocked = false;
this.isFriend = false;
}
/**
@ -39,7 +40,11 @@ class Profile
*/
async init()
{
let response = await this.client._get(`/api/profiles/${this.username}`);
let response;
if (this.username !== undefined)
response = await this.client._get(`/api/profiles/user/${this.username}`);
else
response = await this.client._get(`/api/profiles/id/${this.id}`);
if (response.status !== 200)
return response.status;
@ -47,25 +52,49 @@ class Profile
let response_data = await response.json();
this.id = response_data.user_id;
this.username = response_data.username;
this.avatar_url = response_data.avatar_url;
this.avatar_url = response_data.avatar;
if (this.client.me == undefined)
return;
await this.getBlock();
await this.getFriend();
}
async getBlock() {
let block_response = await this.client._get("/api/profiles/block");
if (block_response.status != 200)
return
let block_data = await block_response.json();
let block_list = JSON.parse(block_data);
let block_list = JSON.parse(block_data["blockeds"]);
let client_id = block_data["user_id"];
block_list.forEach(block => {
let blocker = block.fields.blocker;
let blocked = block.fields.blocked;
if (blocker == this.client.me.user_id && blocked == user_id)
if (blocker == client_id && blocked == this.id)
return this.isBlocked = true;
});
}
async getFriend() {
let friend_response = await this.client._get("/api/profiles/friend");
this.isFriend = false;
if (friend_response.status != 200)
return this.isFriend;
let friend_data = await friend_response.json();
let friends_list = friend_data["friends"];
let client_id = friend_data["user_id"];
friends_list.forEach(friend => {
if (friend == this.id) {
this.isFriend = true;
return this.isFriend;
}
});
return this.isFriend;
}
}
export {Profile}

16
frontend/static/js/api/profiles.js
View File

@ -24,7 +24,7 @@ class Profiles
let profiles = []
response_data.forEach((profile) => {
profiles.push(new Profile(this.client, profile.username, profile.user_id, profile.avatar_url))
profiles.push(new Profile(this.client, profile.username, profile.user_id, profile.avatar))
});
return profiles;
}
@ -32,7 +32,7 @@ class Profiles
/**
*
* @param {String} username
* @returns {?Profile}
* @returns {?Promise<Profile>}
*/
async getProfile(username)
{
@ -42,6 +42,14 @@ class Profiles
return profile;
}
async getProfileId(id)
{
let profile = new Profile(this.client, undefined, id);
if (await profile.init())
return null;
return profile;
}
/**
* Block a user
* @param {Number} user_id
@ -51,7 +59,7 @@ class Profiles
// blocker & blocked
let response = await this.client._post("/api/profiles/block", {
users_id:[this.client.me.user_id, user_id],
users_id:[this.client.me.id, user_id],
});
let data = await response.json();
@ -68,7 +76,7 @@ class Profiles
// blocker & blocked
let response = await this.client._delete("/api/profiles/block", {
users_id:[this.client.me.user_id, user_id],
users_id:[this.client.me.id, user_id],
});
let data = await response.json();

2
frontend/static/js/api/tournament/tournament.js
View File

@ -120,7 +120,7 @@ class Tourmanent
*/
async join(receive_func, disconnect_func)
{
if (!await this.client.isAuthentificate())
if (!await this.client.isAuthenticated())
return null;
let url = `${window.location.protocol[4] === 's' ? 'wss' : 'ws'}://${window.location.host}/ws/tournaments/${this.id}`;