Skip to content
Snippets Groups Projects

Merging with master

Closed Scott MacLachlan CES2018 requested to merge AJAX_implementation into master
Files
6
+ 190
0
/*
* Navbar functions
*/
function openNav() {
document.getElementById("mySidebar").style.width = "30%";
document.getElementById("main").style.marginLeft = "30%";
}
function closeNav() {
document.getElementById("mySidebar").style.width = "0";
document.getElementById("main").style.marginLeft = "0";
}
/*
* User sessions functions
*/
//On any page load
$(document).ready(function () {
if(sessionStorage.getItem("loggedIn") !== "true"){//Check if user is not already logged in
if(localStorage.getItem("rememberMe") === "true"){//If user set to stay logged in (rememberMe was checked)
//Then start session
sessionStorage.setItem("username", localStorage.getItem("username"));
//TODO Set account type once API is updated
sessionStorage.setItem("loggedIn", "true");
window.location.href = 'main.html'; //Send to home page
}
}
});
//Logout function
function logout(){
sessionStorage.clear();
localStorage.clear();
location.reload();
}
/*
* Login.html functions
*/
//Prevent loginForm refreshing on submit
$(document).ready(function () {
let form = $('#loginForm');
form.submit(function (ev) {
ev.preventDefault();
});
});
const loginFunction = () => {
//Define variables and get from html form
let username = document.getElementById("username").value;
let password = document.getElementById("password").value;
let error = 0;
let errMessage = '';
if(username === ""){//If username is empty
errMessage += 'Username field is empty!\n'
error = 1;
}
if(password === ""){//If password is empty
errMessage += 'Password field is empty!\n'
error = 1;
}
if(error === 0) {//If no form errors
document.getElementById("loginStatus").innerHTML = "Connecting to server...";
document.getElementById("loginStatus").style.color = "black"
let xhr = new XMLHttpRequest();
xhr.open('GET', 'https://devweb2020.cis.strath.ac.uk/~seb18169/318/user_script.php?username=' + username + '&password=' + password + '', true);
xhr.onreadystatechange = function () {
if (xhr.readyState === xhr.DONE) {
if (xhr.status === 200) {
//Create and set login object
let loginObj = JSON.parse(xhr.responseText)
if (loginObj.auth_code === "200") {//If login successful
document.getElementById("loginStatus").innerHTML = "Logging in...";
document.getElementById("loginStatus").style.color = "green"
//Start user session
sessionStorage.setItem("username", username);
sessionStorage.setItem("loggedIn", "true");
// sessionStorage.setItem("accountType", userObj.accountType); //TODO Need to ask Eve to return account type when logging in
if (document.getElementById("rememberMe").checked) { //If user wants to stay logged in - then set local storage
localStorage.setItem("username", username);
localStorage.setItem("rememberMe", "true");
}
window.location.href = 'main.html';//Redirect to home page
}else { //Username is not an account, or the password is not correct for the account
document.getElementById("loginStatus").innerHTML = "Username or password is incorrect!";
document.getElementById("loginStatus").style.color = "orange"
}
} else {//AJAX has failed for some reason
document.getElementById("loginStatus").innerText = "Error connecting to server - please try again!";
document.getElementById("loginStatus").style.color = "red";
}
}
}
xhr.send();
}else{//Form has error
alert(errMessage);
}
}
/*
* signup.html functions
*/
//Functionality to open and close ADMIN signup questions
let adminFormShown = false;
function adminForm() {
if (adminFormShown === false) {
document.getElementById("adminQuestions").style.display = "block";
adminFormShown = true;
} else if (adminFormShown === true) {
document.getElementById("adminQuestions").style.display = "none";
adminFormShown = false;
}
}
//Prevent signupForm refreshing on submit - prevents errors with with AJAX not being called
$(document).ready(function () {
let form = $('#signupForm');
form.submit(function (ev) {
ev.preventDefault();
});
});
const signupFunction = () => {
//Define variables and get from html form
let username = document.getElementById("username").value;
let password = document.getElementById("password").value;
let passwordRepeat = document.getElementById("passwordRepeat").value;
let url;
let accountType;
let adminSystemID = '';
let error = 0;
let errMessage = '';
if (document.getElementById("adminCheck").checked) {//If user has checked admin
adminSystemID = document.getElementById("adminSystemID").value;
accountType = "admin";
url = "https://devweb2020.cis.strath.ac.uk/~seb18169/318/user_script.php?username=" + username + "&password=" + password + "&account_type=" + accountType + "&systemID=" + adminSystemID + "";
} else {//Else user is a guest not admin
accountType = "guest";
url = "https://devweb2020.cis.strath.ac.uk/~seb18169/318/user_script.php?username=" + username + "&password=" + password + "&account_type=" + accountType + "&systemID=''";
}
//Form error checking
if (username === '' || username.length < 4) { //Username empty or shorter than 4 characters
errMessage += 'Please enter a username longer than 4 characters!\n';
error = 1;
}
if (password !== passwordRepeat) { //Passwords don't match
errMessage += 'Passwords don\'t match!\n';
error = 1;
}
if (password === '' || password.length < 6) { //Password emtpy of shorter than 6 characters
errMessage += 'Please enter a password longer than 6 characters!\n';
error = 1;
}
if (accountType === "admin" && adminSystemID === '') {//If user has selected admin check if systemID is set
errMessage += 'Please enter a number value for store ID\n';
error = 1;
}
//If no errors in form send API request
if (error === 0) {
document.getElementById("signupStatus").innerText = "Authenticating...";
document.getElementById("signupStatus").style.color = "black";
let xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onreadystatechange = function () {
if (xhr.readyState === xhr.DONE) {
if (xhr.status === 200) {
console.log(xhr.responseText);
//Create and set sign up object
let signupObj = JSON.parse(xhr.responseText); //TODO need to speak with Eve about store ID error - if no store is there return a new error code?
//If sign up is successful
if (signupObj.auth_code === 200) {
alert("Signup successful - logged in");
//Start user session
sessionStorage.setItem("username", username);
sessionStorage.setItem("loggedIn", "true");
sessionStorage.setItem("accountType", accountType);
window.location.href = 'main.html';//Redirect to home page
} else if(signupObj.auth_code === 417){//Username already taken
document.getElementById("signupStatus").innerText = "Username has already been taken!";
document.getElementById("signupStatus").style.color = "orange";
}else {//Some data was wrong when signing up
document.getElementById("signupStatus").innerText = "Error signing up - please try again!";
document.getElementById("signupStatus").style.color = "red";
}
} else {//AJAX failed for some reason
document.getElementById("signupStatus").innerText = "Error connecting to server - please try again!";
document.getElementById("signupStatus").style.color = "red";
}
}
}
xhr.send();
} else {//Form has an error - alert error messages to user
alert(errMessage);
}
}
Loading