Plate text colour change and reduced changePlate call

This commit is contained in:
Dan
2020-01-28 09:46:16 +00:00
parent 04e6d86318
commit bf2230cf23
4 changed files with 50 additions and 18 deletions

View File

@@ -106,10 +106,18 @@ READER.vars =
}
}
function READER:GetPlate( cam )
return self.vars[cam].plate
end
function READER:SetPlate( cam, plate )
self.vars.cams[cam].plate = plate
end
function READER:GetIndex( cam )
return self.vars[cam].index
end
function READER:SetIndex( cam, index )
self.vars.cams[cam].index = index
end
@@ -139,10 +147,12 @@ function READER:Main()
local cam = self:GetCamFromNum( i )
self:SetPlate( cam, plate )
self:SetIndex( cam, index )
if ( self:GetPlate( cam ) ~= plate ) then
self:SetPlate( cam, plate )
self:SetIndex( cam, index )
SendNUIMessage( { _type = "changePlate", cam = cam, plate = plate, index = index } )
SendNUIMessage( { _type = "changePlate", cam = cam, plate = plate, index = index } )
end
end
end
end
@@ -156,6 +166,7 @@ Citizen.CreateThread( function()
end
end )
--[[----------------------------------------------------------------------------------
Radar variables

View File

@@ -118,7 +118,15 @@ button:focus { outline: none; }
transform: translateX( -1px );
background-image: url( "images/bg_right.png" );
background-repeat: no-repeat;
}
}
.plate_blue {
color: rgb(0, 0, 163);
}
.plate_yellow {
color: rgb(255, 255, 0);
}
.arrow {
width: 11px;
@@ -705,13 +713,13 @@ button:focus { outline: none; }
grid-template-columns: 1fr;
justify-content: center;
}
#plateReader .plates .plate_container .text_container .text {
#plateReader .plates .plate_container .text_container p {
display: block;
font-family: "Plate-Font";
font-size: 58px;
text-align: center;
letter-spacing: -3px;
color: rgb(0, 0, 163);
/* color: rgb(0, 0, 163); */
padding-top: 5px;
margin: 0;
grid-column: 1;

View File

@@ -176,11 +176,10 @@
<img id="frontPlate" class="plate" src="images/plates/0.png">
<div id="frontPlateText" class="text_container">
<!-- <p id="frontPlateText" class="text">46EEK872</p> -->
<p class="text">46EEK872</p>
<p class="text hilite">46EEK872</p>
<p class="text lolite">46EEK872</p>
<p class="text shadow">46EEK872</p>
<p id="frontPlateTextFill" class="plate_blue">46EEK872</p>
<p class="hilite">46EEK872</p>
<p id="frontPlateTextLolite" class="lolite">46EEK872</p>
<p class="shadow">46EEK872</p>
</div>
</div>
@@ -188,11 +187,10 @@
<img id="rearPlate" class="plate" src="images/plates/0.png">
<div id="rearPlateText" class="text_container">
<!-- <p id="rearPlateText" class="text">46EEK872</p> -->
<p class="text">46EEK872</p>
<p class="text hilite">46EEK872</p>
<p class="text lolite">46EEK872</p>
<p class="text shadow">46EEK872</p>
<p id="rearPlateTextFill" class="plate_blue">46EEK872</p>
<p class="hilite">46EEK872</p>
<p id="rearPlateTextLolite" class="lolite">46EEK872</p>
<p class="shadow">46EEK872</p>
</div>
</div>
</div>

View File

@@ -78,11 +78,15 @@ const elements =
plates: {
front: {
text: $( "#frontPlateText" ),
fill: $( "#frontPlateTextFill" ),
lolite: $( "#frontPlateTextLolite" ),
img: $( "#frontPlate" )
},
rear: {
text: $( "#rearPlateText" ),
fill: $( "#rearPlateTextFill" ),
lolite: $( "#rearPlateTextLolite" ),
img: $( "#rearPlate" )
}
},
@@ -249,9 +253,20 @@ function setAntennaDirs( ant, dir, fastDir )
function setPlate( cam, plate, index )
{
elements.plates[cam].img.attr( "src", "images/plates/" + index + ".png" );
// Get the plate items
let pl = elements.plates[cam];
elements.plates[cam].text.find( "p" ).each( function( i, obj ) {
// Change the plate image
pl.img.attr( "src", "images/plates/" + index + ".png" );
// Change the plate text colour depending on the plate itself
( index == 1 || index == 2 ) ? pl.fill.removeClass( "plate_blue" ).addClass( "plate_yellow" ) : pl.fill.removeClass( "plate_yellow" ).addClass( "plate_blue" );
// If the plate is black or blue then we hide the lolite effect
( index == 1 || index == 2 ) ? pl.lolite.hide() : pl.lolite.show();
// Update all of the p elements with the new plate
pl.text.find( "p" ).each( function( i, obj ) {
$( this ).html( plate );
} );
}