integrated EVERYTHING!

js/app.ts

@@ -2,6 +2,17 @@ $(document).ready(function() {
     $('#mmlMainContent').load('../components/homepage.html');
     $('#top_nav_bar').load('../components/top_nav.html');
     $('#main_nav_bar').load('../components/main_nav.html', function() {
+        if (document.cookie.indexOf('loggedIn=true') != -1) {
+            $('#main_nav_bar').find('#loginLink').hide();
+            $('#main_nav_bar').find('#registerLink').hide();
+            $('#main_nav_bar').find('#logoutLink').show();
+            $('#main_nav_bar').find('#profileLink').show();
+        } else {
+            $('#main_nav_bar').find('#loginLink').show();
+            $('#main_nav_bar').find('#registerLink').show();
+            $('#main_nav_bar').find('#logoutLink').hide();
+            $('#main_nav_bar').find('#profileLink').hide();
+        }
         document.getElementById('registerLink')?.addEventListener('click', function() {
             $('#mmlMainContent').load('../components/register.html');
         },);
@@ -11,6 +22,19 @@ $(document).ready(function() {
         document.getElementById('loginLink')?.addEventListener('click', function() {
             $('#mmlMainContent').load('../components/login.html');
         },);
+        document.getElementById('logoutLink')?.addEventListener('click', function() {
+            document.cookie = 'loggedIn=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
+            document.cookie = 'email=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
+            document.cookie = 'rememberme=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
+            $('#mmlMainContent').load('../components/homepage.html');
+            $('#main_nav_bar').find('#loginLink').show();
+            $('#main_nav_bar').find('#registerLink').show();
+            $('#main_nav_bar').find('#logoutLink').hide();
+            $('#main_nav_bar').find('#profileLink').hide();
+        });
+        document.getElementById('profileLink')?.addEventListener('click', function() {
+            $('#mmlMainContent').load('../components/profile.html');
+        });
     });
     $('#marmeladenladen_footer').load('../components/footer.html');
     $('#marmeladenladen_search').load('../components/modal.html');

js/cookieHandling.js

@@ -0,0 +1,15 @@
+function getCookie(cname) {
+    let name = cname + "=";
+    let decodeCookie = decodeURIComponent(document.cookie);
+    let ca = decodeCookie.split(';');
+    for (let i = 0; i < ca.length; i++) {
+        let c = ca[i];
+        while (c.charAt(0) == ' ') {
+            c = c.substring(1);
+        }
+        if (c.indexOf(name) == 0) {
+            return c.substring(name.length, c.length);
+        }
+    }
+    return "";
+}

js/datachange.js

@@ -0,0 +1,97 @@
+//document get ready function
+    const username = getCookie('email');
+    const loggedIn = getCookie('loggedIn');
+    
+$(document).ready(function () {
+        const usernameHeader = document.getElementById("usernameHeader");
+        const salutation = document.getElementById("salutation");
+        const firstname = document.getElementById("firstname");
+        const lastname = document.getElementById("lastname");
+        const street = document.getElementById("street");
+        const postalcode = document.getElementById("postalcode");
+        const city = document.getElementById("city");
+        const email = document.getElementById("email");
+        const phone = document.getElementById("phone");
+        let hashedPassword = '';
+        //make json from username
+        const sendData = {
+            "username": username
+        };
+        stringData = JSON.stringify(sendData);
+    if (loggedIn == 'true') {
+        $.ajax({
+            url: '../logic/getUserData.php',
+            type: 'POST',
+            cache: false,
+            datatype: 'json',
+            data: stringData,
+            success: function (response) {
+                const data = JSON.parse(response);
+                //set data to fields
+                usernameHeader.innerHTML = data.username;
+                salutation.value = data.salutation;
+                firstname.value = data.firstname;
+                lastname.value = data.lastname;
+                street.value = data.address;
+                postalcode.value = data.plz;
+                city.value = data.city;
+                email.value = data.email;
+                phone.value = data.phone;
+                hashedPassword = data.password;
+            }
+        });
+    } else {
+        window.location.href = '../index.html';
+    }
+    const userForm = document.getElementById("userProfile");
+    userForm.addEventListener('submit', function (e) {
+        e.preventDefault();
+        updateUser(hashedPassword);
+    });
+});
+
+function updateUser(pwd){
+
+    const sendData = {
+        "username": username,
+        "street": street.value,
+        "postalcode": postalcode.value,
+        "city": city.value,
+        "phone": phone.value,
+        "password": password.value,
+        "hashedPassword": pwd
+    };
+    stringData = JSON.stringify(sendData);
+    console.log(stringData);
+    $.ajax({
+        url: '../logic/updateUserData.php',
+        type: 'POST',
+        cache: false,
+        datatype: 'text',
+        data: stringData,
+        success: function (response) {
+            console.log(response);
+            if (response == 'success') {
+                alert('Data updated');
+            } else {
+                alert('Data not updated - please try again later or enter correct password.');
+            }
+        }
+    });
+}
+
+function getCookie(cname) {
+    let name = cname + "=";
+    let decodeCookie = decodeURIComponent(document.cookie);
+    let ca = decodeCookie.split(';');
+    for (let i = 0; i < ca.length; i++) {
+        let c = ca[i];
+        while (c.charAt(0) == ' ') {
+            c = c.substring(1);
+        }
+        if (c.indexOf(name) == 0) {
+            return c.substring(name.length, c.length);
+        }
+    }
+    return "";
+}

js/login.js

@@ -0,0 +1,53 @@
+const emailLogin = document.getElementById('emailLogin');
+const passwordLogin = document.getElementById('passwordLogin');
+const rememberme = document.getElementById('rememberMe');
+
+const formLogin = document.getElementById('loginForm');
+formLogin.addEventListener('submit', login);
+
+async function login(event) {
+    event.preventDefault();
+    if (checkLogin()) {
+        //get form data
+        const formData = new FormData(formLogin);
+        //create object with form data
+        const data = {};
+        formData.forEach((value, key) => data[key] = value);
+        //log data on console
+        datastring = JSON.stringify(data);
+        //send data to php with Ajax
+        $.ajax({
+            url: '../logic/loginLogic.php',
+            type: 'POST',
+            data: datastring,
+            cache: false,
+            datatype: 'text',
+            success: function (response) {
+                if (response == 'success') {
+                    if (rememberme.checked) {
+                        document.cookie = "rememberme=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
+                        document.cookie = "email=" + emailLogin.value + "; expires=Fri, 31 Dec 9999 23:59:59 GMT";
+                        document.cookie = "loggedIn=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
+                    } else {
+                        document.cookie = "rememberme=false";
+                        document.cookie = "email=" + emailLogin.value;
+                        document.cookie = "loggedIn=true";
+                    }
+                    window.location.href = '../index.html';
+                    alert(response);
+                } else {
+                    alert(response);
+                }
+            }
+        });
+    }
+} 
+
+function checkLogin() {
+    if (emailLogin.value == '' || passwordLogin.value == '') {
+        alert('Please fill in all fields');
+        return false;
+    } else {
+        return true;
+    }
+}

js/logout.js

@@ -0,0 +1,11 @@
+//delete all cookies
+function deleteAllCookies() {
+    var cookies = document.cookie.split(";");
+
+    for (var i = 0; i < cookies.length; i++) {
+        var cookie = cookies[i];
+        var eqPos = cookie.indexOf("=");
+        var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
+        document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT";
+    }
+}

js/registration.js

@@ -27,9 +27,8 @@ async function register(event) {
             cache: false,
             datatype: 'text',
             success: function (response) {
-                console.log(response);
                 if (response == 'success') {
-                    window.location.href = '../index.html';
+                    $('#mmlMainContent').load('../components/login.html');
                 } else {
                     alert(response);
                 }