Backdrop and logind fix
This commit is contained in:
Jacob Søfeldt
parent
995cec56b1
commit
ebeb93e5fa
1700
Frontend/Index.html
1700
Frontend/Index.html
File diff suppressed because it is too large
Load Diff
|
|
@ -1,363 +1,333 @@
|
|||
$(document).ready(function () {
|
||||
// Register Start
|
||||
let selectedGameJam;
|
||||
let isAdminLoggedIn = false;
|
||||
let displayValue = 0;
|
||||
let arr = [
|
||||
{"id": "-1", "Gamejam": "Vælg aktivt GameJam"}
|
||||
];
|
||||
// Register Start
|
||||
axios.defaults.baseURL = "http://localhost/Game-Jaming";
|
||||
|
||||
if (getCookie('userName') != null)
|
||||
{
|
||||
isAdminLoggedIn = true;
|
||||
SwitchNavInfo(true, true);
|
||||
}
|
||||
else if (getCookie('groupName') != null)
|
||||
{
|
||||
isAdminLoggedIn = false;
|
||||
SwitchNavInfo(true);
|
||||
}
|
||||
let selectedGameJam;
|
||||
let isAdminLoggedIn = false;
|
||||
let displayValue = 0;
|
||||
let arr = [{ id: "-1", Gamejam: "Vælg aktivt GameJam" }];
|
||||
|
||||
// Populate select with options from the database
|
||||
axios.get('/Backend/Controllers/GameJam/GetGameJam.php')
|
||||
.then(function(res) {
|
||||
let resArr = res.data.data;
|
||||
if (getCookie("userName") != null) {
|
||||
isAdminLoggedIn = true;
|
||||
SwitchNavInfo(true, true);
|
||||
} else if (getCookie("groupName") != null) {
|
||||
isAdminLoggedIn = false;
|
||||
SwitchNavInfo(true);
|
||||
}
|
||||
|
||||
for(let i = 0; i < res.data.data.length; i++)
|
||||
{
|
||||
arr.push({
|
||||
id: resArr[i].id,
|
||||
Gamejam: resArr[i].name
|
||||
});
|
||||
}
|
||||
// Populate select with options from the database
|
||||
axios
|
||||
.get("/Backend/Controllers/GameJam/GetGameJam.php")
|
||||
.then(function (res) {
|
||||
let resArr = res.data.data;
|
||||
|
||||
$.each(arr, function(i, data) {
|
||||
if (i === 0)
|
||||
{
|
||||
$('#GameJamSelect').append('<option disabled selected value="' + data.id + '">' + data.Gamejam + '</option>');
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#GameJamSelect').append('<option value="' + data.id + '">' + data.Gamejam + '</option>');
|
||||
}
|
||||
for (let i = 0; i < res.data.data.length; i++) {
|
||||
arr.push({
|
||||
id: resArr[i].id,
|
||||
Gamejam: resArr[i].name,
|
||||
});
|
||||
}
|
||||
|
||||
$.each(arr, function (i, data) {
|
||||
if (i === 0) {
|
||||
$("#GameJamSelect").append(
|
||||
'<option disabled selected value="' +
|
||||
data.id +
|
||||
'">' +
|
||||
data.Gamejam +
|
||||
"</option>"
|
||||
);
|
||||
} else {
|
||||
$("#GameJamSelect").append(
|
||||
'<option value="' + data.id + '">' + data.Gamejam + "</option>"
|
||||
);
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(function(error) {
|
||||
.catch(function (error) {
|
||||
console.log(error.response);
|
||||
});
|
||||
|
||||
// Remove invalidInput if selected option has been changed
|
||||
$("#GameJamSelect").change(function () {
|
||||
selectedGameJam = $("#GameJamSelect").children("option:selected").val();
|
||||
|
||||
if (selectedGameJam >= 1) {
|
||||
$("#GameJamSelect").removeClass("invalidInput");
|
||||
}
|
||||
});
|
||||
|
||||
// Remove invalidInput if change in group name has been detected
|
||||
$("#username").on("input", function () {
|
||||
if ($(this).hasClass("invalidInput")) {
|
||||
$(this).removeClass("invalidInput");
|
||||
}
|
||||
});
|
||||
|
||||
GetGroupNames().then(function (res) {
|
||||
let resArr = res.data;
|
||||
let groupNameTaken = false;
|
||||
|
||||
$("#RegisterBtn").click(function () {
|
||||
let groupName = $("#username").val();
|
||||
|
||||
for (let i = 0; i < resArr.length; i++) {
|
||||
if (resArr[i].group_name.toUpperCase() === groupName.toUpperCase()) {
|
||||
groupNameTaken = true;
|
||||
break;
|
||||
} else {
|
||||
groupNameTaken = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Check data before submitting
|
||||
$("#RegisterForm").submit(function (e) {
|
||||
if (!selectedGameJam >= 1) {
|
||||
$("#GameJamSelect").addClass("invalidInput");
|
||||
e.preventDefault();
|
||||
return false;
|
||||
} else {
|
||||
$("#gameJamId").val($("#GameJamSelect option:selected").val());
|
||||
}
|
||||
|
||||
if ($("#pass1").val().length === 0) {
|
||||
$("#pass1").addClass("invalidInput");
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if ($("#pass2").val().length === 0) {
|
||||
$("#pass2").addClass("invalidInput");
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if ($("#username").val().length === 0) {
|
||||
$("#username").addClass("invalidInput");
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if ($("#pass1").hasClass("invalidInput")) {
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if ($("#pass2").hasClass("invalidInput")) {
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if (!$.isNumeric($("#NUDDisplay").text())) {
|
||||
$("#NUDDisplay").text("Ugyldigt antal!");
|
||||
$("#NUDDisplay").css({ color: "red" });
|
||||
e.preventDefault();
|
||||
} else {
|
||||
$("#groupAmount").val($("#NUDDisplay").text());
|
||||
}
|
||||
|
||||
if (groupNameTaken) {
|
||||
$("#username").addClass("invalidInput");
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
let URL = "/Backend/Controllers/Group/SigningUp.php";
|
||||
|
||||
let form = $("#RegisterForm")[0];
|
||||
let formData = new FormData(form);
|
||||
|
||||
let id = $("#RegisterBtn").attr("name");
|
||||
let value = $("#RegisterBtn").val();
|
||||
|
||||
formData.append(id, value);
|
||||
|
||||
axios
|
||||
.post(URL, formData, {
|
||||
header: "multipart/form-data",
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.status === 201) {
|
||||
SwitchNavInfo(true);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error.response);
|
||||
});
|
||||
|
||||
e.preventDefault();
|
||||
});
|
||||
});
|
||||
|
||||
$("#NUDPlus").click(function () {
|
||||
if ($("#NUDDisplay").css("color") === "rgb(255, 0, 0)") {
|
||||
$("#NUDDisplay").css({ color: "rgba(255, 255, 255, .55)" });
|
||||
}
|
||||
|
||||
displayValue++;
|
||||
|
||||
$("#NUDDisplay").text(displayValue);
|
||||
});
|
||||
|
||||
$("#NUDMinus").click(function () {
|
||||
if (displayValue <= 0) {
|
||||
return;
|
||||
} else if (displayValue <= 1) {
|
||||
$("#NUDDisplay").text(1);
|
||||
} else {
|
||||
displayValue--;
|
||||
$("#NUDDisplay").text(displayValue);
|
||||
}
|
||||
});
|
||||
|
||||
async function GetGroupNames() {
|
||||
const res = await axios.get("/Backend/Controllers/Group/GetGroup.php");
|
||||
|
||||
return res.data;
|
||||
}
|
||||
|
||||
// Register end
|
||||
|
||||
// Login start
|
||||
$("#LoginForm").submit(function (e) {
|
||||
let URL = "/Backend/Controllers/Group/Login.php";
|
||||
|
||||
let form = $("#LoginForm")[0];
|
||||
let formData = new FormData(form);
|
||||
|
||||
let id = $("#LoginBtn").attr("name");
|
||||
let value = $("#LoginBtn").val();
|
||||
|
||||
formData.append(id, value);
|
||||
|
||||
axios
|
||||
.post(URL, formData, {
|
||||
header: "multipart/form-data",
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.status === 200) {
|
||||
isAdminLoggedIn = false;
|
||||
SwitchNavInfo(true);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
if (error.response.status === 401) {
|
||||
$("#loginUsername").css({ "border-color": "red" });
|
||||
$("#loginPassword").css({ "border-color": "red" });
|
||||
$("#ErrorText").css({ display: "block" });
|
||||
} else {
|
||||
console.log(error.response);
|
||||
}
|
||||
});
|
||||
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$("#AdminLoginForm").submit(function (e) {
|
||||
let URL = "/Backend/Controllers/Admin/AdminLogin.php";
|
||||
|
||||
let form = $("#AdminLoginForm")[0];
|
||||
let formData = new FormData(form);
|
||||
|
||||
let id = $("#AdminLoginBtn").attr("name");
|
||||
let value = $("#AdminLoginBtn").val();
|
||||
|
||||
formData.append(id, value);
|
||||
|
||||
axios
|
||||
.post(URL, formData, {
|
||||
header: "multipart/form-data",
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.status === 200) {
|
||||
isAdminLoggedIn = true;
|
||||
SwitchNavInfo(true, true);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
if (error.response.status === 401) {
|
||||
$("#adminUsername").css({ "border-color": "red" });
|
||||
$("#adminPassword").css({ "border-color": "red" });
|
||||
$("#AdminErrorText").css({ display: "block" });
|
||||
} else {
|
||||
console.log(error.response);
|
||||
}
|
||||
});
|
||||
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
function SwitchNavInfo(isLoggedIn, isAdmin) {
|
||||
if (isLoggedIn) {
|
||||
$("#NavUser").css({ display: "block" });
|
||||
$("#NavUser").text(
|
||||
`Welcome, ${isAdmin ? getCookie("userName") : getCookie("groupName")}!`
|
||||
);
|
||||
|
||||
$("#NavLogin").css({ display: "none" });
|
||||
$("#NavLogout").css({ display: "block" });
|
||||
|
||||
$("#LoginModal").modal("hide");
|
||||
} else {
|
||||
$("#NavUser").css({ display: "none" });
|
||||
$("#NavUser").text(``);
|
||||
|
||||
$("#NavLogin").css({ display: "block" });
|
||||
$("#NavLogout").css({ display: "none" });
|
||||
}
|
||||
|
||||
if (isAdmin === undefined) {
|
||||
return;
|
||||
} else {
|
||||
if (isAdmin) {
|
||||
if (isLoggedIn) {
|
||||
$("#AdminPanel").css({ display: "block" });
|
||||
|
||||
console.log("Logged In As Admin!");
|
||||
} else {
|
||||
$("#AdminPanel").css({ display: "none" });
|
||||
|
||||
console.log("Logged Out As Admin!");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// Login end
|
||||
|
||||
// Logout start
|
||||
$("#NavLogout").click(function () {
|
||||
axios
|
||||
.get("/Backend/Controllers/Group/Logout.php")
|
||||
.then((res) => {
|
||||
if (res.status == 200) {
|
||||
SwitchNavInfo(false, isAdminLoggedIn);
|
||||
isAdminLoggedIn = false;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error.response);
|
||||
});
|
||||
});
|
||||
});
|
||||
// Logout end
|
||||
|
||||
// Remove invalidInput if selected option has been changed
|
||||
$('#GameJamSelect').change(function() {
|
||||
selectedGameJam = $('#GameJamSelect').children("option:selected").val();
|
||||
|
||||
if (selectedGameJam >= 1)
|
||||
{
|
||||
$('#GameJamSelect').removeClass('invalidInput');
|
||||
}
|
||||
});
|
||||
function getCookie(name) {
|
||||
// Split cookie string and get all individual name=value pairs in an array
|
||||
var cookieArr = document.cookie.split(";");
|
||||
|
||||
// Remove invalidInput if change in group name has been detected
|
||||
$('#username').on('input', function() {
|
||||
if ($(this).hasClass('invalidInput'))
|
||||
{
|
||||
$(this).removeClass('invalidInput');
|
||||
}
|
||||
})
|
||||
// Loop through the array elements
|
||||
for (var i = 0; i < cookieArr.length; i++) {
|
||||
var cookiePair = cookieArr[i].split("=");
|
||||
|
||||
GetGroupNames().then(function(res) {
|
||||
let resArr = res.data;
|
||||
let groupNameTaken = false;
|
||||
|
||||
$('#RegisterBtn').click(function() {
|
||||
let groupName = $('#username').val();
|
||||
|
||||
for(let i = 0; i < resArr.length; i++)
|
||||
{
|
||||
if (resArr[i].group_name.toUpperCase() === groupName.toUpperCase())
|
||||
{
|
||||
groupNameTaken = true;
|
||||
break;
|
||||
}
|
||||
else
|
||||
{
|
||||
groupNameTaken = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Check data before submitting
|
||||
$('#RegisterForm').submit(function(e) {
|
||||
|
||||
if(!selectedGameJam >= 1)
|
||||
{
|
||||
$('#GameJamSelect').addClass('invalidInput');
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#gameJamId').val($('#GameJamSelect option:selected').val());
|
||||
}
|
||||
|
||||
if($('#pass1').val().length === 0)
|
||||
{
|
||||
$('#pass1').addClass('invalidInput');
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if($('#pass2').val().length === 0)
|
||||
{
|
||||
$('#pass2').addClass('invalidInput');
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if($('#username').val().length === 0)
|
||||
{
|
||||
$('#username').addClass('invalidInput');
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if($('#pass1').hasClass('invalidInput'))
|
||||
{
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if($('#pass2').hasClass('invalidInput'))
|
||||
{
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
if(!$.isNumeric($('#NUDDisplay').text()))
|
||||
{
|
||||
$('#NUDDisplay').text('Ugyldigt antal!');
|
||||
$('#NUDDisplay').css({"color": "red"});
|
||||
e.preventDefault();
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#groupAmount').val($('#NUDDisplay').text());
|
||||
}
|
||||
|
||||
if (groupNameTaken)
|
||||
{
|
||||
$('#username').addClass('invalidInput');
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
let URL = "/Backend/Controllers/Group/SigningUp.php";
|
||||
|
||||
let form = $('#RegisterForm')[0];
|
||||
let formData = new FormData(form);
|
||||
|
||||
let id = $('#RegisterBtn').attr('name');
|
||||
let value = $('#RegisterBtn').val();
|
||||
|
||||
formData.append(id, value);
|
||||
|
||||
axios.post(URL, formData, {
|
||||
header: 'multipart/form-data'
|
||||
}).then(res => {
|
||||
if (res.status === 201)
|
||||
{
|
||||
SwitchNavInfo(true);
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error.response);
|
||||
});
|
||||
|
||||
e.preventDefault();
|
||||
});
|
||||
});
|
||||
|
||||
$('#NUDPlus').click(function() {
|
||||
if($('#NUDDisplay').css('color') === 'rgb(255, 0, 0)')
|
||||
{
|
||||
$('#NUDDisplay').css({'color': 'rgba(255, 255, 255, .55)'});
|
||||
}
|
||||
|
||||
displayValue++;
|
||||
|
||||
$('#NUDDisplay').text(displayValue);
|
||||
});
|
||||
|
||||
$('#NUDMinus').click(function() {
|
||||
if (displayValue <= 0)
|
||||
{
|
||||
return;
|
||||
}
|
||||
else if(displayValue <= 1)
|
||||
{
|
||||
$('#NUDDisplay').text(1);
|
||||
}
|
||||
else
|
||||
{
|
||||
displayValue--;
|
||||
$('#NUDDisplay').text(displayValue);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
async function GetGroupNames() {
|
||||
const res = await axios.get('/Backend/Controllers/Group/GetGroup.php');
|
||||
|
||||
return res.data;
|
||||
}
|
||||
|
||||
// Register end
|
||||
|
||||
// Login start
|
||||
$('#LoginForm').submit(function(e) {
|
||||
let URL = "/Backend/Controllers/Group/Login.php";
|
||||
|
||||
let form = $('#LoginForm')[0];
|
||||
let formData = new FormData(form);
|
||||
|
||||
let id = $('#LoginBtn').attr('name');
|
||||
let value = $('#LoginBtn').val();
|
||||
|
||||
formData.append(id, value);
|
||||
|
||||
axios.post(URL, formData, {
|
||||
header: 'multipart/form-data'
|
||||
}).then(res => {
|
||||
if (res.status === 200)
|
||||
{
|
||||
isAdminLoggedIn = false;
|
||||
SwitchNavInfo(true);
|
||||
}
|
||||
}).catch(error => {
|
||||
if (error.response.status === 401)
|
||||
{
|
||||
$('#loginUsername').css({'border-color':'red'});
|
||||
$('#loginPassword').css({'border-color':'red'});
|
||||
$('#ErrorText').css({'display':'block'});
|
||||
}
|
||||
else
|
||||
{
|
||||
console.log(error.response);
|
||||
}
|
||||
});
|
||||
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$('#AdminLoginForm').submit(function(e) {
|
||||
let URL = "/Backend/Controllers/Admin/AdminLogin.php";
|
||||
|
||||
let form = $('#AdminLoginForm')[0];
|
||||
let formData = new FormData(form);
|
||||
|
||||
let id = $('#AdminLoginBtn').attr('name');
|
||||
let value = $('#AdminLoginBtn').val();
|
||||
|
||||
formData.append(id, value);
|
||||
|
||||
axios.post(URL, formData, {
|
||||
header: 'multipart/form-data'
|
||||
}).then(res => {
|
||||
if (res.status === 200)
|
||||
{
|
||||
isAdminLoggedIn = true;
|
||||
SwitchNavInfo(true, true);
|
||||
}
|
||||
}).catch(error => {
|
||||
if (error.response.status === 401)
|
||||
{
|
||||
$('#adminUsername').css({'border-color':'red'});
|
||||
$('#adminPassword').css({'border-color':'red'});
|
||||
$('#AdminErrorText').css({'display':'block'});
|
||||
}
|
||||
else
|
||||
{
|
||||
console.log(error.response);
|
||||
}
|
||||
});
|
||||
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
function SwitchNavInfo(isLoggedIn, isAdmin) {
|
||||
if (isLoggedIn)
|
||||
{
|
||||
$('#NavUser').css({'display':'block'});
|
||||
$('#NavUser').text(`Welcome, ${isAdmin ? getCookie('userName') : getCookie('groupName')}!`);
|
||||
|
||||
$('#NavLogin').css({'display':'none'});
|
||||
$('#NavLogout').css({'display':'block'});
|
||||
|
||||
$('#LoginModal').modal('hide');
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#NavUser').css({'display':'none'});
|
||||
$('#NavUser').text(``);
|
||||
|
||||
$('#NavLogin').css({'display':'block'});
|
||||
$('#NavLogout').css({'display':'none'});
|
||||
}
|
||||
|
||||
if (isAdmin === undefined)
|
||||
{
|
||||
return
|
||||
}
|
||||
else
|
||||
{
|
||||
if (isAdmin)
|
||||
{
|
||||
if (isLoggedIn)
|
||||
{
|
||||
$('#AdminPanel').css({'display':'block'});
|
||||
|
||||
console.log('Logged In As Admin!');
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#AdminPanel').css({'display':'none'});
|
||||
|
||||
console.log('Logged Out As Admin!');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// Login end
|
||||
|
||||
// Logout start
|
||||
$('#NavLogout').click(function() {
|
||||
axios.get('/Backend/Controllers/Group/Logout.php').then(res => {
|
||||
if (res.status == 200)
|
||||
{
|
||||
SwitchNavInfo(false, isAdminLoggedIn);
|
||||
isAdminLoggedIn = false;
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error.response);
|
||||
});
|
||||
});
|
||||
// Logout end
|
||||
|
||||
function getCookie(name) {
|
||||
// Split cookie string and get all individual name=value pairs in an array
|
||||
var cookieArr = document.cookie.split(";");
|
||||
|
||||
// Loop through the array elements
|
||||
for(var i = 0; i < cookieArr.length; i++) {
|
||||
var cookiePair = cookieArr[i].split("=");
|
||||
|
||||
/* Removing whitespace at the beginning of the cookie name
|
||||
/* Removing whitespace at the beginning of the cookie name
|
||||
and compare it with the given string */
|
||||
if(name == cookiePair[0].trim()) {
|
||||
// Decode the cookie value and return
|
||||
return decodeURIComponent(cookiePair[1]);
|
||||
}
|
||||
}
|
||||
|
||||
// Return null if not found
|
||||
return null;
|
||||
if (name == cookiePair[0].trim()) {
|
||||
// Decode the cookie value and return
|
||||
return decodeURIComponent(cookiePair[1]);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Return null if not found
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue