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

core: refonte profile

Browse Source
This commit is contained in:
starnakin
2023-12-16 16:42:30 +01:00
parent 51059e6bf3
commit 1f41e62a86
12 changed files with 154 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

128
frontend/static/js/views/MeView.js
View File

@ -1,4 +1,5 @@
import { client, navigateTo } from "../index.js";
import { clear, fill_errors } from "../utils/formUtils.js";
import AbstractAuthentificateView from "./AbstractAuthentifiedView.js";
export default class extends AbstractAuthentificateView
@ -10,63 +11,39 @@ export default class extends AbstractAuthentificateView
async postInit()
{
if (this.fill() === null)
return;
document.getElementById("save-account-button").onclick = this.acccount_save;
document.getElementById("delete-account-button").onclick = this.account_delete_accounts;
document.getElementById("save-account-button").onclick = this.save_account;
document.getElementById("delete-account-button").onclick = this.delete_account;
document.getElementById("save-profile-button").onclick = this.save_profile;
}
async fill()
async delete_account()
{
let data = await client.account.get();
if (data === null)
{
navigateTo("/login")
return;
}
document.getElementById("username").value = data.username;
}
async delete_accounts()
{
let current_password = document.getElementById("current_password").value;
let current_password = document.getElementById("current_password-input").value;
let response_data = await client.account.delete(current_password);
if (response_data === null)
console.log(await client.isAuthentificate())
if (response_data === null || response_data === "user deleted")
{
navigateTo("/login");
return;
}
["delete", "current_password"].forEach(error_field => {
let error_display = document.getElementById(`error_${error_field}`);
if (error_display != null)
error_display.innerHTML = "";
});
if (response_data === "user deleted")
{
document.getElementById(`error_delete`).innerHTML = "OK";
navigateTo("/login")
return;
}
document.getElementById("error_current_password").innerHTML = response_data["password"]
clear("innerHTML", ["current_password-input"])
fill_errors({"current_password-input": response_data["password"]}, "innerHTML")
}
async save()
async save_account()
{
let username = document.getElementById("username").value;
let new_password = document.getElementById("new_password").value;
let current_password = document.getElementById("current_password").value;
let username = document.getElementById("username-input").value;
let new_password = document.getElementById("new_password-input").value;
let current_password = document.getElementById("current_password-input").value;
let data = {};
data.username = username;
if (new_password.length != 0)
data.new_password = new_password;
let response_data = await client.account.update(data, current_password);
if (response_data === null)
@ -74,58 +51,55 @@ export default class extends AbstractAuthentificateView
navigateTo("/login");
return;
}
else if (response_data === "data has been alterate")
{
navigateTo("/me");
return;
}
if (response_data === "data has been alterate")
response_data = {"save-account": "saved"}
clear("innerHTML", ["username", "new_password", "current_password", "save-account", "delete-account"])
fill_errors(response_data, "innerHTML")
}
["username", "new_password", "current_password"].forEach(error_field => {
let error_display = document.getElementById(`error_${error_field}`);
if (error_display != null)
error_display.innerHTML = "";
});
Object.keys(response_data).forEach(error_field => {
let error_display = document.getElementById(`error_${error_field}`);
if (error_display != null)
error_display.innerHTML = response_data[error_field];
});
let avatar = document.getElementById("avatar");
async save_profile()
{
let avatar = document.getElementById("avatar-input");
if (avatar.files[0] !== undefined)
{
let form_data = new FormData();
form_data.append("file", avatar.files[0]);
await client.me.change_avatar(form_data)
await client.me.change_avatar(form_data);
}
document.getElementById("save-profile").innerHTML = "Saved";
}
async getHtml()
{
return `
<link rel="stylesheet" href="static/css/me.css">
<link rel="stylesheet" href="/static/css/me.css">
<h1>ME</h1>
<div class="account">
<h3>Account</h3>
<input type="text" placeholder="username" id="username">
<span id="error_username"></span>
<input type=password placeholder="new password" id="new_password">
<span id="error_new_password"></span>
<input type=password placeholder="current password" id="current_password">
<span id="error_current_password"></span>
<input type="button" value="Save Credentials" id="save-account-button">
<span id="error_save"></span>
<input type="button" value="Delete Account" id="delete-account-button">
<span id="error_delete"></span>
<div id="main">
<div class="account">
<h3>Account</h3>
<input type="text" placeholder="username" id="username-input" text=${client.me.username}>
<span id="username"></span>
<input type=password placeholder="new_password" id="new_password-input">
<span id="new_password"></span>
<input type=password placeholder="current_password" id="current_password-input">
<span id="current_password"></span>
<input type="button" value="Save Credentials" id="save-account-button">
<span id="save-account"></span>
<input type="button" value="Delete Account" id="delete-account-button">
<span id="delete-account"></span>
</div>
<div class="profile">
<h3>Profile</h3>
<input type="file" id="avatar-input" accept="image/png, image/jpeg">
<input type="button" value="Save profile" id="save-profile-button">
<span id="save-profile"></span>
</div>
<a href="/logout" class="nav__link" data-link>Logout</a>
</div>
<div class="profile">
<h3>Profile</h3>
<input type="file" id="avatar" accept="image/png, image/jpeg">
<input type="button" value="Save profile" id="save-profile-button">
<span id="error_save"></span>
</div>
<a href="/logout" class="nav__link" data-link>Logout</a>
`;
}
}