From f5e55c472874289f4023f3bf6f2981c61169764a Mon Sep 17 00:00:00 2001
From: Dan <WolfKnight98@users.noreply.github.com>
Date: Fri, 13 Nov 2020 17:32:34 +0000
Subject: [PATCH] Updated key lock message

The key lock message now reads "Radar key binds enabled" and "Radar key binds blocked". Green and red are also used to signify the state of the key binds, this hopefully makes it a bit more clear what it does, as well as the state of the key lock.
---
 nui/radar.css  |  8 ++++++++
 nui/radar.html |  2 +-
 nui/radar.js   | 14 ++++++++++++--
 3 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/nui/radar.css b/nui/radar.css
index 71cd123..d51186a 100644
--- a/nui/radar.css
+++ b/nui/radar.css
@@ -159,6 +159,14 @@ button:focus { outline: none; }
 	color: rgb(255, 255, 0);
 }
 
+.green {
+	color: rgb( 0, 255, 0 );
+}
+
+.red {
+	color: rgb( 255, 0, 0 );
+}
+
 .arrow {
 	width: 11px;
 	height: 15.4px;
diff --git a/nui/radar.html b/nui/radar.html
index 2e8b232..48d10f9 100644
--- a/nui/radar.html
+++ b/nui/radar.html
@@ -300,7 +300,7 @@
 			<button id="closeUiSettings" class="close">CLOSE</button>
 		</div>
 		
-		<p id="keyLockLabel">Radar key lock <span id="keyLockStateLabel"></span></p>
+		<p id="keyLockLabel">Radar key binds <span id="keyLockStateLabel"></span></p>
 
 		<div id="helpWindow">
 			<iframe id="helpWeb" src="about:blank"></iframe>
diff --git a/nui/radar.js b/nui/radar.js
index 9914771..39d6072 100644
--- a/nui/radar.js
+++ b/nui/radar.js
@@ -605,17 +605,27 @@ function menu( optionText, option )
 	elements.patrolSpeed.html( option );
 }
 
+var keyLockTimeout; 
+
 // Makes the key lock label fade in then fade out after 2 seconds
 function displayKeyLock( state )
 {
+	let sl = elements.keyLock.stateLabel; 
+
 	// Set the state label text to enabled or disabled
-	elements.keyLock.stateLabel.html( state ? "enabled" : "disabled" );
+	sl.html( state ? "blocked" : "enabled" );
+
+	// Change the colour of the altered text 
+	state ? sl.addClass( "red" ).removeClass( "green" ) : sl.addClass( "green" ).removeClass( "red" );
 
 	// Fade in the label 
 	elements.keyLock.label.fadeIn();
 
+	// Clear the timeout if it already exists 
+	clearTimeout( keyLockTimeout );
+
 	// Make the label fade out after 2 seconds
-	setTimeout( function() {
+	keyLockTimeout = setTimeout( function() {
 		elements.keyLock.label.fadeOut();
 	}, 2000 ); 
 }