- Make css clean
This commit is contained in:
madegryc pc
2024-08-13 14:50:52 +02:00
13 changed files with 311 additions and 22 deletions

View File

@ -3,16 +3,17 @@
/* ::: :::::::: */
/* createConnectDiv.js :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: marvin <marvin@student.42.fr> +#+ +:+ +#+ */
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 18:14:53 by edbernar #+# #+# */
/* Updated: 2024/08/10 17:00:39 by marvin ### ########.fr */
/* Updated: 2024/08/13 00:21:02 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
import { userMeInfo, waitForLogin } from "../typeResponse/typeLogin.js";
import { createNotification as CN } from "../notification/main.js";
import { sendRequest } from "../websocket.js";
import { showLoginDiv, showMenu } from "./main.js";
/*
Todo (Eddy) :
@ -23,9 +24,10 @@ import { sendRequest } from "../websocket.js";
- Empecher les requetes de connexion si un champ est vide
- Ajouter un message d'erreur si le mail est invalide
- Connexion par 42
*/
let url42 = "https://api.intra.42.fr/oauth/authorize?client_id=u-s4t2ud-d9d6d46bd0be36dc13718981df4bfcf37e574ea364a07fcb5c39658be0f5706c&redirect_uri=http%3A%2F%2F127.0.0.1%3A5500%2Fsite%2F&response_type=code";
function createConnectDiv(divLogin)
{
const form = document.createElement("form");
@ -92,7 +94,7 @@ function createConnectDiv(divLogin)
});
buttonConnect42.addEventListener('click', (e) => {
e.preventDefault();
window.location.replace("https://api.intra.42.fr/oauth/authorize?client_id=u-s4t2ud-d9d6d46bd0be36dc13718981df4bfcf37e574ea364a07fcb5c39658be0f5706c&redirect_uri=http%3A%2F%2F127.0.0.1%3A5500%2Fsite%2F&response_type=code");
window.location.replace(url42);
});
return (divConnect);
}
@ -136,6 +138,8 @@ function createButton(inputLogin, inputPass)
document.getElementById("loginDiv").remove();
document.getElementById("globalBg").remove();
document.cookie = "token={" + token + "}; path=/; Secure; SameSite=Strict; max-age=3600";
document.getElementById('loginButton').removeEventListener('click', showLoginDiv);
document.getElementById('loginButton').addEventListener('click', showMenu);
});
}).catch((err) => {
CN.new("Error", "An error occured while trying to connect", CN.defaultIcon.error);

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 17:40:15 by edbernar #+# #+# */
/* Updated: 2024/08/10 18:40:40 by edbernar ### ########.fr */
/* Updated: 2024/08/13 00:01:42 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -29,7 +29,10 @@ function login()
document.cookie = "token={" + token + "}; path=/; Secure; SameSite=Strict; max-age=3600";
}
if (userMeInfo.id !== -1)
{
loginButton.replaceChild(nodeText, pLoginButton);
loginButton.addEventListener('click', showMenu);
}
else
loginButton.addEventListener('click', showLoginDiv);
});
@ -47,5 +50,47 @@ function showLoginDiv()
document.body.appendChild(divLogin);
}
function showMenu()
{
const loginButton = document.getElementById('loginButton');
const divMenu = document.createElement("div");
const ul = document.createElement("ul");
const li1 = document.createElement("li");
const li2 = document.createElement("li");
let already_activated = false;
export { login };
divMenu.setAttribute("id", "menuDiv");
li1.innerHTML = "Profile";
li2.innerHTML = "Logout";
li1.addEventListener('click', (e) => {
console.log("profile");
});
li2.addEventListener('click', (e) => {
document.cookie = "token=; path=/; Secure; SameSite=Strict; max-age=0";
window.location.href = "/";
location.reload();
});
ul.appendChild(li1);
ul.appendChild(li2);
divMenu.appendChild(ul);
divMenu.style.position = "absolute";
divMenu.style.width = loginButton.offsetWidth + "px";
divMenu.style.top = loginButton.offsetTop + loginButton.offsetHeight + "px";
divMenu.style.left = loginButton.offsetLeft + "px";
document.body.appendChild(divMenu);
loginButton.removeEventListener('click', showMenu);
loginButton.addEventListener('click', () => {
if (!already_activated)
{
setTimeout(() => {
document.getElementById("menuDiv").remove();
loginButton.addEventListener('click', showMenu);
already_activated = true;
}, 199);
document.getElementById("menuDiv").style.animation = "animHideMenuDiv 0.21s";
}
});
}
export { login, showLoginDiv, showMenu };

View File

@ -3,13 +3,38 @@
/* ::: :::::::: */
/* home.css :+: :+: :+: */
/* +:+ +:+ +:+ */
<<<<<<< HEAD
/* By: marvin <marvin@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 12:00:55 by edbernar #+# #+# */
/* Updated: 2024/08/13 13:11:42 by marvin ### ########.fr */
=======
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 12:00:55 by edbernar #+# #+# */
/* Updated: 2024/08/13 00:03:27 by edbernar ### ########.fr */
>>>>>>> 298711bf505242792e7b73b7a42271903a979d1f
/* */
/* ************************************************************************** */
@keyframes animShowMenuDiv {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes animHideMenuDiv {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
* {
margin: 0;
padding: 0;
@ -100,7 +125,29 @@ body {
cursor: pointer;
}
<<<<<<< HEAD
.homeSection{
color: white;
min-height: 100svh;
=======
#menuDiv {
display: flex;
flex-direction: column;
align-items: right;
font-family: "Poppins", sans-serif;
background-color: #ffffff;
animation: animShowMenuDiv 0.5s;
}
#menuDiv li {
list-style-type: none;
text-align: center;
font-size: 16px;
padding: 10px;
cursor: pointer;
}
#menuDiv li:hover {
background-color: #f0f0f0;
>>>>>>> 298711bf505242792e7b73b7a42271903a979d1f
}

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/07/31 22:17:24 by edbernar #+# #+# */
/* Updated: 2024/08/10 16:05:26 by edbernar ### ########.fr */
/* Updated: 2024/08/13 00:12:26 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -56,14 +56,9 @@ socket.onopen = () => {
status = 1;
console.log('Connected');
if (token)
{
console.log("token :" + token);
sendRequest("login", {type: "byToken", token: token});
}
else
{
connectedWith42Func();
}
};
socket.onmessage = (event) => {