From 388d723e8a8a541d600dd5d24887540ca307c514 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?F=C3=A9lix=20MARQUET?= Date: Wed, 10 Apr 2024 09:22:45 +0200 Subject: [PATCH 1/3] Temp mokup for login, start login in ajax, bug with the click on signup to login --- Request_Test/testHTTP.http | 8 ++ index.php | 17 +--- src/API/requests.php | 5 + src/css/styles.css | 52 ++++++++-- src/js/AJAX/index.js | 162 +++++++++++++++++++++++++++++- src/php/components/user-login.php | 2 +- 6 files changed, 223 insertions(+), 23 deletions(-) diff --git a/Request_Test/testHTTP.http b/Request_Test/testHTTP.http index 4f99b02..b6ac60f 100644 --- a/Request_Test/testHTTP.http +++ b/Request_Test/testHTTP.http @@ -52,3 +52,11 @@ test = "coucou" ### +POST http://serveur-projet-s4.felix/src/API/requests.php/api/login/patient +Content-Type: application/x-www-form-urlencoded + +mail = "nicolasgrenier@example.com" & +password = "a" + +### + diff --git a/index.php b/index.php index c630bae..eb15669 100644 --- a/index.php +++ b/index.php @@ -13,20 +13,6 @@ -
diff --git a/src/API/requests.php b/src/API/requests.php index f044578..a4f9365 100644 --- a/src/API/requests.php +++ b/src/API/requests.php @@ -104,4 +104,9 @@ $router->POST('/api/create-rdv', ["medID", "date", "time", "lieu"], function($me CreateRDV($pdo, $medID, $date, $time, $lieu); }); +$router->POST('/api/login/patient', ["mail", "password"], function($mail, $password){ + global $pdo; + loginPatient::Login($pdo, $mail, $password); +}); + $router->run(); diff --git a/src/css/styles.css b/src/css/styles.css index 793c3d9..e83a622 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -4,6 +4,7 @@ body{ margin: 0; padding: 0; font-family: 'Roboto', sans-serif; + min-height: 100vh; } #DoctISEN{ @@ -15,6 +16,49 @@ body{ cursor: pointer; } +.login-ui{ + height: 78vh; + background-color: #EEF2F7; +} + +.signup-ui{ + height: 100vh; + background-color: #EEF2F7; +} + +#signup-sign-part{ + background-color: white; + height: 75%; + display: flex; + flex-direction: column; + gap: 1em; + border-radius: 20px; + box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); +} + + +#login-part{ + background-color: white; + height: 45%; + display: flex; + flex-direction: column; + gap: 1em; + border-radius: 20px; + box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); + margin-top: 10%; +} + +#signup-part{ + background-color: white; + height: 15%; + display: flex; + flex-direction: column; + gap: 1em; + border-radius: 20px; + box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); + margin-top: 10%; +} + #topbar{ background-color: #ff0000; height: 22vh; @@ -78,13 +122,7 @@ body{ padding-top: 5%; } -.logButton{ - width: 30%; - height: 100%; - background-color: #ff0000; - color: white; - font-weight: bold; -} + .pointer{ cursor: pointer; diff --git a/src/js/AJAX/index.js b/src/js/AJAX/index.js index 919777b..46efda6 100644 --- a/src/js/AJAX/index.js +++ b/src/js/AJAX/index.js @@ -249,6 +249,7 @@ function displayHome() {

Annuaire des médecins du CNOM • Annuaire des chirurgiens-dentistes de l'ONCD • Ordre National des Médecins • Ordre National des Chirurgiens-Dentistes

`; attachSearchEventListener(); + attachLoginUserDisplayEventListener(); displayAlert("Rendez-vous pris avec succès"); } @@ -279,6 +280,158 @@ function performSearch(event) { } } +function displayLoginUser() { + let container = document.getElementById("content"); + container.innerHTML = ""; + container.classList.add("d-flex", "flex-column", "justify-content-center", "text-center", "w-100", "login-ui"); + container.innerHTML = ` +
+ +
+
+
Nouveau sur Doct'ISEN?
+ + + +
+
+
`; + document.getElementById("user-login-button").addEventListener("click", function(event) { + event.preventDefault(); + let mail = document.getElementById("user-login-mail").value; + let password = document.getElementById("user-login-password").value; + let data = "mail=" + mail + "&password=" + password; + ajaxRequest('POST', "src/API/requests.php/api/login/patient", function (data) { + if (data.success) { + sessionStorage.setItem("user_id", data.id); + sessionStorage.setItem("user_type", "patient"); + sessionStorage.setItem("user_mail", mail); + sessionStorage.setItem("user_name", data.name); + sessionStorage.setItem("user_surname", data.surname); + displayHome(); + } else { + alert("Erreur lors de la connexion"); + } + }, data); + }); + document.getElementById("signup-user").addEventListener("click", function(event) { + displaySignUpUser(); + }); +} + +function displaySignUpUser() { + let container = document.getElementById("content"); + container.innerHTML = ""; + container.classList.add("d-flex", "flex-column", "justify-content-center", "text-center", "w-100", "signup-ui"); + container.classList.remove("login-ui"); + container.innerHTML = ` +
+
+
+
Inscription sur Doct'ISEN
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+
+
+
+
Déjà inscrit ?
+ + + +
+
+
+
`; + document.getElementById("login-user").addEventListener("click", function(event) { + console.log("login-user clicked"); + displayLoginUser(); + }); + document.getElementById("user-signup-button").addEventListener("click", function(event) { + event.preventDefault(); + let name = document.getElementById("user-signup-name").value; + let surname = document.getElementById("user-signup-surname").value; + let mail = document.getElementById("user-signup-mail").value; + let mailConfirm = document.getElementById("user-signup-mail-confirm").value; + let password = document.getElementById("user-signup-password").value; + let passwordConfirm = document.getElementById("user-signup-password-confirm").value; + let phone = document.getElementById("user-signup-phone").value; + if (mail !== mailConfirm) { + alert("Les adresses mail ne correspondent pas"); + return; + } + if (password !== passwordConfirm) { + alert("Les mots de passe ne correspondent pas"); + return; + } + let data = "name=" + name + "&surname=" + surname + "&mail=" + mail + "&password=" + password + "&phone=" + phone; + ajaxRequest('POST', "src/API/requests.php/api/signup/patient", function (data) { + if (data.success) { + sessionStorage.setItem("user_id", data.id); + sessionStorage.setItem("user_type", "patient"); + sessionStorage.setItem("user_mail", mail); + sessionStorage.setItem("user_name", name); + sessionStorage.setItem("user_surname", surname); + displayHome(); + } else { + alert("Erreur lors de l'inscription"); + } + }, data); + }); +} + function attachSearchEventListener() { try{ document.getElementById("recherche").addEventListener("click", function (event) { @@ -322,6 +475,12 @@ function attachPrendreRDVEventListener() { }); } +function attachLoginUserDisplayEventListener() { + document.getElementById("login-user").addEventListener("click", function (event) { + displayLoginUser(); + }); +} + //Yanis Part function DisplayRDVPraticient(rdv){ @@ -383,4 +542,5 @@ function ButtonShowRdvPraticient() { //End Call ButtonShowRdvPraticient(); -attachSearchEventListener(); \ No newline at end of file +attachSearchEventListener(); +attachLoginUserDisplayEventListener(); \ No newline at end of file diff --git a/src/php/components/user-login.php b/src/php/components/user-login.php index c97b6fb..07b4130 100644 --- a/src/php/components/user-login.php +++ b/src/php/components/user-login.php @@ -24,7 +24,7 @@ echo 'Mon calendrier'; } } else { - echo '

'; + echo '

'; } } ?> \ No newline at end of file From 1d27b68318e17b6d7b823078589005fb3c7a453d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?F=C3=A9lix=20MARQUET?= Date: Wed, 10 Apr 2024 09:35:16 +0200 Subject: [PATCH 2/3] Fix click bug --- src/API/requests.php | 5 ----- src/css/styles.css | 1 - src/js/AJAX/index.js | 28 ++++++++++------------------ 3 files changed, 10 insertions(+), 24 deletions(-) diff --git a/src/API/requests.php b/src/API/requests.php index a4f9365..f044578 100644 --- a/src/API/requests.php +++ b/src/API/requests.php @@ -104,9 +104,4 @@ $router->POST('/api/create-rdv', ["medID", "date", "time", "lieu"], function($me CreateRDV($pdo, $medID, $date, $time, $lieu); }); -$router->POST('/api/login/patient', ["mail", "password"], function($mail, $password){ - global $pdo; - loginPatient::Login($pdo, $mail, $password); -}); - $router->run(); diff --git a/src/css/styles.css b/src/css/styles.css index e83a622..9774885 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -50,7 +50,6 @@ body{ #signup-part{ background-color: white; - height: 15%; display: flex; flex-direction: column; gap: 1em; diff --git a/src/js/AJAX/index.js b/src/js/AJAX/index.js index 46efda6..c849d1e 100644 --- a/src/js/AJAX/index.js +++ b/src/js/AJAX/index.js @@ -283,7 +283,7 @@ function performSearch(event) { function displayLoginUser() { let container = document.getElementById("content"); container.innerHTML = ""; - container.classList.add("d-flex", "flex-column", "justify-content-center", "text-center", "w-100", "login-ui"); + container.className = 'd-flex flex-column justify-content-center text-center w-100 login-ui'; container.innerHTML = `
@@ -302,12 +302,6 @@ function displayLoginUser() {
-
- -

Mot de passe oublié ?

- -
-
@@ -344,8 +338,7 @@ function displayLoginUser() { function displaySignUpUser() { let container = document.getElementById("content"); container.innerHTML = ""; - container.classList.add("d-flex", "flex-column", "justify-content-center", "text-center", "w-100", "signup-ui"); - container.classList.remove("login-ui"); + container.className = 'd-flex flex-column justify-content-center text-center w-100 signup-ui'; container.innerHTML = `
@@ -358,7 +351,7 @@ function displaySignUpUser() {
- +
@@ -369,16 +362,16 @@ function displaySignUpUser() {
- - + +
- - + +
- +
@@ -388,15 +381,14 @@ function displaySignUpUser() {
Déjà inscrit ?
- +
`; - document.getElementById("login-user").addEventListener("click", function(event) { - console.log("login-user clicked"); + document.getElementById("login-user2").addEventListener("click", function(event) { displayLoginUser(); }); document.getElementById("user-signup-button").addEventListener("click", function(event) { From 3dd5a328ac7c84bee9d6fd9c7e67a4e458973b5f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?F=C3=A9lix=20MARQUET?= Date: Wed, 10 Apr 2024 09:45:08 +0200 Subject: [PATCH 3/3] Add login and signup page for praticien --- src/css/styles.css | 5 ++ src/js/AJAX/index.js | 151 +++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 151 insertions(+), 5 deletions(-) diff --git a/src/css/styles.css b/src/css/styles.css index 9774885..c5e5821 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -26,6 +26,11 @@ body{ background-color: #EEF2F7; } +.signup-ui-praticien{ + height: 125vh; + background-color: #EEF2F7; +} + #signup-sign-part{ background-color: white; height: 75%; diff --git a/src/js/AJAX/index.js b/src/js/AJAX/index.js index c849d1e..b0d4026 100644 --- a/src/js/AJAX/index.js +++ b/src/js/AJAX/index.js @@ -296,7 +296,7 @@ function displayLoginUser() {
- +
@@ -335,6 +335,127 @@ function displayLoginUser() { }); } +function displayLoginPraticien() { + let container = document.getElementById("content"); + container.innerHTML = ""; + container.className = 'd-flex flex-column justify-content-center text-center w-100 login-ui'; + container.innerHTML = ` +
+
+
+
J'ai déjà un compte praticien Doct'ISEN
+
+
+ + +
+
+ + +
+
+ +
+
+
+
+
+
Nouveau praticien sur Doct'ISEN?
+ + + +
+
+
`; + document.getElementById("praticien-login-button").addEventListener("click", function(event) { + event.preventDefault(); + let mail = document.getElementById("praticien-login-mail").value; + let password = document.getElementById("praticien-login-password").value; + let data = "mail=" + mail + "&password=" + password; + ajaxRequest('POST', "src/API/requests.php/api/login/praticien", function (data) { + if (data.success) { + sessionStorage.setItem("user_id", data.id); + sessionStorage.setItem("user_type", "praticien"); + sessionStorage.setItem("user_mail", mail); + sessionStorage.setItem("user_name", data.name); + sessionStorage.setItem("user_surname", data.surname); + displayHome(); + } else { + alert("Erreur lors de la connexion"); + } + }, data); + }); + document.getElementById("signup-praticien").addEventListener("click", function(event) { + displaySignUpPraticien(); + }); +} + +function displaySignUpPraticien() { + let container = document.getElementById("content"); + container.innerHTML = ""; + container.className = 'd-flex flex-column justify-content-center text-center w-100 signup-ui-praticien'; + container.innerHTML = ` +
+
+
+
Inscription praticien sur Doct'ISEN
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+
+
+
+
Déjà inscrit en tant que praticien ?
+ + + +
+
+
+
`; + document.getElementById("login-praticien2").addEventListener("click", function(event) { + displayLoginPraticien(); + }); +} + function displaySignUpUser() { let container = document.getElementById("content"); container.innerHTML = ""; @@ -468,11 +589,30 @@ function attachPrendreRDVEventListener() { } function attachLoginUserDisplayEventListener() { - document.getElementById("login-user").addEventListener("click", function (event) { - displayLoginUser(); - }); + try { + document.getElementById("login-user").addEventListener("click", function (event) { + displayLoginUser(); + }); + } + catch (e) { + //Do nothing + //console.error(e); + } } +function attachLoginPraticienDisplayEventListener() { + try { + document.getElementById("login-praticien").addEventListener("click", function (event) { + displayLoginPraticien(); + }); + } + catch (e) { + //Do nothing + //console.error(e); + } +} + + //Yanis Part function DisplayRDVPraticient(rdv){ @@ -535,4 +675,5 @@ function ButtonShowRdvPraticient() { ButtonShowRdvPraticient(); attachSearchEventListener(); -attachLoginUserDisplayEventListener(); \ No newline at end of file +attachLoginUserDisplayEventListener(); +attachLoginPraticienDisplayEventListener(); \ No newline at end of file