From d5cad4a91186b30dc395692c12626dab8552dc51 Mon Sep 17 00:00:00 2001 From: Github Date: Wed, 13 May 2020 15:44:38 +0100 Subject: [PATCH] Added progressbar --- client/functions.lua | 9 +++++++++ hud/app.css | 5 +++++ hud/index.html | 1 + hud/progressbars.js | 35 +++++++++++++++++++++++++++++++++++ 4 files changed, 50 insertions(+) create mode 100644 hud/progressbars.js diff --git a/client/functions.lua b/client/functions.lua index 82310ec9..115ef672 100644 --- a/client/functions.lua +++ b/client/functions.lua @@ -186,6 +186,15 @@ ESX.ShowFloatingHelpNotification = function(msg, coords, timeout) end +ESX.ShowProgressBar = function(time, text) + SendNUIMessage({ + type = "progressbar", + display = true, + time = time, + text = text + }) +end + ESX.TriggerServerCallback = function(name, cb, ...) ESX.ServerCallbacks[ESX.CurrentRequestId] = cb diff --git a/hud/app.css b/hud/app.css index d1ab073f..3dd2044b 100644 --- a/hud/app.css +++ b/hud/app.css @@ -12,3 +12,8 @@ html, body, #frames, #frames > div, #frames > div > iframe { left: 0; top: 0; } + +#pb { + display: none; + overflow: hidden; +} \ No newline at end of file diff --git a/hud/index.html b/hud/index.html index cf60df14..7f8d1a74 100644 --- a/hud/index.html +++ b/hud/index.html @@ -6,6 +6,7 @@
+
diff --git a/hud/progressbars.js b/hud/progressbars.js new file mode 100644 index 00000000..49365ee5 --- /dev/null +++ b/hud/progressbars.js @@ -0,0 +1,35 @@ +document.getElementById('ui').innerHTML = "
0%
"; +$(function(){ + window.onload = (e) => { + window.addEventListener('message', (event) => { + var item = event.data; + if (item !== undefined && item.type === "progressbar") { + if (item.display === true) { + $("#pb").show(); + var start = new Date(); + var maxTime = item.time; + var text = item.text; + var timeoutVal = Math.floor(maxTime/100); + animateUpdate(); + $('#pbar_innertext').text(text); + function updateProgress(percentage) { + $('#pbar_innerdiv').css("width", percentage + "%"); + } + function animateUpdate() { + var now = new Date(); + var timeDiff = now.getTime() - start.getTime(); + var perc = Math.round((timeDiff/maxTime)*100); + if (perc <= 100) { + updateProgress(perc); + setTimeout(animateUpdate, timeoutVal); + } else { + $("#pb").hide(); + } + } + } else { + $("#pb").hide(); + } + } + }); + }; +}); \ No newline at end of file