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

profiles: online status and friend rework

Browse Source
This commit is contained in:
AdrienLSH
2024-05-07 19:53:28 +02:00
parent c2aafe9a42
commit 17bcee764b
9 changed files with 111 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/static/js/views/ProfilePageView.js
View File

@ -38,7 +38,8 @@ export default class extends AbstractView {
loadFriendshipStatus() {
const addFriendButton = document.getElementById('addFriendButton'),
removeFriendButton = document.getElementById('removeFriendButton');
removeFriendButton = document.getElementById('removeFriendButton'),
statusIndicator = document.getElementById('statusIndicator');
if (this.profile.hasIncomingRequest) {
removeFriendButton.classList.add('d-none');
@ -59,6 +60,12 @@ export default class extends AbstractView {
removeFriendButton.classList.add('d-none');
addFriendButton.classList.remove('d-none');
}
statusIndicator.classList.remove('bg-success', 'bg-danger');
if (this.profile.online === true)
statusIndicator.classList.add('bg-success');
else if (this.profile.online === false)
statusIndicator.classList.add('bg-danger');
}
async getHtml() {
@ -70,7 +77,7 @@ export default class extends AbstractView {
return `
<div>
<div class='mb-3' id='profileInfo'>
<h1>${this.username}</h1>
<h1>${this.username}<span id='statusIndicator' style='height:0.75em; width:0.75em' class='ms-2 rounded-circle border d-inline-block'></span></h1>
<a href=${this.profile.avatar} target='_blank'>
<img class='img-thumbnail' src=${this.profile.avatar} style='width:auto; max-height:20vh; min-height:10vh'>
</a>
@ -99,20 +106,18 @@ export default class extends AbstractView {
if (response.status === 200) {
removeFriendButton.innerHTML = 'Cancel Request';
removeFriendButton.classList.replace('btn-danger', 'btn-secondary');
client.me.outgoingFriendRequests.push(this.profile);
this.profile.hasOutgoingRequest = true;
} else if (response.status === 201) {
removeFriendButton.innerHTML = 'Remove Friend';
removeFriendButton.classList.replace('btn-secondary', 'btn-danger');
this.profile.friend = true;
this.profile.isFriend = true;
this.profile.hasIncomingRequest = false;
client.me.incomingFriendRequests = client.me.incomingFriendRequests.filter(profile => profile.id !== this.profile.id);
client.me.friendList.push(this.profile);
}
}
async removeFriend() {
const addFriendButton = document.getElementById('addFriendButton');
const addFriendButton = document.getElementById('addFriendButton'),
statusIndicator = document.getElementById('statusIndicator');
const response = await client._delete(`/api/profiles/friends/${this.profile.id}`);
const body = await response.json();
@ -121,14 +126,14 @@ export default class extends AbstractView {
if (response.ok) {
addFriendButton.innerHTML = 'Add Friend';
addFriendButton.classList.remove('d-none');
statusIndicator.classList.remove('bg-danger', 'bg-success');
document.getElementById('removeFriendButton').classList.add('d-none');
}
if (response.status === 200) {
this.profile.hasOutgoingRequest = false;
client.me.outgoingFriendRequests = client.me.outgoingFriendRequests.filter(profile => profile.id !== this.profile.id);
} else if (response.status === 201) {
this.profile.isFriend = false;
client.me.friendList = client.me.friendList.filter(friend => friend.id !== this.profile.id);
this.profile.online = null;
}
}