User Registration Frontend

This commit is contained in:
2020-07-01 22:13:50 +02:00
parent 23be9fb6d0
commit 86f9e12b87
10 changed files with 198 additions and 166 deletions

46
js/account.js Normal file
View File

@@ -0,0 +1,46 @@
$(document).ready(function () {
function showAlert(type, msg) {
let alert = $("#alertMessage");
alert.text(msg);
alert.attr("class", "mt-2 alert alert-" + type);
alert.show();
}
function hideAlert() {
$("#alertMessage").hide();
}
$("#btnRegister").click(function (e) {
e.preventDefault();
e.stopPropagation();
let btn = $(this);
let username = $("#username").val().trim();
let email = $("#email").val().trim();
let password = $("#password").val();
let confirmPassword = $("#confirmPassword").val();
if (username === '' || email === '' || password === '' || confirmPassword === '') {
showAlert("danger", "Please fill out every field.");
} else if(password !== confirmPassword) {
showAlert("danger", "Your passwords did not match.");
} else {
let textBefore = btn.text();
let params = { username: username, email: email, password: password, confirmPassword: confirmPassword };
btn.prop("disabled", true);
btn.html("Submitting… <i class='fas fa-spin fa-spinner'></i>")
jsCore.apiCall("user/register", params, (res) => {
btn.prop("disabled", false);
btn.text(textBefore);
if (!res.success) {
showAlert("danger", res.msg);
} else {
showAlert("success", "Account successfully created, check your emails.");
$("input").val("");
}
});
}
});
});

4
js/jquery.min.js vendored
View File

File diff suppressed because one or more lines are too long

View File

@@ -3,32 +3,20 @@ let Core = function () {
this.__construct = function () {
this.url = document.location.href;
this.parseParameters();
this.langEntries = {};
};
this.apiCall = function (func, aParams, callback, onerror) {
aParams = typeof aParams !== 'undefined' ? aParams : {};
this.apiCall = function (func, params, callback) {
params = typeof params !== 'undefined' ? params : {};
callback = typeof callback !== 'undefined' ? callback : function (data) {};
onerror = typeof onerror !== 'undefined' ? onerror : function (msg) {
bootbox.alert("An error occurred: " + msg);
};
const path = '/api' + (func.startsWith('/') ? '' : '/') + func;
$.post(path, aParams, function (data) {
const path = '/api/' + (func.startsWith('/') ? '' : '/') + func;
$.post(path, params, function (data) {
console.log(func + "(): success=" + data.success + " msg=" + data.msg);
if (data.hasOwnProperty('logoutIn') && $("#logoutTimer").length > 0) {
$("#logoutTimer").attr("data-time", data.logoutIn);
}
if (!data.success) {
onerror.call(this, data.msg);
} else {
callback.call(this, data);
}
callback.call(this, data);
}, "json").fail(function (jqXHR, textStatus, errorThrown) {
console.log("API-Function Error: " + func + " Status: " + textStatus + " error thrown: " + errorThrown);
onerror.call(this, "An error occurred. API-Function: " + func + " Status: " + textStatus + " - " + errorThrown);
let msg = func + " Status: " + textStatus + " error thrown: " + errorThrown;
console.log("API-Function Error: " + msg);
callback.call(this, {success: false, msg: "An error occurred. API-Function: " + msg });
});
};
@@ -48,18 +36,6 @@ let Core = function () {
return "";
};
this.addLangEntry = function (key, val) {
this.langEntries[key] = val;
};
this.getLangEntry = function (key) {
if (typeof this.langEntries[key] !== 'undefined' && this.langEntries.hasOwnProperty(key)) {
return this.langEntries[key];
}
return key;
};
this.getUrl = function () {
return this.url;
};
@@ -155,10 +131,6 @@ let Core = function () {
this.url = this.url.substring(0, this.url.indexOf('?'));
};
this.logout = function () {
this.apiCall('user/logout');
};
this.getJsonDateTime = function (date) {
return date.getFullYear() + "-" +
((date.getMonth() + 1 < 10) ? "0" : "") + (date.getMonth() + 1) + "-" +
@@ -176,105 +148,7 @@ let Core = function () {
return this.getJsonDateTime(date).split(' ')[1];
};
this.showInputDialog = function (title, aInputs, callback, element, onCreated) {
title = typeof title !== "undefined" ? title : "";
aInputs = typeof aInputs !== "undefined" ? aInputs : {};
callback = typeof callback !== "undefined" ? callback : function (aResult, element) {
};
onCreated = typeof onCreated !== "undefined" ? onCreated : function () {
};
var html = '<div class="modal-header"><h4 class="modal-title">' + title + '</h4></div>' +
'<form class="bootbox-form">';
for (var i in aInputs) {
var input = aInputs[i];
if (input.type !== "hidden" && input.type !== "checkbox")
html += '<label for="' + input.name + '">' + input.name + ':</label>';
if (input.type === "select") {
html += '<select id="' + input.id + '" class="bootbox-input bootbox-input-select form-control">';
var aValues = (input.hasOwnProperty("aValues") && typeof input.aValues !== "undefined") ? input.aValues : {};
for (var value in aValues) {
var name = aValues[value];
var selected = (input.value === value) ? " selected" : "";
html += '<option value="' + value + '"' + selected + '>' + name + '</option>';
}
html += '</select>';
input.type = "select";
} else if (input.type === "checkbox") {
html += '<div class="checkbox">' +
'<label><table><tr>' +
'<td style="vertical-align:top;padding-top:3px;">' +
'<input class="bootbox-input bootbox-input-checkbox" id="' + input.id + '" value="1" type="checkbox"' + (input.value ? " checked" : "") + '>' +
'</td>' +
'<td style="padding-left: 5px;">' + input.text + '</td>' +
'</tr></table></label>' +
'</div>';
} else if (input.type === "date") {
html += '<input class="bootbox-input form-control customDatePicker" autocomplete="off" ' +
'type="text" ' +
'name="' + input.name + '" ' +
'id="' + input.id + '" ' +
'value="' + (input.value ? input.value : "") + '"' + (input.readonly ? " readonly" : "") +
(input.maxlength ? ' maxlength="' + input.maxlength + '"' : '') + '>';
} else if (input.type === "time") {
html += '<div class="input-group">' +
'<input class="bootbox-input" autocomplete="off" value="0" pattern="[0-9][0-9]" type="number" name="' + input.name + '" id="' + input.id + 'Hour" style="width:60px;text-align: center">' +
'<span>:</span>' +
'<input class="bootbox-input" autocomplete="off" type="number" name="' + input.name + '" id="' + input.id + 'Minute" value="00" style="width:60px;text-align: center">' +
'</div>';
} else {
html += '<input class="bootbox-input form-control" autocomplete="off" ' +
'type="' + input.type + '" ' +
'name="' + input.name + '" ' +
'id="' + input.id + '" ' +
'value="' + (input.value ? input.value : "") + '"' + (input.readonly ? " readonly" : "") +
(input.maxlength ? ' maxlength="' + input.maxlength + '"' : '') + '>';
}
}
html += '</form>';
var dialog = bootbox.confirm(html, function (result) {
if (result) {
var aResult = [];
for (var i in aInputs) {
var input = aInputs[i];
var value = $("#" + input.id).val();
if (input.type === "select")
value = $("#" + input.id).find(":selected").val();
else if (input.type === "checkbox")
value = $("#" + input.id).prop("checked");
aResult[input.id] = value;
}
callback.call(this, aResult, element);
}
});
dialog.init(function () {
$(".modal-body").on("keypress", "input", function (e) {
if (e.keyCode === 13) {
e.preventDefault();
$(".modal-footer .btn-primary").click();
}
});
onCreated.call(this);
});
};
this.__construct();
};
let jsCore = new Core();
$(document).ready(function() {
});
function createLoadingIcon() {
return '<i class="fas fa-spin fa-spinner"></i>';
}
let jsCore = new Core();