mirror of
https://github.com/esx-framework/esx_core.git
synced 2026-08-29 09:18:53 +00:00
refactor(esx_identity) & fix(esx_textui) (#685)
This commit is contained in:
@@ -2,13 +2,13 @@
|
||||
|
||||
A Core Resource that Allows the player to Pick their characters, Name, Gender, Height and Date-of-birth.
|
||||
|
||||

|
||||

|
||||
|
||||
# Infomation
|
||||
|
||||
## Requirements
|
||||
|
||||
[esx_skin](./../esx_skin/README.md)
|
||||
[esx_skin](./../esx_skin/README.md)
|
||||
|
||||
## Commands
|
||||
|
||||
|
||||
@@ -10,12 +10,12 @@ end)
|
||||
|
||||
RegisterNetEvent('esx_identity:setPlayerData', function(data)
|
||||
SetTimeout(1, function()
|
||||
ESX.SetPlayerData("name", ('%s %s'):format(data.firstName, data.lastName))
|
||||
ESX.SetPlayerData('firstName', data.firstName)
|
||||
ESX.SetPlayerData('lastName', data.lastName)
|
||||
ESX.SetPlayerData('dateofbirth', data.dateOfBirth)
|
||||
ESX.SetPlayerData('sex', data.sex)
|
||||
ESX.SetPlayerData('height', data.height)
|
||||
ESX.SetPlayerData("name", ('%s %s'):format(data.firstName, data.lastName))
|
||||
ESX.SetPlayerData('firstName', data.firstName)
|
||||
ESX.SetPlayerData('lastName', data.lastName)
|
||||
ESX.SetPlayerData('dateofbirth', data.dateOfBirth)
|
||||
ESX.SetPlayerData('sex', data.sex)
|
||||
ESX.SetPlayerData('height', data.height)
|
||||
end)
|
||||
end)
|
||||
|
||||
|
||||
@@ -1,9 +1,7 @@
|
||||
|
||||
|
||||
ALTER TABLE `users`
|
||||
ADD COLUMN `firstname` VARCHAR(16) NULL DEFAULT NULL,
|
||||
ADD COLUMN `lastname` VARCHAR(16) NULL DEFAULT NULL,
|
||||
ADD COLUMN `dateofbirth` VARCHAR(10) NULL DEFAULT NULL,
|
||||
ADD COLUMN `sex` VARCHAR(1) NULL DEFAULT NULL,
|
||||
ADD COLUMN `height` INT NULL DEFAULT NULL
|
||||
;
|
||||
;
|
||||
@@ -6,10 +6,12 @@ description 'ESX Identity'
|
||||
lua54 'yes'
|
||||
version '1.8.5'
|
||||
|
||||
shared_script '@es_extended/imports.lua'
|
||||
shared_scripts {
|
||||
'@es_extended/imports.lua',
|
||||
'@es_extended/locale.lua',
|
||||
}
|
||||
|
||||
server_scripts {
|
||||
'@es_extended/locale.lua',
|
||||
'@oxmysql/lib/MySQL.lua',
|
||||
'locales/*.lua',
|
||||
'config.lua',
|
||||
@@ -17,7 +19,6 @@ server_scripts {
|
||||
}
|
||||
|
||||
client_scripts {
|
||||
'@es_extended/locale.lua',
|
||||
'locales/*.lua',
|
||||
'config.lua',
|
||||
'client/main.lua'
|
||||
@@ -31,4 +32,4 @@ files {
|
||||
'html/css/style.css',
|
||||
}
|
||||
|
||||
dependency 'es_extended'
|
||||
dependency 'es_extended'
|
||||
@@ -1,23 +1,24 @@
|
||||
<html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
<script src="nui://game/ui/jquery.js"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
|
||||
<link href="css/style.css" rel="stylesheet" type="text/css" />
|
||||
<link href="css/style.css" rel="stylesheet">
|
||||
|
||||
<title>ESX Identity</title>
|
||||
</head>
|
||||
|
||||
<body onkeydown="TriggeredKey(this)">
|
||||
<div class="dialog">
|
||||
<div class="title"><b>IDENTITY</b></div>
|
||||
<!-- <img id="logo" height="110px" width="332px"> > -->
|
||||
<form id="register" name="register" action="#">
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif";>First Name</div>
|
||||
<input id="firstname" type="text" class="" name="firstname" placeholder="First Name"><br>
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif";>Last Name</div>
|
||||
<input id="lastname" type="text" class="" name="lastname" placeholder="Last Name"><br>
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif", sans-serif;>Date of Birth (MM/DD/YYYY)</div>
|
||||
<input id="dateofbirth" type="date" name="dateofbirth" class="" placeholder="Date of Birth (dd/mm/yyyy)" min="01/01/1900" max="01/01/2010" onfocus="(this.type='date')"><br>
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif", sans-serif;>Height</div>
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif">First Name</div>
|
||||
<input id="firstname" type="text" class="" name="firstname" placeholder="First Name" minlength="3" maxlength="8" pattern="[a-zA-Z]*"><br>
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif">Last Name</div>
|
||||
<input id="lastname" type="text" class="" name="lastname" placeholder="Last Name" minlength="3" maxlength="10" pattern="[a-zA-Z]*"><br>
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif">Date of Birth (MM/DD/YYYY)</div>
|
||||
<input id="dateofbirth" type="date" name="dateofbirth" class="" min="1900-01-01" max="2010-01-01" onfocus="(this.type='date')"><br>
|
||||
<div style="color: rgb(46, 187, 205);font-size: 12px; font-family: 'Gill Sans', sans-serif">Height</div>
|
||||
<input id="height" type="number" class="" name="height" min="120" max="220" placeholder="Height (cm)"><br>
|
||||
<center>
|
||||
<div class="radio-toolbar">
|
||||
@@ -32,74 +33,13 @@
|
||||
</form>
|
||||
<center><font size="1px" color="green">If the submit button doesn't work, please ensure that you've entered the fields correctly.</font></center>
|
||||
</div>
|
||||
<script>
|
||||
const allRanges = document.querySelectorAll(".range-wrap");
|
||||
allRanges.forEach(wrap => {
|
||||
const range = wrap.querySelector(".range");
|
||||
const bubble = wrap.querySelector(".bubble");
|
||||
|
||||
range.addEventListener("input", () => {
|
||||
setBubble(range, bubble);
|
||||
});
|
||||
setBubble(range, bubble);
|
||||
});
|
||||
|
||||
function setBubble(range, bubble) {
|
||||
const val = range.value;
|
||||
const min = range.min ? range.min : 0;
|
||||
const max = range.max ? range.max : 100;
|
||||
const newVal = Number(((val - min) * 100) / (max - min));
|
||||
bubble.innerHTML = 'Height: ' + val;
|
||||
bubble.style.left = `calc(${newVal}% + (${8 - newVal * 0.15}px))`;
|
||||
}
|
||||
|
||||
var myFirstName = document.getElementById('firstname');
|
||||
var myLastName = document.getElementById('lastname');
|
||||
var myDOB = document.getElementById('dateofbirth');
|
||||
var myHeight = document.getElementById('height');
|
||||
|
||||
function isNumber(e) {
|
||||
var key=e.which || e.KeyCode;
|
||||
if ( key >=48 && key <= 57) {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function checkDOB() {
|
||||
var date = new Date($('#dateofbirth').val());
|
||||
day = date.getDate();
|
||||
month = date.getMonth() + 1;
|
||||
year = date.getFullYear();
|
||||
if (isNaN(month) || isNaN(day) || isNaN(year)) {
|
||||
myDOB.style.backgroundColor = '#E06666';
|
||||
myDOB.style.color = 'black';
|
||||
}
|
||||
else {
|
||||
var dateInput = [day, month, year].join('/');
|
||||
|
||||
var regExp = /^(\d{1,2})(\/|-)(\d{1,2})(\/|-)(\d{4})$/;
|
||||
var dateArray = dateInput.match(regExp);
|
||||
|
||||
if (dateArray == null){
|
||||
return false;
|
||||
}
|
||||
|
||||
month = dateArray[1];
|
||||
day= dateArray[3];
|
||||
year = dateArray[5];
|
||||
}
|
||||
}
|
||||
|
||||
<script>
|
||||
function TriggeredKey(e) {
|
||||
var keycode;
|
||||
if (window.event) keycode = window.event.keyCode;
|
||||
if (window.event.keyCode == 13 || window.event.keyCode == 27) return false;
|
||||
}
|
||||
</script>
|
||||
<script src="js/script.js" type="text/javascript"></script>
|
||||
<script src="js/script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,35 +1,38 @@
|
||||
$(function() {
|
||||
$.post('http://esx_identity/ready', JSON.stringify({}))
|
||||
$(document).ready(function () {
|
||||
$.post("http://esx_identity/ready", JSON.stringify({}));
|
||||
|
||||
window.addEventListener('message', function(event) {
|
||||
if (event.data.type === "enableui") {
|
||||
document.body.style.display = event.data.enable ? "block" : "none"
|
||||
}
|
||||
})
|
||||
window.addEventListener("message", function (event) {
|
||||
if (event.data.type === "enableui") {
|
||||
event.data.enable ? $(document.body).show() : $(document.body).hide();
|
||||
}
|
||||
});
|
||||
|
||||
$("#register").submit(function(event) {
|
||||
event.preventDefault() // Prevent form from submitting
|
||||
|
||||
// Verify date
|
||||
var date = $("#dateofbirth").val()
|
||||
var dateCheck = new Date($("#dateofbirth").val())
|
||||
|
||||
if (dateCheck == "Invalid Date") {
|
||||
date == "invalid"
|
||||
} else {
|
||||
const ye = new Intl.DateTimeFormat('en', { year: 'numeric' }).format(dateCheck)
|
||||
const mo = new Intl.DateTimeFormat('en', { month: '2-digit' }).format(dateCheck)
|
||||
const da = new Intl.DateTimeFormat('en', { day: '2-digit' }).format(dateCheck)
|
||||
|
||||
var formattedDate = `${da}/${mo}/${ye}`
|
||||
|
||||
$.post('http://esx_identity/register', JSON.stringify({
|
||||
firstname: $("#firstname").val(),
|
||||
lastname: $("#lastname").val(),
|
||||
dateofbirth: formattedDate,
|
||||
sex: $("input[type='radio'][name='sex']:checked").val(),
|
||||
height: $("#height").val()
|
||||
}))
|
||||
}
|
||||
})
|
||||
})
|
||||
$("#register").submit(function (event) {
|
||||
event.preventDefault();
|
||||
|
||||
const dateCheck = new Date($("#dateofbirth").val());
|
||||
|
||||
const year = new Intl.DateTimeFormat("en", { year: "numeric" }).format(
|
||||
dateCheck
|
||||
);
|
||||
const month = new Intl.DateTimeFormat("en", { month: "2-digit" }).format(
|
||||
dateCheck
|
||||
);
|
||||
const day = new Intl.DateTimeFormat("en", { day: "2-digit" }).format(
|
||||
dateCheck
|
||||
);
|
||||
|
||||
const formattedDate = `${day}/${month}/${year}`;
|
||||
|
||||
$.post(
|
||||
"http://esx_identity/register",
|
||||
JSON.stringify({
|
||||
firstname: $("#firstname").val(),
|
||||
lastname: $("#lastname").val(),
|
||||
dateofbirth: formattedDate,
|
||||
sex: $("input[type='radio'][name='sex']:checked").val(),
|
||||
height: $("#height").val(),
|
||||
})
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 943 KiB |
@@ -5,8 +5,8 @@ Debug = ESX.GetConfig().EnableDebug
|
||||
local function TextUI(message, type)
|
||||
SendNUIMessage({
|
||||
action = 'show',
|
||||
message = message or 'ESX-TextUI',
|
||||
type = type or 'info'
|
||||
message = message and message or 'ESX-TextUI',
|
||||
type = type ~= 0 and type or 'info'
|
||||
})
|
||||
end
|
||||
|
||||
|
||||
Reference in New Issue
Block a user