feat(menu): Open Menu with specified item index selected

* Allows a user to pass in a start index to have pre-selected when a menu is opening
* Cleaned up whitespace inconsistencies in menu.lua
This commit is contained in:
Jag
2022-09-17 11:03:10 -07:00
parent cd8e4bbd4d
commit 47163748d5
2 changed files with 30 additions and 27 deletions

View File

@@ -3,14 +3,14 @@ local openMenu = nil
local keepInput = IsNuiFocusKeepingInput() local keepInput = IsNuiFocusKeepingInput()
function lib.registerMenu(data, cb) function lib.registerMenu(data, cb)
if not data.id then return error('No menu id was provided.') end if not data.id then return error('No menu id was provided.') end
if not data.title then return error('No menu title was provided.') end if not data.title then return error('No menu title was provided.') end
if not data.options then return error('No menu options were provided.') end if not data.options then return error('No menu options were provided.') end
data.cb = cb data.cb = cb
registeredMenus[data.id] = data registeredMenus[data.id] = data
end end
function lib.showMenu(id) function lib.showMenu(id, startIndex)
local menu = registeredMenus[id] local menu = registeredMenus[id]
if not menu then if not menu then
@@ -38,16 +38,17 @@ function lib.showMenu(id)
SetNuiFocusKeepInput(true) SetNuiFocusKeepInput(true)
end end
SetNuiFocus(true, false) SetNuiFocus(true, false)
SendNUIMessage({ SendNUIMessage({
action = 'setMenu', action = 'setMenu',
data = { data = {
position = menu.position, position = menu.position,
canClose = menu.canClose, canClose = menu.canClose,
title = menu.title, title = menu.title,
items = menu.options items = menu.options,
} startItemIndex = startIndex and startIndex - 1 or 0
}) }
})
end end
local function resetFocus() local function resetFocus()
@@ -81,7 +82,7 @@ end
function lib.getOpenMenu() return openMenu end function lib.getOpenMenu() return openMenu end
RegisterNUICallback('confirmSelected', function(data, cb) RegisterNUICallback('confirmSelected', function(data, cb)
cb(1) cb(1)
data[1] += 1 -- selected data[1] += 1 -- selected
if data[2] then if data[2] then
@@ -89,8 +90,8 @@ RegisterNUICallback('confirmSelected', function(data, cb)
end end
local menu = openMenu local menu = openMenu
if menu.options[data[1]].close ~= false then if menu.options[data[1]].close ~= false then
resetFocus() resetFocus()
openMenu = nil openMenu = nil
end end
@@ -98,7 +99,6 @@ RegisterNUICallback('confirmSelected', function(data, cb)
if menu.cb then if menu.cb then
menu.cb(data[1], data[2], menu.options[data[1]].args) menu.cb(data[1], data[2], menu.options[data[1]].args)
end end
end) end)
RegisterNUICallback('changeIndex', function(data, cb) RegisterNUICallback('changeIndex', function(data, cb)
@@ -115,8 +115,8 @@ RegisterNUICallback('changeIndex', function(data, cb)
end) end)
RegisterNUICallback('changeSelected', function(data, cb) RegisterNUICallback('changeSelected', function(data, cb)
cb(1) cb(1)
if not openMenu.onSelected then return end if not openMenu.onSelected then return end
data[1] += 1 -- selected data[1] += 1 -- selected
@@ -128,13 +128,13 @@ RegisterNUICallback('changeSelected', function(data, cb)
end) end)
RegisterNUICallback('closeMenu', function(data, cb) RegisterNUICallback('closeMenu', function(data, cb)
cb(1) cb(1)
resetFocus() resetFocus()
local menu = openMenu local menu = openMenu
openMenu = nil openMenu = nil
if menu.onClose then if menu.onClose then
menu.onClose() menu.onClose()
end end
end) end)

View File

@@ -23,6 +23,7 @@ export interface MenuSettings {
title: string; title: string;
canClose?: boolean; canClose?: boolean;
items: Array<MenuItem>; items: Array<MenuItem>;
startItemIndex?: number;
} }
const ListMenu: React.FC = () => { const ListMenu: React.FC = () => {
@@ -121,7 +122,9 @@ const ListMenu: React.FC = () => {
useNuiEvent('closeMenu', () => closeMenu(true)); useNuiEvent('closeMenu', () => closeMenu(true));
useNuiEvent('setMenu', (data: MenuSettings) => { useNuiEvent('setMenu', (data: MenuSettings) => {
setSelected(0); if (!data.startItemIndex || data.startItemIndex < 0) data.startItemIndex = 0;
else if (data.startItemIndex >= data.items.length) data.startItemIndex = data.items.length - 1;
setSelected(data.startItemIndex);
if (!data.position) data.position = 'top-left'; if (!data.position) data.position = 'top-left';
listRefs.current = []; listRefs.current = [];
setMenu(data); setMenu(data);
@@ -131,7 +134,7 @@ const ListMenu: React.FC = () => {
if (Array.isArray(data.items[i].values)) arrayIndexes[i] = (data.items[i].defaultIndex || 1) - 1; if (Array.isArray(data.items[i].values)) arrayIndexes[i] = (data.items[i].defaultIndex || 1) - 1;
} }
setIndexStates(arrayIndexes); setIndexStates(arrayIndexes);
listRefs.current[0]?.focus(); listRefs.current[data.startItemIndex]?.focus();
}); });
return ( return (