BREAKING CHANGE(es_extended): remove ESX.UI.HUD and hud functions

[core]/es_extended/client/functions.lua

@@ -6,12 +6,6 @@ Core.CurrentRequestId = 0
 Core.ServerCallbacks = {}
 Core.TimeoutCallbacks = {}
 Core.Input = {}
-ESX.UI = {}
-ESX.UI.HUD = {}
-ESX.UI.HUD.RegisteredElements = {}
-ESX.UI.Menu = {}
-ESX.UI.Menu.RegisteredTypes = {}
-ESX.UI.Menu.Opened = {}
 
 ESX.Game = {}
 ESX.Game.Utils = {}
@@ -210,70 +204,6 @@ function ESX.TriggerServerCallback(name, cb, ...)
     Core.CurrentRequestId = Core.CurrentRequestId < 65535 and Core.CurrentRequestId + 1 or 0
 end
 
-function ESX.UI.HUD.SetDisplay(opacity)
-    SendNUIMessage({
-        action = 'setHUDDisplay',
-        opacity = opacity
-    })
-end
-
-function ESX.UI.HUD.RegisterElement(name, index, priority, html, data)
-    local found = false
-
-    for i = 1, #ESX.UI.HUD.RegisteredElements, 1 do
-        if ESX.UI.HUD.RegisteredElements[i] == name then
-            found = true
-            break
-        end
-    end
-
-    if found then
-        return
-    end
-
-    ESX.UI.HUD.RegisteredElements[#ESX.UI.HUD.RegisteredElements + 1] = name
-
-    SendNUIMessage({
-        action = 'insertHUDElement',
-        name = name,
-        index = index,
-        priority = priority,
-        html = html,
-        data = data
-    })
-
-    ESX.UI.HUD.UpdateElement(name, data)
-end
-
-function ESX.UI.HUD.RemoveElement(name)
-    for i = 1, #ESX.UI.HUD.RegisteredElements, 1 do
-        if ESX.UI.HUD.RegisteredElements[i] == name then
-            table.remove(ESX.UI.HUD.RegisteredElements, i)
-            break
-        end
-    end
-
-    SendNUIMessage({
-        action = 'deleteHUDElement',
-        name = name
-    })
-end
-
-function ESX.UI.HUD.Reset()
-    SendNUIMessage({
-        action = 'resetHUDElements'
-    })
-    ESX.UI.HUD.RegisteredElements = {}
-end
-
-function ESX.UI.HUD.UpdateElement(name, data)
-    SendNUIMessage({
-        action = 'updateHUDElement',
-        name = name,
-        data = data
-    })
-end
-
 function ESX.UI.Menu.RegisterType(type, open, close)
     ESX.UI.Menu.RegisteredTypes[type] = {
         open = open,

[core]/es_extended/client/main.lua

@@ -118,23 +118,6 @@ AddEventHandler('esx:playerLoaded', function(xPlayer, isNew, skin)
 		end
 	end)
 
-	if Config.EnableHud then
-		for i=1, #(ESX.PlayerData.accounts) do
-			local accountTpl = '<div><img src="img/accounts/' .. ESX.PlayerData.accounts[i].name .. '.png"/>&nbsp;{{money}}</div>'
-			ESX.UI.HUD.RegisterElement('account_' .. ESX.PlayerData.accounts[i].name, i, 0, accountTpl, {money = ESX.Math.GroupDigits(ESX.PlayerData.accounts[i].money)})
-		end
-
-		local jobTpl = '<div>{{job_label}}{{grade_label}}</div>'
-
-		local gradeLabel = ESX.PlayerData.job.grade_label ~= ESX.PlayerData.job.label and ESX.PlayerData.job.grade_label or ''
-		if gradeLabel ~= '' then gradeLabel = ' - '..gradeLabel end
-
-		ESX.UI.HUD.RegisterElement('job', #ESX.PlayerData.accounts, 0, jobTpl, {
-			job_label = ESX.PlayerData.job.label,
-			grade_label = gradeLabel
-		})
-	end
-
 	SetDefaultVehicleNumberPlateTextPattern(-1, Config.CustomAIPlates)
 	StartServerSyncLoops()
 end)
@@ -142,7 +125,6 @@ end)
 RegisterNetEvent('esx:onPlayerLogout')
 AddEventHandler('esx:onPlayerLogout', function()
 	ESX.PlayerLoaded = false
-	if Config.EnableHud then ESX.UI.HUD.Reset() end
 end)
 
 RegisterNetEvent('esx:setMaxWeight')
@@ -227,12 +209,6 @@ AddEventHandler('esx:setAccountMoney', function(account)
 	end
 
 	ESX.SetPlayerData('accounts', ESX.PlayerData.accounts)
-
-	if Config.EnableHud then
-		ESX.UI.HUD.UpdateElement('account_' .. account.name, {
-			money = ESX.Math.GroupDigits(account.money)
-		})
-	end
 end)
 
 if not Config.OxInventory then
@@ -307,14 +283,6 @@ end
 
 RegisterNetEvent('esx:setJob')
 AddEventHandler('esx:setJob', function(Job)
-	if Config.EnableHud then
-		local gradeLabel = Job.grade_label ~= Job.label and Job.grade_label or ''
-		if gradeLabel ~= '' then gradeLabel = ' - '..gradeLabel end
-		ESX.UI.HUD.UpdateElement('job', {
-			job_label = Job.label,
-			grade_label = gradeLabel
-		})
-	end
 	ESX.SetPlayerData('job', Job)
 end)
 
@@ -379,32 +347,6 @@ if not Config.OxInventory then
 	end)
 end
 
--- Pause menu disables HUD display
-if Config.EnableHud then
-	CreateThread(function()
-		local isPaused = false
-		
-		while true do
-			local time = 500
-			Wait(time)
-
-			if IsPauseMenuActive() and not isPaused then
-				time = 100
-				isPaused = true
-				ESX.UI.HUD.SetDisplay(0.0)
-			elseif not IsPauseMenuActive() and isPaused then
-				time = 100
-				isPaused = false
-				ESX.UI.HUD.SetDisplay(1.0)
-			end
-		end
-	end)
-
-	AddEventHandler('esx:loadingScreenOff', function()
-		ESX.UI.HUD.SetDisplay(1.0)
-	end)
-end
-
 function StartServerSyncLoops()
 	if not Config.OxInventory then
 			-- keep track of ammo

[core]/es_extended/config.lua

@@ -19,7 +19,6 @@ Config.Accounts = {
 Config.StartingAccountMoney 	= {bank = 50000}
 
 Config.EnableSocietyPayouts 	= false -- pay from the society account that the player is employed at? Requirement: esx_society
-Config.EnableHud            	= false -- enable the default hud? Display current job and accounts (black, bank & cash)
 Config.MaxWeight            	= 24   -- the max inventory weight without backpack
 Config.PaycheckInterval         = 7 * 60000 -- how often to recieve pay checks in milliseconds
 Config.EnableDebug              = false -- Use Debug options?

[core]/es_extended/fxmanifest.lua

@@ -61,10 +61,6 @@ files {
 
 	'html/fonts/pdown.ttf',
 	'html/fonts/bankgothic.ttf',
-
-	'html/img/accounts/bank.png',
-	'html/img/accounts/black_money.png',
-	'html/img/accounts/money.png'
 }
 
 dependencies {

[core]/es_extended/html/css/app.css

@@ -1,88 +1,75 @@
 @font-face {
-	font-family: 'Pricedown';
-	src: url('../fonts/pdown.ttf')
+  font-family: 'Pricedown';
+  src: url('../fonts/pdown.ttf');
 }
 
 @font-face {
-	font-family: 'bankgothic';
-	src: url('../fonts/bankgothic.ttf')
+  font-family: 'bankgothic';
+  src: url('../fonts/bankgothic.ttf');
 }
 
 html {
-	overflow: hidden;
-}
-
-#hud {
-	opacity: 0.0;
-	position: absolute;
-	font-family: 'Pricedown';
-	font-size: 35px;
-	color: white;
-	padding: 4px;
-	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
-	text-align: right;
-	top: 80;
-	right: 40;
+  overflow: hidden;
 }
 
 #inventory_notifications {
-	font-family: bankgothic;
-	position: absolute;
-	right: 40;
-	bottom: 40;
-	font-size: 2em;
-	font-weight: bold;
-	color: #FFF;
-	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
+  font-family: bankgothic;
+  position: absolute;
+  right: 40;
+  bottom: 40;
+  font-size: 2em;
+  font-weight: bold;
+  color: #fff;
+  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
 }
 
 .menu {
-	font-family: 'Open Sans', sans-serif;
-	min-width: 400px;
-	min-height: 250px;
-	color: #fff;
-	position: absolute;
-	left: 40;
-	top: 0;
+  font-family: 'Open Sans', sans-serif;
+  min-width: 400px;
+  min-height: 250px;
+  color: #fff;
+  position: absolute;
+  left: 40;
+  top: 0;
 }
 
 .menu .head {
-	font-family: 'Open Sans', sans-serif;
-	font-size: 28px;
-	padding: 10px;
-	background: #1A1A1A;
-	border-bottom: 3px solid #BC1635;
-	border-radius: 10px 10px 0 0;
-	-webkit-border-radius: 10px 10px 0 0;
-	-moz-border-radius: 10px 10px 0 0;
-	-o-border-radius: 10px 10px 0 0;
-	box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
-	-webkit-box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
-	-moz-box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
-	-o-box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
-	box-shadow: 1px 1px 10px 4px rgba(0, 0, 0, 0.4);
+  font-family: 'Open Sans', sans-serif;
+  font-size: 28px;
+  padding: 10px;
+  background: #1a1a1a;
+  border-bottom: 3px solid #bc1635;
+  border-radius: 10px 10px 0 0;
+  -webkit-border-radius: 10px 10px 0 0;
+  -moz-border-radius: 10px 10px 0 0;
+  -o-border-radius: 10px 10px 0 0;
+  box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
+  -webkit-box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
+  -moz-box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
+  -o-box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.28);
+  box-shadow: 1px 1px 10px 4px rgba(0, 0, 0, 0.4);
 }
 
 .menu .head span {
-	font-family: 'Pricedown';
-	font-size: 28px;
-	padding-left: 15px;
-	padding-top: 6px;
+  font-family: 'Pricedown';
+  font-size: 28px;
+  padding-left: 15px;
+  padding-top: 6px;
 }
 
 .menu .menu-items .menu-item {
-	font-family: 'Open Sans', sans-serif;
-	font-size: 14px;
-	height: 40px;
-	display: block;
-	background-color: #f1f1f1;
-	box-shadow: inset 1px 0px 0px 1px #b8b8b8;
-	height: 32px;
-	line-height: 32px;
-	color: #3A3A3A;
-	text-align: center;
+  font-family: 'Open Sans', sans-serif;
+  font-size: 14px;
+  height: 40px;
+  display: block;
+  background-color: #f1f1f1;
+  box-shadow: inset 1px 0px 0px 1px #b8b8b8;
+  height: 32px;
+  line-height: 32px;
+  color: #3a3a3a;
+  text-align: center;
 }
 
 .menu .menu-items .menu-item.selected {
-	background-color: #ccc;
+  background-color: #ccc;
 }

[core]/es_extended/html/js/app.js

@@ -1,59 +1,5 @@
 (() => {
-
 	ESX = {};
-	ESX.HUDElements = [];
-
-	ESX.setHUDDisplay = function (opacity) {
-		$('#hud').css('opacity', opacity);
-	};
-
-	ESX.insertHUDElement = function (name, index, priority, html, data) {
-		ESX.HUDElements.push({
-			name: name,
-			index: index,
-			priority: priority,
-			html: html,
-			data: data
-		});
-
-		ESX.HUDElements.sort((a, b) => {
-			return a.index - b.index || b.priority - a.priority;
-		});
-	};
-
-	ESX.updateHUDElement = function (name, data) {
-		for (let i = 0; i < ESX.HUDElements.length; i++) {
-			if (ESX.HUDElements[i].name == name) {
-				ESX.HUDElements[i].data = data;
-			}
-		}
-
-		ESX.refreshHUD();
-	};
-
-	ESX.deleteHUDElement = function (name) {
-		for (let i = 0; i < ESX.HUDElements.length; i++) {
-			if (ESX.HUDElements[i].name == name) {
-				ESX.HUDElements.splice(i, 1);
-			}
-		}
-
-		ESX.refreshHUD();
-	};
-
-	ESX.resetHUDElements = function () {
-		ESX.HUDElements = [];
-		ESX.refreshHUD();
-	};
-
-	ESX.refreshHUD = function () {
-		$('#hud').html('');
-
-		for (let i = 0; i < ESX.HUDElements.length; i++) {
-			let html = Mustache.render(ESX.HUDElements[i].html, ESX.HUDElements[i].data);
-			$('#hud').append(html);
-		}
-	};
 
 	ESX.inventoryNotification = function (add, label, count) {
 		let notif = '';
@@ -79,35 +25,8 @@
 	};
 
 	window.onData = (data) => {
-		switch (data.action) {
-			case 'setHUDDisplay': {
-				ESX.setHUDDisplay(data.opacity);
-				break;
-			}
-
-			case 'insertHUDElement': {
-				ESX.insertHUDElement(data.name, data.index, data.priority, data.html, data.data);
-				break;
-			}
-
-			case 'updateHUDElement': {
-				ESX.updateHUDElement(data.name, data.data);
-				break;
-			}
-
-			case 'deleteHUDElement': {
-				ESX.deleteHUDElement(data.name);
-				break;
-			}
-
-			case 'resetHUDElements': {
-				ESX.resetHUDElements();
-				break;
-			}
-
-			case 'inventoryNotification': {
-				ESX.inventoryNotification(data.add, data.item, data.count);
-			}
+		if (data.action === 'inventoryNotification') {
+			ESX.inventoryNotification(data.add, data.item, data.count);
 		}
 	};
 
@@ -116,5 +35,4 @@
 			onData(event.data);
 		});
 	};
-
 })();

[core]/es_extended/html/ui.html

@@ -1,14 +1,12 @@
 <html>
-	<head>
-		<link rel="stylesheet" href="css/app.css" />
-	</head>
-	<body>
-		
-		<div id="hud"></div>
-		<div id="inventory_notifications"></div>
+  <head>
+    <link rel="stylesheet" href="css/app.css" />
+  </head>
+  <body>
+    <div id="inventory_notifications"></div>
 
-		<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
-		<script src="js/mustache.min.js"></script>
-		<script src="js/app.js"></script>
-	</body>
-</html>
+    <script src="nui://game/ui/jquery.js" type="text/javascript"></script>
+    <script src="js/mustache.min.js"></script>
+    <script src="js/app.js"></script>
+  </body>
+</html>