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

Site :

Browse Source 
- Add menu under login button when user connected
This commit is contained in:
Kum1ta
2024-09-12 01:37:52 +02:00
parent 3469b74c05
commit 17487197ac
4 changed files with 140 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docker-compose/requirements/djangoserver/file/server/server/templates/homePage.html
View File

@ -10,6 +10,10 @@
<div id="loginButton">
<p>LOGIN</p>
</div>
<div id="popMenuLoginButton">
<p>Profil</p>
<p>Settings</p>
</div>
</div>
<div id="loginPopup" class="popup">
<div class="container">

64
docker-compose/requirements/nginx/static/javascript/login/main.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 17:40:15 by edbernar #+# #+# */
/* Updated: 2024/09/10 16:41:57 by edbernar ### ########.fr */
/* Updated: 2024/09/12 01:35:44 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -18,22 +18,27 @@ class Login
{
static create()
{
const loginButton = document.getElementById('loginButton');
const pLoginButton = loginButton.getElementsByTagName('p')[0];
const form = document.getElementById('loginForm');
let nodeText = null;
const registerButton = document.getElementsByClassName('new-player')[0];
const button42 = document.getElementsByClassName('login-42-btn')[0];
const registerForm = document.getElementById('registerForm');
const loginButton = document.getElementById('loginButton');
const pLoginButton = loginButton.getElementsByTagName('p')[0];
const form = document.getElementById('loginForm');
let nodeText = null;
const registerButton = document.getElementsByClassName('new-player')[0];
const button42 = document.getElementsByClassName('login-42-btn')[0];
const registerForm = document.getElementById('registerForm');
const loginBackButton = document.getElementsByClassName('old-player')[0];
const popMenuLoginButton = document.getElementById('popMenuLoginButton');
registerButton.addEventListener('click', changeWindowLogin);
loginBackButton.addEventListener('click', changeWindowLoginBack);
button42.addEventListener('click', redirection);
window.addEventListener('resize', movePopMenuLoginButton);
movePopMenuLoginButton();
waitForLogin().then(() => {
if (userMeInfo.id !== -1)
{
nodeText = document.createTextNode(userMeInfo.username);
loginButton.replaceChild(nodeText, pLoginButton);
// loginButton.addEventListener('click', showMenu);
loginButton.addEventListener('click', showMenu);
}
else
{
@ -49,19 +54,55 @@ class Login
const loginButton = document.getElementById('loginButton');
const form = document.getElementById('loginForm');
const registerButton = document.getElementsByClassName('new-player')[0];
// const loginBackButton = document.getElementById('old-player');
const loginBackButton = document.getElementsByClassName('old-player')[0];
const button42 = document.getElementsByClassName('login-42-btn')[0];
const registerForm = document.getElementById('registerForm');
document.removeEventListener('click', hideMenu);
button42.removeEventListener('click', redirection);
loginButton.removeEventListener('click', showLoginDiv);
form.removeEventListener('submit', connect);
registerButton.removeEventListener('click', changeWindowLogin);
registerForm.removeEventListener('submit', createAccount);
// loginBackButton.removeEventListener('click', changeWindowLoginBack);
window.removeEventListener('resize', movePopMenuLoginButton);
loginButton.removeEventListener('click', showMenu);
loginBackButton.removeEventListener('click', changeWindowLoginBack);
}
}
function movePopMenuLoginButton()
{
const loginButton = document.getElementById('loginButton');
const pos = loginButton.getBoundingClientRect();
const popMenuLoginButton = document.getElementById('popMenuLoginButton');
popMenuLoginButton.style.left = pos.left + "px";
popMenuLoginButton.style.top = pos.top + (pos.height / 2) + "px";
}
function showMenu()
{
const popMenuLoginButton = document.getElementById('popMenuLoginButton');
const loginButton = document.getElementById('loginButton');
popMenuLoginButton.style.display = 'flex';
setTimeout(() => {
document.addEventListener('click', hideMenu);
loginButton.removeEventListener('click', showMenu);
}, 50);
}
function hideMenu()
{
const loginButton = document.getElementById('loginButton');
const popMenuLoginButton = document.getElementById('popMenuLoginButton');
popMenuLoginButton.style.display = 'none';
document.removeEventListener('click', hideMenu);
loginButton.addEventListener('click', showMenu);
console.log("ehh2");
}
function redirection(e)
{
e.preventDefault();
@ -99,6 +140,7 @@ function changeWindowLoginBack(e)
const registerWindow = document.getElementsByClassName('right-side-register')[0];
const loginWindow = document.getElementsByClassName('right-side')[0];
e.preventDefault();
loginWindow.style.display = 'flex';
registerWindow.style.display = 'none';
}

27
docker-compose/requirements/nginx/static/style/homePage/home.css
View File

@ -3,10 +3,10 @@
/* ::: :::::::: */
/* home.css :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: madegryc <madegryc@student.42.fr> +#+ +:+ +#+ */
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 12:00:55 by edbernar #+# #+# */
/* Updated: 2024/08/26 18:21:45 by madegryc ### ########.fr */
/* Updated: 2024/09/12 01:34:19 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -439,4 +439,27 @@ footer {
.footer-right p {
font-weight: bold;
}
#popMenuLoginButton {
background-color: white;
position: absolute;
z-index: 500;
width: 130px;
text-align: center;
display: none;
flex-direction: column;
justify-content: center;
}
#popMenuLoginButton p {
height: 40px;
margin: 0;
padding: 0;
padding-top: 15px;
}
#popMenuLoginButton p:hover {
background-color: #020202;
color: white;
}

58
site/real_game/node_modules/.vite/deps/_metadata.json generated vendored Normal file
View File

@ -0,0 +1,58 @@
{
"hash": "b49845fe",
"configHash": "0b4c6e74",
"lockfileHash": "89d910af",
"browserHash": "28a432c1",
"optimized": {
"cannon-es": {
"src": "../../cannon-es/dist/cannon-es.js",
"file": "cannon-es.js",
"fileHash": "f92ee112",
"needsInterop": false
},
"stats.js": {
"src": "../../stats.js/build/stats.min.js",
"file": "stats__js.js",
"fileHash": "348d89d2",
"needsInterop": true
},
"three": {
"src": "../../three/build/three.module.js",
"file": "three.js",
"fileHash": "ef377f7b",
"needsInterop": false
},
"three/addons/loaders/GLTFLoader.js": {
"src": "../../three/examples/jsm/loaders/GLTFLoader.js",
"file": "three_addons_loaders_GLTFLoader__js.js",
"fileHash": "c88adf6c",
"needsInterop": false
},
"three/examples/jsm/Addons.js": {
"src": "../../three/examples/jsm/Addons.js",
"file": "three_examples_jsm_Addons__js.js",
"fileHash": "d8836a37",
"needsInterop": false
},
"three/examples/jsm/controls/OrbitControls.js": {
"src": "../../three/examples/jsm/controls/OrbitControls.js",
"file": "three_examples_jsm_controls_OrbitControls__js.js",
"fileHash": "cca77670",
"needsInterop": false
}
},
"chunks": {
"chunk-PJQOQ23Z": {
"file": "chunk-PJQOQ23Z.js"
},
"chunk-X4PC2K6Q": {
"file": "chunk-X4PC2K6Q.js"
},
"chunk-IS2ZBFBB": {
"file": "chunk-IS2ZBFBB.js"
},
"chunk-HKJ2B2AA": {
"file": "chunk-HKJ2B2AA.js"
}
}
}