Power button on UI works, added simulated startup, extra ray trace

cl_radar.lua

@@ -44,6 +44,7 @@ RADAR.vars =
 {
 	-- The radar's power
 	power = false, 
+	poweringUp = false, 
 
 	-- These are the settings that are used in the operator menu 
 	settings = {
@@ -129,7 +130,8 @@ RADAR.rayTraces = {
 	-- { startVec = { x = 5.0,   y = 15.0 }, endVec = { x = 5.0,    y = 150.0 }, rayType = "same" },
 	{ startVec = { x = 3.0 }, endVec = { x = 3.0, y = 150.0 }, rayType = "same" },
 	{ startVec = { x = -3.0 }, endVec = { x = -3.0, y = 150.0 }, rayType = "same" },
-	{ startVec = { x = -10.0 }, endVec = { x = -10.0, y = 150.0 }, rayType = "opp" }
+	{ startVec = { x = -10.0 }, endVec = { x = -10.0, y = 150.0 }, rayType = "opp" },
+	{ startVec = { x = -15.0 }, endVec = { x = -15.0, y = 150.0 }, rayType = "opp" }
 }
 
 -- Each of these are used for sorting the captured vehicle data, the 'strongest' filter is used for the main 
@@ -147,8 +149,32 @@ function RADAR:IsPowerOn()
 	return self.vars.power 
 end 
 
+function RADAR:IsPoweringUp()
+	return self.vars.poweringUp
+end 
+
+function RADAR:SetPoweringUpState( state )
+	self.vars.poweringUp = state 
+end 
+
 function RADAR:TogglePower()
 	self.vars.power = not self.vars.power 
+
+	SendNUIMessage( { _type = "radarPower", state = self:IsPowerOn() } )
+
+	-- Power is now turned on 
+	if ( self:IsPowerOn() ) then 
+		self:SetPoweringUpState( true )
+
+		Citizen.SetTimeout( 2000, function()
+			self:SetPoweringUpState( false )
+
+			SendNUIMessage( { _type = "poweredUp" } )
+		end )
+	else 
+		self:ResetAntenna( "front" )
+		self:ResetAntenna( "rear" )
+	end
 end
 
 function RADAR:IsFastDisplayEnabled()
@@ -438,6 +464,14 @@ function RADAR:SetAntennaFastLock( ant, state )
 	end 
 end 
 
+function RADAR:ResetAntenna( ant )
+	-- Overwrite default behaviour, this is because when the system is turned off, the temporary memory is
+	-- technically reset, as the setter functions require either the radar power to be on or the antenna to 
+	-- be transmitting, this is the only way to reset the values
+	self.vars.antennas[ant].xmit = false 
+	self.vars.antennas[ant].mode = 0
+end 
+
 
 --[[------------------------------------------------------------------------
 	Radar captured vehicle functions 
@@ -499,7 +533,7 @@ function RADAR:GetDynamicRadius( veh )
 		local min, max = GetModelDimensions( mdl )
 		local size = max - min 
 		local numericSize = size.x + size.y + size.z 
-		local dynamicRadius = UTIL:Clamp( ( numericSize * numericSize ) / 10, 4.0, 10.0 )
+		local dynamicRadius = UTIL:Clamp( ( numericSize * numericSize ) / 10, 5.0, 11.0 )
 
 		self:InsertDynamicRadiusData( key, dynamicRadius, numericSize )
 
@@ -635,7 +669,11 @@ end
 --[[------------------------------------------------------------------------
 	NUI callback
 ------------------------------------------------------------------------]]--
-RegisterNUICallback( "closeRemote", function( data )
+RegisterNUICallback( "togglePower", function()
+	RADAR:TogglePower()
+end )
+
+RegisterNUICallback( "closeRemote", function()
 	SetNuiFocus( false, false )
 end )
 
@@ -657,7 +695,7 @@ end )
 ------------------------------------------------------------------------]]--
 function RADAR:Main()
 	-- Check to make sure the player is in the driver's seat, and also that the vehicle has a class of VC_EMERGENCY (18)
-	if ( DoesEntityExist( PLY.veh ) and PLY.inDriverSeat and GetVehicleClass( PLY.veh ) == 18 and self:IsPowerOn() ) then 
+	if ( DoesEntityExist( PLY.veh ) and PLY.inDriverSeat and GetVehicleClass( PLY.veh ) == 18 and self:IsPowerOn() and not self:IsPoweringUp() ) then 
 		local plyVehPos = GetEntityCoords( PLY.veh )
 
 		-- First stage of the radar - get all of the vehicles hit by the radar

nui/radar.css

@@ -154,12 +154,20 @@ button:focus { outline: none; }
             background: linear-gradient( to bottom, rgba( 230, 230, 230, 0.8 ), rgb( 40, 168, 40 ) 10%, rgb( 0, 134, 0 ) );
             box-shadow: 0px 0px 3px 0px rgb( 80, 80, 80 );
             text-align: center;
-            font-family: 'Heebo-Regular';
+            /* font-family: 'Heebo-Regular'; */
             font-size: 14px;
             color: rgb( 34, 34, 34 );
             line-height: 45px;
             border-radius: 10px;
         }
+            #radar .pwr_button_container .pwr_button:hover {
+                background: linear-gradient( to bottom, rgba( 240, 240, 240, 0.8 ), rgb( 50, 178, 50 ) 10%, rgb( 0, 144, 0 ) );
+            }
+
+            #radar .pwr_button_container .pwr_button:active {
+                background: linear-gradient( to bottom, rgba( 220, 220, 220, 0.8 ), rgb( 30, 158, 30 ) 10%, rgb( 0, 124, 0 ) );
+                box-shadow: inset 0px 0px 3px 0px rgb( 80, 80, 80 );
+            }
 
     #radar .modes_container {
         display: grid;

nui/radar.html

@@ -15,7 +15,7 @@
 					<div class="label label_top">FRONT ANTENNA</div>
 
 					<div class="pwr_button_container">
-						<div class="pwr_button">PWR</div>
+						<div id="pwrBtn" class="pwr_button">PWR</div>
 					</div>
 
 					<div class="modes_container">

nui/radar.js

@@ -17,6 +17,7 @@ const elements =
 {
     radar: $( "#radarFrame" ),
     remote: $( "#rc" ), 
+    pwrBtn: $( "#pwrBtn" ), 
 
     patrolSpeed: $( "#patrolSpeed" ),
 
@@ -116,6 +117,10 @@ remoteButtons.toggleDisplay.click( function() {
     toggleRadar();
 } )
 
+elements.pwrBtn.click( function() {
+    togglePower();
+} )
+
 function toggleRadar()
 {
     elements.radar.fadeToggle();
@@ -126,12 +131,35 @@ function toggleRemote()
     elements.remote.toggle();
 }
 
+function togglePower()
+{
+    sendData( "togglePower", null ); 
+}
+
+function setLight( ant, cat, item, state )
+{
+    let obj = elements.antennas[ant][cat][item]; 
+
+    if ( state ) {
+        // if ( cat == "dirs" ) { obj.addClass( "active_arrow" ) } else { obj.addClass( "active" ) }; 
+        cat == "dirs" ? obj.addClass( "active_arrow" ) : obj.addClass( "active" ); 
+    } else {
+        // if ( cat == "dirs" ) { obj.removeClass( "active_arrow" ) } else { obj.removeClass( "active" ) }; 
+        cat == "dirs" ? obj.removeClass( "active_arrow" ) : obj.removeClass( "active" ); 
+    }
+}
+
 function clearModes( ant )
 {
     for ( let i in elements.antennas[ant].modes )
     {
         elements.antennas[ant].modes[i].removeClass( "active" ); 
     }
+
+    for ( let a in elements.antennas[ant].fast )
+    {
+        elements.antennas[ant].fast[a].removeClass( "active" ); 
+    }
 }
 
 function clearDirs( ant )
@@ -151,16 +179,13 @@ function clearAntenna( ant )
     elements.antennas[ant].fastSpeed.html( "¦¦¦" );
 }
 
-function setLight( ant, cat, item, state )
+function clearEverything()
 {
-    let obj = elements.antennas[ant][cat][item]; 
+    elements.patrolSpeed.html( "¦¦¦" ); 
 
-    if ( state ) {
+    for ( let i in elements.antennas ) 
-        // if ( cat == "dirs" ) { obj.addClass( "active_arrow" ) } else { obj.addClass( "active" ) }; 
+    {
-        cat == "dirs" ? obj.addClass( "active_arrow" ) : obj.addClass( "active" ); 
+        clearAntenna( i ); 
-    } else {
-        // if ( cat == "dirs" ) { obj.removeClass( "active_arrow" ) } else { obj.removeClass( "active" ) }; 
-        cat == "dirs" ? obj.removeClass( "active_arrow" ) : obj.removeClass( "active" ); 
     }
 }
 
@@ -209,6 +234,45 @@ function updateDisplays( ps, ants )
     }
 }
 
+// Simulation of the system powering up
+function poweringUp()
+{
+    elements.patrolSpeed.html( "888" ); 
+
+    for ( let i of [ "front", "rear" ] )
+    {
+        let e = elements.antennas[i];
+
+        e.targetSpeed.html( "888" ); 
+        e.fastSpeed.html( "888" ); 
+
+        for ( let a of [ "dirs", "modes", "fast" ] )
+        {
+            for ( let obj in e[a] )
+            {
+                a == "dirs" ? e[a][obj].addClass( "active_arrow" ) : e[a][obj].addClass( "active" ); 
+            }
+        }
+    }
+} 
+
+function poweredUp()
+{
+    clearEverything(); 
+
+    setAntennaXmit( "front", false );
+    setAntennaXmit( "rear", false );
+}
+
+function radarPower( state )
+{
+    if ( state ) {
+        poweringUp()
+    } else {
+        clearEverything();
+    }
+}
+
 // This function is used to send data back through to the LUA side 
 function sendData( name, data ) {
     $.post( "http://" + resourceName + "/" + name, JSON.stringify( data ), function( datab ) {
@@ -253,6 +317,12 @@ window.addEventListener( "message", function( event ) {
         case "openRemote":
             toggleRemote();
             break; 
+        case "radarPower":
+            radarPower( item.state );
+            break; 
+        case "poweredUp":
+            poweredUp();
+            break;
         case "update":
             updateDisplays( item.speed, item.antennas );
             break;