From 3ed6224d5c882f5b211189958ea02d26eda2ac3c Mon Sep 17 00:00:00 2001
From: Kum1ta <eddydhj@gmail.com>
Date: Mon, 30 Sep 2024 22:57:15 +0200
Subject: [PATCH] Site     - add popup function pour delete an account in
 settings page

---
 .../server/server/templates/settingsPage.html |  2 +-
 .../javascript/settingsPage/settingsPage.js   | 29 +++++++++++++++++--
 .../typeResponse/typeChangePrivateInfo.js     |  2 +-
 .../nginx/static/style/settings/settings.css  |  4 +--
 4 files changed, 30 insertions(+), 7 deletions(-)

diff --git a/docker-compose/requirements/djangoserver/file/server/server/templates/settingsPage.html b/docker-compose/requirements/djangoserver/file/server/server/templates/settingsPage.html
index f47e137..d8a9c9d 100644
--- a/docker-compose/requirements/djangoserver/file/server/server/templates/settingsPage.html
+++ b/docker-compose/requirements/djangoserver/file/server/server/templates/settingsPage.html
@@ -63,7 +63,7 @@
                 </div>
             </div>
 
-            <button class="delete-btn" id="deleteButton">Delete the account</button>
+            <button class="delete-btn" id="buttonShowDeleteMenu">Delete the account</button>
         </div>
     </div>
 </div>
diff --git a/docker-compose/requirements/nginx/static/javascript/settingsPage/settingsPage.js b/docker-compose/requirements/nginx/static/javascript/settingsPage/settingsPage.js
index e875f41..23423b0 100644
--- a/docker-compose/requirements/nginx/static/javascript/settingsPage/settingsPage.js
+++ b/docker-compose/requirements/nginx/static/javascript/settingsPage/settingsPage.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/09/25 17:00:35 by edbernar          #+#    #+#             */
-/*   Updated: 2024/09/26 22:48:29 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/09/30 22:47:54 by edbernar         ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
@@ -26,14 +26,18 @@ class settingsPage
 		const	passwordInput			=	document.getElementById('password');
 		const	newPasswordInput		=	document.getElementById('new-password');
 		const	confirmPasswordInput	=	document.getElementById('confirm-password');
+		const	usernameDeleteInput		=	document.getElementById('username-delete');
 
 		const	usernameSaveButton		=	document.getElementById('usernameButtonSave');
 		const	discordSaveButton		=	document.getElementById('discordButtonSave');
 		const	passwordSaveButton		=	document.getElementById('passwordButtonSave');
 		const	deleteButton			=	document.getElementById('deleteButton');
+		const	buttonShowDeleteMenu	=	document.getElementById('buttonShowDeleteMenu');
 
 		const	loginButton				=	document.getElementById('loginButton').getElementsByTagName('p')[0];
-		const	methButton				=	document.getElementById("homeButton");
+		const	methButton				=	document.getElementById('homeButton');
+
+		const	divDeleteAccount		=	document.getElementById('popup-background-delete');
 
 		let		interval				=	null;
 
@@ -60,6 +64,9 @@ class settingsPage
 			{
 				passwordInput.style.backgroundColor = newPasswordInput.style.backgroundColor = confirmPasswordInput.style.backgroundColor = passwordSaveButton.style.backgroundColor = "#bbbbbb";
 				passwordInput.type = newPasswordInput.type = confirmPasswordInput.type = 'text';
+				passwordInput.disabled = true;
+				newPasswordInput.disabled = true;
+				confirmPasswordInput.disabled = true;
 				passwordSaveButton.disabled = true;
 			}
 			discordInput.value = data.discord_username;
@@ -71,7 +78,25 @@ class settingsPage
 			discordSaveButton.addEventListener('click', () => {
 				sendRequest("change_private_info", {discord: discordInput.value});
 			});
+			buttonShowDeleteMenu.addEventListener('click', () => {
+				divDeleteAccount.style.display = 'flex';
+				function hideMenu(e)
+				{
+					if (e.target.getAttribute('class') == "popup-background-delete")
+					{
+						divDeleteAccount.style.display = 'none';
+						usernameDeleteInput.value = 'aaa';
+						buttonShowDeleteMenu.removeEventListener('click', hideMenu);
+					}
+				};
+				divDeleteAccount.addEventListener('click', hideMenu);
+			});
 			deleteButton.addEventListener('click', () => {
+				if (usernameDeleteInput.value != userMeInfo.username)
+				{
+					CN.new("Error", "Username does not match", CN.error);
+					return ;
+				}
 				sendRequest("change_private_info", {delete: true});
 				userMeInfo.id = -1;
 				setTimeout(() => {
diff --git a/docker-compose/requirements/nginx/static/javascript/typeResponse/typeChangePrivateInfo.js b/docker-compose/requirements/nginx/static/javascript/typeResponse/typeChangePrivateInfo.js
index cda1011..9542248 100644
--- a/docker-compose/requirements/nginx/static/javascript/typeResponse/typeChangePrivateInfo.js
+++ b/docker-compose/requirements/nginx/static/javascript/typeResponse/typeChangePrivateInfo.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/09/27 10:53:20 by edbernar          #+#    #+#             */
-/*   Updated: 2024/09/27 10:58:05 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/09/30 22:44:27 by edbernar         ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
diff --git a/docker-compose/requirements/nginx/static/style/settings/settings.css b/docker-compose/requirements/nginx/static/style/settings/settings.css
index 56c2ac5..e0504a8 100644
--- a/docker-compose/requirements/nginx/static/style/settings/settings.css
+++ b/docker-compose/requirements/nginx/static/style/settings/settings.css
@@ -10,8 +10,6 @@
     font-style: normal;
 }
 
-/* POUR EDDY : POPUP DELETE ACCOUNT ICI NONE -> FLEX, BE CAREFULL CHANGE DE FUNCTIONNALITY OF THE FIRST BUTTON FOR NOT DELETE THE ACCOUNT */
-
 .popup-background-delete {
 	display: none;
 	position: fixed;
@@ -26,7 +24,7 @@
 }
 
 .popup-delete {
-    display: none;
+    display: flex;
     flex-direction: column;
 	background-color: #020202;
     color: white;