tom/METH_Transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Site

Browse Source 
- add bar/goal selector on all gamemode in lobby page
    - fix three js warn on lobby page
    - fix history on profil page
This commit is contained in:
Kum1ta
2024-10-01 00:46:41 +02:00
parent 3ed6224d5c
commit 54da3fb923
9 changed files with 77 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
docker-compose/requirements/djangoserver/file/server/server/templates/lobbyPage.html
View File

@ -91,10 +91,10 @@
</div> </div>
<div class="skin-select"> <div class="skin-select">
<div id="bar"> <div class="barSelection" id="bar">
</div> </div>
<div id="goal"> <div class="goalSelection" id="goal">
</div> </div>
</div> </div>
@ -102,23 +102,38 @@
<div class="menuSelected" id="rankedSelected"> <div class="menuSelected" id="rankedSelected">
<div id="whatGame"> <div id="whatGame">
<p>Bonsoir non ?</p> <p>AAAAAAAAAA</p>
<span class="line"></span>
<p>BBBBBBBBBB</p>
</div> </div>
<div class="skin-select"> <div class="skin-select">
<!-- Make sure you have ids and classes to make multiple "bars" and "goals" --> <div class="barSelection" id="bar1">
</div>
<div class="goalSelection" id="goal1">
</div>
</div> </div>
</div> </div>
<div class="menuSelected" id="tournamentSelected"> <div class="menuSelected" id="tournamentSelected">
<div id="whatGame"> <div id="whatGame">
<p>Bonsoir non ?</p> <p>CCCCCCCCCC</p>
<span class="line"></span>
<p>DDDDDDDDDD</p>
</div> </div>
<div class="skin-select"> <div class="skin-select">
<!-- Make sure you have ids and classes to make multiple "bars" and "goals" --> <div class="barSelection" id="bar2">
</div>
<div class="goalSelection" id="goal2">
</div>
</div> </div>
</div> </div>
<!--------------------- END OF CHANGES --------------------->
</div> </div>
</div> </div>
<div class="bottom"> <div class="bottom">

2
docker-compose/requirements/djangoserver/file/server/server/templates/profilPage.html
View File

@ -28,7 +28,7 @@
</div> </div>
</div> </div>
<div class="history" id="history"> <div class="history" id="history">
<h3>History</h3> <h3 style="margin-top: 20px;">History</h3>
<div id="scroll-match"></div> <div id="scroll-match"></div>
</div> </div>
</div> </div>

4
docker-compose/requirements/nginx/static/javascript/filesLoader.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/09/29 22:36:43 by edbernar #+# #+# */ /* Created: 2024/09/29 22:36:43 by edbernar #+# #+# */
/* Updated: 2024/09/30 00:56:01 by edbernar ### ########.fr */ /* Updated: 2024/09/30 23:08:59 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -67,8 +67,6 @@ async function loadFiles()
loadBar.style.width = value; loadBar.style.width = value;
await sleep(50); await sleep(50);
} }
console.log(Object.values(files).length * 100 / Object.values(url_files).length + '%');
console.log('files loaded :', files);
} }
export { files, loadFiles }; export { files, loadFiles };

5
docker-compose/requirements/nginx/static/javascript/home3D/home3D.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/22 17:19:17 by edbernar #+# #+# */ /* Created: 2024/08/22 17:19:17 by edbernar #+# #+# */
/* Updated: 2024/09/30 14:01:36 by edbernar ### ########.fr */ /* Updated: 2024/09/30 23:07:19 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -430,8 +430,7 @@ function moveCamera()
const distance = camera.position.distanceTo(screen.tv.position); const distance = camera.position.distanceTo(screen.tv.position);
camera.position.copy(position); camera.position.copy(position);
console.log(distance); if (position.equals(targetPosition) || distance < 1)
if (position.equals(targetPosition) || distance < 0.15)
{ {
pageRenderer.changePage('lobbyPage'); pageRenderer.changePage('lobbyPage');
return ; return ;

8
docker-compose/requirements/nginx/static/javascript/lobbyPage/3d.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/09/13 13:59:46 by edbernar #+# #+# */ /* Created: 2024/09/13 13:59:46 by edbernar #+# #+# */
/* Updated: 2024/09/29 23:24:39 by edbernar ### ########.fr */ /* Updated: 2024/09/30 23:53:04 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -131,7 +131,10 @@ class barSelecter
dispose() dispose()
{ {
if (this.renderer) if (this.renderer)
{
this.renderer.dispose(); this.renderer.dispose();
this.renderer.forceContextLoss();
}
this.renderer = null; this.renderer = null;
if (this.scene) if (this.scene)
{ {
@ -197,7 +200,10 @@ class goalSelecter
dispose() dispose()
{ {
if (this.renderer) if (this.renderer)
{
this.renderer.dispose(); this.renderer.dispose();
this.renderer.forceContextLoss();
}
this.renderer = null; this.renderer = null;
if (this.scene) if (this.scene)
{ {

28
docker-compose/requirements/nginx/static/javascript/lobbyPage/main.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/22 17:08:46 by madegryc #+# #+# */ /* Created: 2024/08/22 17:08:46 by madegryc #+# #+# */
/* Updated: 2024/09/29 01:34:41 by edbernar ### ########.fr */ /* Updated: 2024/09/30 23:46:19 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -208,6 +208,13 @@ function selectGameModeTwo()
goalSelector.dispose(); goalSelector.dispose();
document.getElementById('bar').innerHTML = ''; document.getElementById('bar').innerHTML = '';
document.getElementById('goal').innerHTML = ''; document.getElementById('goal').innerHTML = '';
if (barSelector)
barSelector.dispose();
if (goalSelector)
goalSelector.dispose();
barSelector = null;
goalSelector = null;
window.gc();
barSelector = new barSelecter(document.getElementById('bar')); barSelector = new barSelecter(document.getElementById('bar'));
goalSelector = new goalSelecter(document.getElementById('goal')); goalSelector = new goalSelecter(document.getElementById('goal'));
gameMode = 1; gameMode = 1;
@ -222,7 +229,18 @@ function selectGameModeThree()
{ {
menuList[i].style.display = 'none'; menuList[i].style.display = 'none';
} }
document.getElementById('bar1').innerHTML = '';
document.getElementById('goal1').innerHTML = '';
document.getElementsByClassName('menuSelected')[2].style.display = 'flex'; document.getElementsByClassName('menuSelected')[2].style.display = 'flex';
if (barSelector)
barSelector.dispose();
if (goalSelector)
goalSelector.dispose();
barSelector = null;
goalSelector = null;
window.gc();
barSelector = new barSelecter(document.getElementById('bar1'));
goalSelector = new goalSelecter(document.getElementById('goal1'));
gameMode = 2; gameMode = 2;
} }
@ -235,7 +253,15 @@ function selectGameModeFour()
{ {
menuList[i].style.display = 'none'; menuList[i].style.display = 'none';
} }
document.getElementById('bar2').innerHTML = '';
document.getElementById('goal2').innerHTML = '';
document.getElementsByClassName('menuSelected')[3].style.display = 'flex'; document.getElementsByClassName('menuSelected')[3].style.display = 'flex';
if (barSelector)
barSelector.dispose();
if (goalSelector)
goalSelector.dispose();
barSelector = new barSelecter(document.getElementById('bar2'));
goalSelector = new goalSelecter(document.getElementById('goal2'));
gameMode = 3; gameMode = 3;
} }

8
docker-compose/requirements/nginx/static/javascript/profilPage/main.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/09/19 23:08:31 by edbernar #+# #+# */ /* Created: 2024/09/19 23:08:31 by edbernar #+# #+# */
/* Updated: 2024/09/29 02:08:41 by edbernar ### ########.fr */ /* Updated: 2024/10/01 00:21:50 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -206,14 +206,16 @@ function createGraph(ctx, data)
function showHistory(userInfo) function showHistory(userInfo)
{ {
const divHistory = document.getElementById('history'); const divHistory = document.getElementById('scroll-match');
const history = userInfo.history; const history = userInfo.history;
history.forEach(element => { history.forEach(element => {
const div = document.createElement('div'); const div = document.createElement('div');
div.setAttribute('class', 'history-card'); div.setAttribute('class', 'history-card');
if (element.won) if (element.forfeit)
div.style.backgroundColor = '#c45f0c';
else if (element.won)
div.style.backgroundColor = '#11ad11'; div.style.backgroundColor = '#11ad11';
div.innerHTML = ` div.innerHTML = `
<div id="user-1"> <div id="user-1">

8
docker-compose/requirements/nginx/static/style/lobbyPage/lobbyPage.css
View File

@ -239,7 +239,7 @@ body {
align-items: center; align-items: center;
} }
#bar{ .barSelection{
margin: 25px; margin: 25px;
width: 250px; width: 250px;
height: 250px; height: 250px;
@ -247,11 +247,11 @@ body {
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
#bar:hover{ .barSelection:hover{
transform: scale(1.05); transform: scale(1.05);
} }
#goal{ .goalSelection{
margin: 25px; margin: 25px;
width: 250px; width: 250px;
height: 250px; height: 250px;
@ -259,7 +259,7 @@ body {
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
#goal:hover{ .goalSelection:hover{
transform: scale(1.05); transform: scale(1.05);
} }

11
docker-compose/requirements/nginx/static/style/profilPage/profil.css
View File

@ -112,16 +112,20 @@
text-align: center; text-align: center;
} }
#profil .scroll-match { #profil .history #scroll-match {
overflow-y: auto; overflow-y: auto;
height: 100%; width: 100%;
height: calc(100% - 60px);
display: flex;
flex-direction: column;
align-items: center;
} }
#profil .history { #profil .history {
background-color: white; background-color: white;
width: 48%; width: 48%;
height: 42vh; height: 42vh;
padding: 20px; /* padding: 20px; */
text-align: center; text-align: center;
} }
@ -131,6 +135,7 @@
margin-top: 20px; margin-top: 20px;
background-color: #E74040; background-color: #E74040;
height: 110px; height: 110px;
width: 90%;
padding: 15px; padding: 15px;
padding-inline: 40px; padding-inline: 40px;
transition: 0.3s ease; transition: 0.3s ease;