Improved form handling with verifying data

This commit is contained in:
ElPumpo
2018-04-15 18:42:08 +02:00
parent 76e2637419
commit e5f69f3362
6 changed files with 150 additions and 57 deletions
+2 -2
View File
@@ -11,7 +11,7 @@ client_script 'client/main.lua'
server_scripts {
"@mysql-async/lib/MySQL.lua",
"@es_extended/locale.lua",
"server/main.lua",
"server/main.lua"
}
ui_page 'html/index.html'
@@ -20,5 +20,5 @@ files {
'html/index.html',
'html/script.js',
'html/style.css',
'html/cursor.png',
'html/cursor.png'
}
+87 -4
View File
@@ -1,5 +1,13 @@
local guiEnabled = false
local myIdentity = {}
ESX = nil
Citizen.CreateThread(function()
while ESX == nil do
TriggerEvent('esx:getSharedObject', function(obj) ESX = obj end)
Citizen.Wait(0)
end
end)
function EnableGui(enable)
SetNuiFocus(enable)
@@ -21,11 +29,42 @@ RegisterNUICallback('escape', function(data, cb)
end)
RegisterNUICallback('register', function(data, cb)
local reason = ""
myIdentity = data
TriggerServerEvent('esx_identity:setIdentity', data)
EnableGui(false)
Citizen.Wait(500)
TriggerEvent('esx_skin:openSaveableMenu')
for theData, value in pairs(myIdentity) do
if theData == "firstname" or theData == "lastname" then
reason = verifyName(value)
if reason ~= "" then
break
end
elseif theData == "dateofbirth" then
if value == "invalid" then
reason = "Invalid date of birth!"
break
end
elseif theData == "height" then
local height = tonumber(value)
if height then
if height > 200 or height < 140 then
reason = "Unacceptable player height!"
break
end
else
reason = "Unacceptable player height!"
break
end
end
end
if reason == "" then
--TriggerServerEvent('esx_identity:setIdentity', data)
EnableGui(false)
Citizen.Wait(500)
--TriggerEvent('esx_skin:openSaveableMenu')
else
ESX.ShowNotification(reason)
end
end)
Citizen.CreateThread(function()
@@ -44,3 +83,47 @@ Citizen.CreateThread(function()
Citizen.Wait(10)
end
end)
function verifyName(name)
-- Don't allow short user names
local nameLength = string.len(name)
if nameLength > 25 or nameLength < 5 then
return 'Your player name is either too short or too long.'
end
-- Don't allow special characters (doesn't always work)
local count = 0
for i in name:gmatch('[abcdefghijklmnopqrstuvwxyzåäöABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ0123456789 -]') do
count = count + 1
end
if count ~= nameLength then
return 'Your player name contains special characters that are not allowed on this server.'
end
-- Does the player carry a first and last name?
--
-- Example:
-- Allowed: 'Bob Joe'
-- Not allowed: 'Bob'
-- Not allowed: 'Bob joe'
local spacesInName = 0
local spacesWithUpper = 0
for word in string.gmatch(name, '%S+') do
if string.match(word, '%u') then
spacesWithUpper = spacesWithUpper + 1
end
spacesInName = spacesInName + 1
end
if spacesInName > 2 then
return 'Your name contains more than two spaces'
end
if spacesWithUpper ~= spacesInName then
return 'your name must start with a capital letter.'
end
return ''
end
+4 -6
View File
@@ -1,8 +1,6 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
@@ -14,9 +12,9 @@
<input id="firstname" type="text" placeholder="First name"><br>
<input id="lastname" type="text" placeholder="Last name"><br>
<input id="dateofbirth" type="text" placeholder="Date of Birth (YYYY-MM-DD)"><br>
<input id="height" type="text" placeholder="Height (48-96)"><br><center>
<input id="male" type="radio" name="sex" value="male">Male
<input id="female" type="radio" name="sex" value="female">Female<br></center>
<input id="height" type="text" placeholder="Height (140-200 cm)"><br><center>
<input type="radio" name="sex" value="m" checked>Male
<input type="radio" name="sex" value="f">Female<br></center>
<button id="submit" type="submit">Create</button>
</form>
</div>
+40 -34
View File
@@ -6,47 +6,53 @@ var cursorX = documentWidth / 2;
var cursorY = documentHeight / 2;
function UpdateCursorPos() {
cursor.style.left = cursorX;
cursor.style.top = cursorY;
cursor.style.left = cursorX;
cursor.style.top = cursorY;
}
function Click(x, y) {
var element = $(document.elementFromPoint(x, y));
element.focus().click();
var element = $(document.elementFromPoint(x, y));
element.focus().click();
}
$(function() {
window.addEventListener('message', function(event) {
if (event.data.type == "enableui") {
cursor.style.display = event.data.enable ? "block" : "none";
document.body.style.display = event.data.enable ? "block" : "none";
} else if (event.data.type == "click") {
// Avoid clicking the cursor itself, click 1px to the top/left;
Click(cursorX - 1, cursorY - 1);
}
});
window.addEventListener('message', function(event) {
if (event.data.type == "enableui") {
cursor.style.display = event.data.enable ? "block" : "none";
document.body.style.display = event.data.enable ? "block" : "none";
} else if (event.data.type == "click") {
// Avoid clicking the cursor itself, click 1px to the top/left;
Click(cursorX - 1, cursorY - 1);
}
});
$(document).mousemove(function(event) {
cursorX = event.pageX;
cursorY = event.pageY;
UpdateCursorPos();
});
$(document).mousemove(function(event) {
cursorX = event.pageX;
cursorY = event.pageY;
UpdateCursorPos();
});
document.onkeyup = function (data) {
if (data.which == 27) { // Escape key
$.post('http://esx_identity/escape', JSON.stringify({}));
}
};
document.onkeyup = function (data) {
if (data.which == 27) { // Escape key
$.post('http://esx_identity/escape', JSON.stringify({}));
}
};
$("#register").submit(function(e) {
e.preventDefault(); // Prevent form from submitting
$.post('http://esx_identity/register', JSON.stringify({
firstname: $("#firstname").val(),
lastname: $("#lastname").val(),
dateofbirth: $("#dateofbirth").val(),
sex: $("#sex").val(),
height: $("#height").val()
}));
});
$("#register").submit(function(e) {
e.preventDefault(); // Prevent form from submitting
// Verify date
var date = $("#dateofbirth").val();
var dateCheck = new Date($("#dateofbirth").val());
if (dateCheck == "Invalid Date") {
date == "invalid";
}
$.post('http://esx_identity/register', JSON.stringify({
firstname: $("#firstname").val(),
lastname: $("#lastname").val(),
dateofbirth: date,
sex: $("input[type='radio'][name='sex']:checked").val(),
height: $("#height").val()
}));
});
});
+10 -5
View File
@@ -4,6 +4,13 @@
display: none;
}
/* Required */
body {
font-family: sans-serif;
overflow: hidden;
display: none;
}
.dialog {
width: 300px;
position: absolute;
@@ -13,15 +20,13 @@
right: 0;
padding: 10px;
box-shadow: 0px 0px 50px 0px #000;
background-color: #f1f1f1;
overflow: hidden;
}
form {
margin: 0;
opacity: 0.9;
}
input[type=text] {
width: 93%;
width: 100%;
padding: 7px;
text-align: center;
}
+7 -6
View File
@@ -133,7 +133,7 @@ function setIdentity(identifier, data, callback)
['@firstname'] = data.firstname,
['@lastname'] = data.lastname,
['@dateofbirth'] = data.dateofbirth,
['@sex'] = data.sex,
['@sex'] = data.sex,
['@height'] = data.height
},
function(done)
@@ -203,6 +203,7 @@ end)
AddEventHandler('es:playerLoaded', function(source)
getIdentity(source, function(data)
if data.firstname == '' then
print('do not register!')
TriggerClientEvent('esx_identity:showRegisterIdentity', source)
else
print('Successfully Loaded Identity For ' .. data.firstname .. ' ' .. data.lastname)
@@ -220,16 +221,16 @@ end, function(source, args, user)
TriggerClientEvent('chatMessage', source, "IDHelp", {255, 0, 0}, "Insufficienct permissions!")
end, {help = "List Your Characters"})
TriggerEvent('es:addCommand', 'register', function(source, args, user)
getCharacters(source, function(data)
if data.firstname3 ~= '' then
TriggerClientEvent('chatMessage', source, 'REGISTER', {255, 0, 0}, "You Can Only Have 3 Characters.")
else
TriggerClientEvent('esx_identity:showRegisterIdentity', source, {})
TriggerClientEvent('esx_identity:showRegisterIdentity', source)
end
end)
end)
end, {help = "Register a new character"})
TriggerEvent('es:addGroupCommand', 'char', "user", function(source, args, user)
getIdentity(source, function(data)
@@ -241,7 +242,7 @@ TriggerEvent('es:addGroupCommand', 'char', "user", function(source, args, user)
end)
end, function(source, args, user)
TriggerClientEvent('chatMessage', source, "SYSTEM", {255, 0, 0}, "Insufficienct permissions!")
end, {help = "List Your Current Active Character"})
end, {help = "List your current character"})
TriggerEvent('es:addGroupCommand', 'charlist', "user", function(source, args, user)
getCharacters(source, function(data)
@@ -403,4 +404,4 @@ TriggerEvent('es:addCommand', 'delchar', function(source, args, user)
TriggerClientEvent('chatMessage', source, "DELCHAR", {255, 0, 0}, "Failed To Delete Identity!")
end
end)
end)
end, {help = "Delete your character"})