feat: dynamic zoom hud

TonybynMp4 · Mar 11, 2024 · de06e4e · de06e4e
1 parent 46182f4
commit de06e4e
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 10 deletions.
diff --git a/client/main.lua b/client/main.lua
@@ -1,15 +1,16 @@
 local cam
 local inCam = false
 local cameraProp
-local FOV_MAX = 80.0
-local FOV_MIN = 7.5
+local FOV_MAX = 79.5
+local FOV_MIN = 7.6
 local ZOOM_SPEED = 10.0
-local fov = (FOV_MAX + FOV_MIN) * 0.5
+local DEFAULT_FOV = (FOV_MAX + FOV_MIN) * 0.5
+local fov = DEFAULT_FOV
 local pitch = 0.0
 
 local function helpText()
     SetTextComponentFormat("STRING")
-    AddTextComponentString(locale('help.exit')..': ~INPUT_CELLPHONE_CANCEL~\n'..locale('help.take')..': ~INPUT_CELLPHONE_SELECT~');
+    AddTextComponentString(locale('help.exit')..': ~INPUT_CELLPHONE_CANCEL~\n'..locale('help.take')..': ~INPUT_CELLPHONE_SELECT~')
     DisplayHelpTextFromStringLabel(0, false, true, 1)
 end
 
@@ -25,7 +26,7 @@ local function takePicture()
     end
 end
 
-local function HandleZoom()
+local function handleZoom()
     if IsControlJustPressed(0, 241) then
         fov = math.max(fov - ZOOM_SPEED, FOV_MIN)
     end
@@ -55,6 +56,7 @@ local function resetCamera()
     DisplayHud(true)
     DisplayRadar(true)
     ClearTimecycleModifier()
+    fov = DEFAULT_FOV
 end
 
 local function handleCameraControls()
@@ -68,17 +70,17 @@ end
 
 local function openCamera()
     SetNuiFocus(false, false)
-    DisplayHud(false);
-    DisplayRadar(false);
+    DisplayHud(false)
+    DisplayRadar(false)
     inCam = true
     SetTimecycleModifier("default")
     lib.requestAnimDict("amb@world_human_paparazzi@male@base", 1500)
     TaskPlayAnim(cache.ped, "amb@world_human_paparazzi@male@base", "base", 2.0, 2.0, -1, 51, 1, false, false, false)
 
     local coords = GetEntityCoords(cache.ped)
     cameraProp = CreateObject(`prop_pap_camera_01`, coords.x, coords.y, coords.z + 0.2, true, true, true)
-
     AttachEntityToEntity(cameraProp, cache.ped, GetPedBoneIndex(cache.ped, 28422), 0, 0, 0, 0, 0, 0, true, false, false, false, 2, true)
+
     cam = CreateCam("DEFAULT_SCRIPTED_CAMERA", true)
     AttachCamToEntity(cam, cameraProp, 0.075, -0.30, 0, true)
     SetCamRot(cam, 0.0, 0.0, GetEntityHeading(cameraProp) / 360, 2)
@@ -90,6 +92,17 @@ local function openCamera()
         toggle = true
     })
 
+    CreateThread(function()
+        while inCam do
+            local zoom = math.floor(((1/fov) * DEFAULT_FOV) * 100) / 100
+            SendNUIMessage({
+                message = 'updateZoom',
+                zoom = qbx.math.round(zoom, 2)
+            })
+            Wait(1000)
+        end
+    end)
+
     CreateThread(function()
         while inCam do
             if IsEntityDead(cache.ped) then
@@ -98,7 +111,7 @@ local function openCamera()
             end
             helpText()
             handleCameraControls()
-            HandleZoom()
+            handleZoom()
             if IsControlJustPressed(1, 176) or IsControlJustPressed(1, 24) then
                 inCam = false
                 qbx.playAudio({

diff --git a/html/main.js b/html/main.js
@@ -8,11 +8,18 @@ document.addEventListener('DOMContentLoaded', () => {
             cameraOverlay(event.data.toggle);
         } else if (event.data.message == 'photo') {
             togglePhoto(event.data);
+        } else if (event.data.message == 'updateZoom') {
+            updateZoom(event.data.zoom);
         }
     });
 });
 
-function closePhoto(event) {
+function updateZoom(zoom) {
+    const zoomElement = document.getElementById('zoom');
+    zoomElement.textContent = `${zoom}X ZOOM`;
+}
+
+function closePhoto(_) {
     fetch(`https://${GetParentResourceName()}/closePhoto`, {
         method: 'POST'
     });