diff --git a/Assets/css/profile.css b/Assets/css/profile.css index 6d4f1fb..9b8a668 100644 --- a/Assets/css/profile.css +++ b/Assets/css/profile.css @@ -81,6 +81,12 @@ input:hover { background-color: #4d4d4d; } +input[disabled] { + background-color: #222; + color: #4d4d4d; + cursor: pointer; +} + button { border: 2px solid #4d4d4d; background-color: transparent; @@ -181,7 +187,7 @@ button:active { } .connected-accounts .item.connected > span:nth-child(3) { - display: block; + display: flex; } .connected-accounts .item.connected > span:nth-child(2) { @@ -195,4 +201,10 @@ button:active { .flex.end { justify-content: flex-end; +} + +.input-group { + display: flex; + align-items: center; + gap: .5em; } \ No newline at end of file diff --git a/Assets/js/profile.js b/Assets/js/profile.js index 45a96a8..6aae0b3 100644 --- a/Assets/js/profile.js +++ b/Assets/js/profile.js @@ -3,19 +3,19 @@ var currentUser; LoginManager.isLoggedIn().then(async (e) => { if (!e) { window.location.href = 'https://login.netdb.at'; - return; + return; } - const token = LoginManager.getCookie("token"); + const token = LoginManager.getCookie('token'); - const req = await fetch("https://api.login.netdb.at/user", { - method: "GET", + const req = await fetch('https://api.login.netdb.at/user', { + method: 'GET', headers: { - "Authorization": "Bearer " + token - } + Authorization: 'Bearer ' + token, + }, }); - if(req.status == 401) { + if (req.status == 401) { window.location.href = 'https://login.netdb.at'; return; } @@ -30,22 +30,19 @@ LoginManager.isLoggedIn().then(async (e) => { const user = res.data; currentUser = user; - document.getElementById("username").value = user.username; - document.getElementById("firstname").value = user.firstname; - document.getElementById("lastname").value = user.lastname; - document.getElementById("pi_email").value = user.email; - document.getElementById("cp_email").value = user.email; - document.getElementById("country").value = user.country; - document.getElementById("preferredlang").value = user.preferredLang; + document.getElementById('username').value = user.username; + document.getElementById('firstname').value = user.firstname; + document.getElementById('lastname').value = user.lastname; + document.getElementById('pi_email').value = user.email; + document.getElementById('cp_email').value = user.email; + document.getElementById('country').value = user.country; + document.getElementById('preferredlang').value = user.preferredLang; - if (user.discordId !== null) - document.getElementById("ca_discord").classList.add("connected"); + if (user.discordId !== null) document.getElementById('ca_discord').classList.add('connected'); - if (user.sporifyId !== null) - document.getElementById("ca_spotify").classList.add("connected"); + if (user.sporifyId !== null) document.getElementById('ca_spotify').classList.add('connected'); - if (user.twitchId !== null) - document.getElementById("ca_twitch").classList.add("connected"); + if (user.twitchId !== null) document.getElementById('ca_twitch').classList.add('connected'); // if (user.githubId !== null) // document.getElementById("ca_github").classList.add("connected"); @@ -56,31 +53,34 @@ LoginManager.isLoggedIn().then(async (e) => { // if (user.appleId !== null) // document.getElementById("ca_apple").classList.add("connected"); - if (user["2fa"] && user["2faType"] == "App") - document.getElementById("cp_2fa").classList.remove("d-none"); + if (user['2fa'] && user['2faType'] == 'App') document.getElementById('cp_2fa').classList.remove('d-none'); }); -document.getElementById("pi_save").addEventListener("click", savePersonalInformation); -document.getElementById("cp_save").addEventListener("click", changePassword); +document.getElementById('pi_save').addEventListener('click', savePersonalInformation); +document.getElementById('cp_save').addEventListener('click', changePassword); +document.getElementsByTagName('input').forEach((element) => { + element.addEventListener('keyup', (e) => e.target.classList.remove('invalid')); +}); async function savePersonalInformation() { - const req = await fetch("https://api.login.netdb.at/user", { - method: "PUT", + await LoginManager.validateToken(); + const req = await fetch('https://api.login.netdb.at/user', { + method: 'PUT', headers: { - "Authorization": "Bearer " + LoginManager.getCookie("token"), - "Content-Type": "application/json" + Authorization: 'Bearer ' + LoginManager.getCookie('token'), + 'Content-Type': 'application/json', }, body: JSON.stringify({ - firstname: document.getElementById("firstname").value, - lastname: document.getElementById("lastname").value, - country: document.getElementById("country").value, - preferredLang: document.getElementById("preferredlang").value, - username: document.getElementById("username").value, - }) + firstname: document.getElementById('firstname').value, + lastname: document.getElementById('lastname').value, + country: document.getElementById('country').value, + preferredLang: document.getElementById('preferredlang').value, + username: document.getElementById('username').value, + }), }); - if(req.status == 401) { + if (req.status == 401) { window.location.href = 'https://login.netdb.at'; return; } @@ -93,24 +93,39 @@ async function savePersonalInformation() { } } -async function changePassword() { +async function changePassword() { //move to /user/password - // TODO: validate new pw - const req = await fetch("https://api.login.netdb.at/resetpassword", { - method: "POST", + + const pw = document.getElementById('newPassword1').value; + const rpw = document.getElementById('newPassword2').value; + + const error = validatePw(pw, rpw); + + if (error) { + document.getElementById('newPassword1').value = ''; + document.getElementById('newPassword2').value = ''; + + document.getElementById('newPassword1').classList.add('invalid'); + document.getElementById('newPassword2').classList.add('invalid'); + return; + } + + await LoginManager.validateToken(); + const req = await fetch('https://api.login.netdb.at/resetpassword', { + method: 'POST', headers: { - "Authorization": "Bearer " + LoginManager.getCookie("token"), - "Content-Type": "application/json" + Authorization: 'Bearer ' + LoginManager.getCookie('token'), + 'Content-Type': 'application/json', }, - body: { - OldPassword: document.getElementById("oldPassword").value, - Email: document.getElementById("cp_email").value, - Password: document.getElementById("newPassword1").value, - TwoFaToken: currentUser["2fa"] ? document.getElementById("cp_2fa").value : null - } + body: JSON.stringify({ + OldPassword: document.getElementById('oldPassword').value, + Email: document.getElementById('cp_email').value, + Password: document.getElementById('newPassword1').value, + TwoFaToken: currentUser['2fa'] ? document.getElementById('cp_2fa').value : null, + }), }); - if(req.status == 401) { + if (req.status == 401) { window.location.href = 'https://login.netdb.at'; return; } @@ -123,4 +138,28 @@ async function changePassword() { } window.location.href = 'https://login.netdb.at/?redirect=' + encodeURIComponent(window.location.href); -} \ No newline at end of file +} + +function validatePw(pw, rpw) { + if (pw.length < 8) return 'The password has to be at least 8 characters long'; + + if (!isUpperCase(pw)) return 'The password has to contain at least one uppercase letter'; + + if (!isLowerCase(pw)) return 'The password has to contain at least one lowercase letter'; + + if (!isNumber(pw)) return 'The password has to contain at least one number'; + + if (pw != rpw) return 'Passwords do not match'; +} + +function isUpperCase(str) { + return /[A-Z]/.test(str); +} + +function isLowerCase(str) { + return /[a-z]/.test(str); +} + +function isNumber(str) { + return /[0-9]/.test(str); +} diff --git a/profile/index.html b/profile/index.html index 4122912..e412c5f 100644 --- a/profile/index.html +++ b/profile/index.html @@ -66,12 +66,16 @@

Developer

Personal Information

- - - - - + +
+ + +
+
+ + +
@@ -79,7 +83,7 @@

Personal Information

Password

- + @@ -93,7 +97,7 @@

Password

Connected Accounts

-

+

Spotify