So, I would like to do several jobs with each job his icon
Because now my text its like these:
Can you Give me your script pls ?
For the Ui
if(event.data.job == ‘Chomeur’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
if(event.data.job == ‘Fermier’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
if(event.data.job == ‘Brasseur’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
if(event.data.job == ‘Mineur’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
if(event.data.job == ‘Dépanneur’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
if(event.data.job == ‘Bucheron’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
if(event.data.job == ‘Pecheur’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
if(event.data.job == ‘Vigneron’) {
$(’.job’).html(’
’ +addCommas(event.data.job)+’
}
Yeah but the Text it’s not Good look my text (UP)
Do you have a ts or a discord ?
so, do you come ? i wait you ^^
window.onload = function(e){
window.addEventListener('message', function(event){
if(event.data.job == 'Chômeur') {
$('.job').html('<p id="job"><img id="icon" src="job-icon.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Policier') {
$('.job').html('<p id="job"><img id="icon" src="job_police.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Ambulancier') {
$('.job').html('<p id="job"><img id="icon" src="job_ems.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Uber') {
$('.job').html('<p id="job"><img id="icon" src="job_taxi.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Dépanneur') {
$('.job').html('<p id="job"><img id="icon" src="job_depan.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Mineur') {
$('.job').html('<p id="job"><img id="icon" src="job_min.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Viticulteur') {
$('.job').html('<p id="job"><img id="icon" src="job_wine.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Boulanger') {
$('.job').html('<p id="job"><img id="icon" src="job_bou.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Traficant') {
$('.job').html('<p id="job"><img id="icon" src="job_drug.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Gouvernement') {
$('.job').html('<p id="job"><img id="icon" src="job_gouv.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
})
}
i think this will fix your bug. Not sure so test and text me babe
Hello ,
After installation I have display problem: / how to do
thank you
Attached my ui.html
<head>
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<script>
function addCommas(nStr) {
nStr += '';
var x = nStr.split('.');
var x1 = x[0];
var x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + '<span style="margin-left: 3px; margin-right: 3px;"/>' + '$2');
}
return x1 + x2;
}
window.onload = function(e){
window.addEventListener('message', function(event){
if(event.data.updateJob == true) {
if(event.data.job == 'Chomeur') {
$('.job').html('<p id="1"><img id="icon" src="job-icon.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Policier') {
$('.job').html('<p id="2"><img id="icon" src="lspd-icon.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Mineur') {
$('.job').html('<p id="4"><img id="icon" src="mineur.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Taxi') {
$('.job').html('<p id="5"><img id="icon" src="taxi.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Brassier') {
$('.job').html('<p id="6"><img id="icon" src="brassier.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Joallier') {
$('.job').html('<p id="7"><img id="icon" src="joallier.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Vigneron') {
$('.job').html('<p id="8"><img id="icon" src="vigneron.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Depanneur') {
$('.job').html('<p id="9"><img id="icon" src="depanneur.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Bucheron') {
$('.job').html('<p id="10"><img id="icon" src="bucheron.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
if(event.data.job == 'Ambulancier') {
$('.job').html('<p id="11"><img id="icon" src="ambulancier.png" alt=""/>' +addCommas(event.data.job)+'</p>')
}
}
})
}
</script>
<style>
@font-face {
font-family: 'pricedown';
src: url(pricedown.ttf);
}
* {
font-family: pricedown;
}
.container {
margin: 0;
padding: 0;
position: absolute;
top: 80;
right: 40;
width: 100px;
height: 200px;
}
#job {
float:right;
font-family: pricedown;
font-weight: 700;
font-size: 35px;
color: white;
padding: 4px;
text-shadow: -1px -1px 0 #FFFFFF, 1px -1px 0 #FFFFFF, -1px 1px 0 #FFFFFF, 1px 1px 0 #FFFFFF;
margin: 0;
margin-right: 6px;
}
#icon {
height: 21px;
width: auto;
margin-right: 10px;
}
#pre {
font-size: 0.8rem;
margin-right: 5px;
}
.job {
float:right;
font-family: pricedown;
font-weight: 700;
font-size: 35px;
color: white;
padding: 4px;
text-shadow: -1px -1px 0 #FFFFFF, 1px -1px 0 #FFFFFF, -1px 1px 0 #FFFFFF, 1px 1px 0 #FFFFFF;
margin: 0;
margin-right: 6px;
}
</style>
</head>
<body>
<div class="container">
<div class="job">
</div>
</div>
</body>
I want to put it under the bank and that it is readable ^^
</script>
<style>
@font-face {
font-family: 'pricedown';
src: url(pricedown.ttf);
}
* {
font-family: pricedown;
}
.container {
margin: 0;
padding: 0;
position: absolute;
top: 50;
right: 37;
width: 300px;
height: 300px;
}
#job {
float:right;
font-family: pricedown;
font-weight: 700;
font-size: 30px;
color: white;
padding: 4px;
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
margin: 0;
margin-right: 6px;
}
#icon {
height: 21px;
width: auto;
margin-right: 10px;
}
#pre {
font-size: 0.8rem;
margin-right: 5px;
}
.job {
display: inline-block;
height: 30px;
width: 100%;
}
</style>
</head>
<body>
<div class="container">
<div class="job">
</div>
</div>
</body>
I add your code and its me the poster as its
Why not recover in png and do like other icons
Hey guys thanks for this release. Is this for VRP or another framework?
From what I can gather of this thread, you’re trying to add icons to job roles yes?
Surely it would be much easier to go into the database, use https://www.emojicopy.com/ and then paste the emoji before the jobname?
Like so:
In game:
Literally no coding required. (Not sure if you can do this with the money and card symbols though) But this is the easiest way to do it for food and job icons 
Hopefully this helps anybody else wanting to do it in future
1 Like
i added a folder in img called job with inside all the jobs icons in png format… i was able to load the icon on (esx:playerLoaded) function… if i change job the icon stays the same until i exit and enter again in server… how can i do it to change icons with job name?
I added everything that I was supose to but I still get a simple error. I really don’t what it is and I know it is stupid but I was wandering if someone could help me.
For ESX?
Can you give new link please?