feat(esx_multicharacter): esx_context added

[esx]/esx_multicharacter/client/main.lua

@@ -8,7 +8,7 @@ if ESX.GetConfig().Multichar then
 			if NetworkIsPlayerActive(PlayerId()) then
 				exports.spawnmanager:setAutoSpawn(false)
 				DoScreenFadeOut(0)
-				while not GetResourceState('esx_menu_default') == 'started' do
+				while not GetResourceState('esx_context') == 'started' do
 					Wait(0)
 				end
 				TriggerEvent("esx_multicharacter:SetupCharacters")
@@ -114,7 +114,7 @@ if ESX.GetConfig().Multichar then
 					end
 					TriggerEvent('skinchanger:loadSkin', skin)
 				end
-				DoScreenFadeIn(400)
+				DoScreenFadeIn(600)
 			end)
 		repeat Wait(200) until not IsScreenFadedOut()
 
@@ -141,16 +141,88 @@ if ESX.GetConfig().Multichar then
 		})
 	end
 
+	function CharacterOptions(Characters, slots, SelectedCharacter)
+		local elements = {{title = "Character: ".. Characters[SelectedCharacter.value].firstname .. " ".. Characters[SelectedCharacter.value].lastname,icon = "fa-regular fa-user", unselectable = true}, 
+		{title = "Return", unselectable = false,icon = "fa-solid fa-arrow-left",description ="Return To Character Selection.", action = "return"}}
+		if not Characters[SelectedCharacter.value].disabled then 
+			elements[3] = {title = _('char_play'), description ="Continue Into The City.", icon ="fa-solid fa-play",action = 'play', value = SelectedCharacter.value}
+		else
+			elements[3] = {title = _('char_disabled'), value = SelectedCharacter.value, icon ="fa-solid fa-xmark", description ="This Character Is Unusable.",}
+		end
+		if Config.CanDelete then elements[4] = {title = _('char_delete'),icon ="fa-solid fa-xmark",description ="Permanently Remove This Character.", action = 'delete', value = SelectedCharacter.value} end
+		ESX.OpenContext("left", elements, function(element, Action)
+			if Action.action == "play" then
+				SendNUIMessage({
+					action = "closeui"
+				})
+				ESX.CloseContext()
+				TriggerServerEvent('esx_multicharacter:CharacterChosen', Action.value, false)
+			elseif Action.action == "delete" then
+					ESX.CloseContext()
+					TriggerServerEvent('esx_multicharacter:DeleteCharacter', Action.value)
+					spawned = false
+			elseif Action.action == "return" then
+				SelectCharacterMenu(Characters, slots)
+			end
+		end, nil, true)
+	end
+
+	function SelectCharacterMenu(Characters, slots)
+		local Character = next(Characters)
+		local elements = {{title = "Select A Character." , icon = "fa-solid fa-users", description = "Select a character to play as." , unselectable = true}}
+		for k,v in pairs(Characters) do
+			if not v.model and v.skin then
+				if v.skin.model then v.model = v.skin.model elseif v.skin.sex == 1 then v.model = mp_f_freemode_01 else v.model = mp_m_freemode_01 end
+			end
+			if spawned == false then SetupCharacter(Character) end
+			local label = v.firstname..' '..v.lastname
+			if Characters[k].disabled then
+				elements[#elements+1] = {title = label,icon = "fa-regular fa-user", value = v.id}
+			else
+				elements[#elements+1] = {title = label,icon = "fa-regular fa-user", value = v.id}
+			end
+		end
+		if #elements < slots then
+			elements[#elements+1] = {title = _('create_char'), icon = "fa-solid fa-plus", value = (#elements+1), new = true}
+		end
+
+		ESX.OpenContext("left", elements, function(menu, SelectedCharacter)
+			if SelectedCharacter.new then
+				ESX.CloseContext()
+				local GetSlot = function()
+					for i = 1, slots do
+						if not Characters[i] then
+							return i
+						end
+					end
+				end
+				local slot = GetSlot()
+				TriggerServerEvent('esx_multicharacter:CharacterChosen', slot, true)
+				TriggerEvent('esx_identity:showRegisterIdentity')
+				local playerPed = PlayerPedId()
+					SetPedAoBlobRendering(playerPed, false)
+					SetEntityAlpha(playerPed, 0)
+					SendNUIMessage({
+						action = "closeui"
+					})
+			else
+				CharacterOptions(Characters,slots, SelectedCharacter)
+				SetupCharacter(SelectedCharacter.value)
+				local playerPed = PlayerPedId()
+				SetPedAoBlobRendering(playerPed, true)
+				ResetEntityAlpha(playerPed)
+			end
+		end, nil, true)
+	end
 	RegisterNetEvent('esx_multicharacter:SetupUI')
 	AddEventHandler('esx_multicharacter:SetupUI', function(data, slots)
 		DoScreenFadeOut(0)
 		Characters = data
 		slots = slots
-		local elements = {}
 		local Character = next(Characters)
 		exports.spawnmanager:forceRespawn()
 
-		if Character == nil then
+		if not Character then
 			SendNUIMessage({
 				action = "closeui"
 			})
@@ -172,98 +244,7 @@ if ESX.GetConfig().Multichar then
 				TriggerEvent('esx_identity:showRegisterIdentity')
 			end)
 		else
-			for k,v in pairs(Characters) do
-				if not v.model and v.skin then
-					if v.skin.model then v.model = v.skin.model elseif v.skin.sex == 1 then v.model = mp_f_freemode_01 else v.model = mp_m_freemode_01 end
-				end
-				if spawned == false then SetupCharacter(Character) end
-				local label = v.firstname..' '..v.lastname
-				if Characters[k].disabled then
-					elements[#elements+1] = {label = label, value = v.id}
-				else
-					elements[#elements+1] = {label = label, value = v.id}
-				end
-			end
-			if #elements < slots then
-				elements[#elements+1] = {label = _('create_char'), value = (#elements+1), new = true}
-			end
-			ESX.UI.Menu.Open('default', GetCurrentResourceName(), 'selectchar', {
-				title    = _('select_char'),
-				align    = 'top-left',
-				elements = elements
-			}, function(data, menu)
-				local elements = {}
-				if not data.current.new then
-					if not Characters[data.current.value].disabled then 
-						elements[1] = {label = _('char_play'), action = 'play', value = data.current.value}
-					else
-						elements[1] = {label = _('char_disabled'), value = data.current.value}
-					end
-					if Config.CanDelete then elements[2] = {label = _('char_delete'), action = 'delete', value = data.current.value} end
-					ESX.UI.Menu.Open('default', GetCurrentResourceName(), 'choosechar', {
-						title = _('select_char'),
-						align = 'top-left',
-						elements = elements
-					}, function(data, menu)
-						if data.current.action == 'play' then
-							ESX.UI.Menu.CloseAll()
-							SendNUIMessage({
-								action = "closeui"
-							})
-							TriggerServerEvent('esx_multicharacter:CharacterChosen', data.current.value, false)
-						elseif data.current.action == 'delete' then
-							local elements2 = {}
-							elements2[1] = {label = _('cancel')}
-							elements2[2] = {label = _('confirm'), value = data.current.value}
-							ESX.UI.Menu.Open('default', GetCurrentResourceName(), 'deletechar', {
-								title = _('delete_label', Characters[data.current.value].firstname, Characters[data.current.value].lastname),
-								align = 'center',
-								elements = elements2
-							}, function(data, menu)
-								if data.current.value then
-									TriggerServerEvent('esx_multicharacter:DeleteCharacter', data.current.value)
-									spawned = false
-									ESX.UI.Menu.CloseAll()
-								else
-									menu.close()
-								end
-							end, function(data, menu)
-								menu.close()
-							end)
-						end
-					end, function(data, menu)
-						menu.close()
-					end)
-				else
-					ESX.UI.Menu.CloseAll()
-					local GetSlot = function()
-						for i = 1, slots do
-							if not Characters[i] then
-								return i
-							end
-						end
-					end
-					local slot = GetSlot()
-					TriggerServerEvent('esx_multicharacter:CharacterChosen', slot, true)
-					TriggerEvent('esx_identity:showRegisterIdentity')
-				end		
-			end, function(data, menu)
-				menu.refresh()
-			end, function(data, menu)
-				if data.current.new then
-					local playerPed = PlayerPedId()
-					SetPedAoBlobRendering(playerPed, false)
-					SetEntityAlpha(playerPed, 0)
-					SendNUIMessage({
-						action = "closeui"
-					})
-				else
-					SetupCharacter(data.current.value)
-					local playerPed = PlayerPedId()
-					SetPedAoBlobRendering(playerPed, true)
-					ResetEntityAlpha(playerPed)
-				end
-			end)
+			SelectCharacterMenu(Characters, slots)
 		end
 	end)
 
@@ -314,7 +295,8 @@ if ESX.GetConfig().Multichar then
 
 	RegisterNetEvent('esx:onPlayerLogout')
 	AddEventHandler('esx:onPlayerLogout', function()
-		DoScreenFadeOut(0)
+		DoScreenFadeOut(500)
+		Wait(1000)
 		spawned = false
 		TriggerEvent("esx_multicharacter:SetupCharacters")
 		TriggerEvent('esx_skin:resetFirstSpawn')

[esx]/esx_multicharacter/config.lua

@@ -16,7 +16,7 @@ if IsDuplicityVersion() then
 else
 	-- Sets the location for the character selection scene
 	-- To set the spawn location for new characters, modify the default value in the users SQL table
-	Config.Spawn = vector4(-113.7, 565.3, 195.2, 0)
+	Config.Spawn = vector4(-284.2856, 562.4627, 172.9182, 19.9895)
 	--------------------
 
 	-- Do not use unless you are prepared to adjust your resources to correctly reset data

[esx]/esx_multicharacter/html/css/main.css

@@ -1,9 +1,11 @@
 @import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;600&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
 * {
     margin: 0;
     padding: 0;
     user-select: none;
     color: rgb(255, 255, 255);
+	border-radius: 15px;
 	font-weight: 300;
 	font-size: 1.6vh;
     font-family: Calibri, "Helvetica", san-serif;
@@ -25,25 +27,30 @@ body {
     display:none;
     position: absolute;
 	top: 50%;
-    right: 25;
+    right: 150;
     transform: translate(0, -50%);
-	background: rgba(0,0,0,0.7);
+	border-radius: 15px;
+	background: rgba(15,15,15, 0.9);
 }
 
 .header {
+	font-family: 'Oswald', sans-serif;
 	position: absolute;
-	top: 5%;
+	background: rgba(10, 10, 10, 0.9);
+	border-radius: 15px 15px 0px 0px; 
+	height: 10%;
+	width: 100%;
     left: 50%;
+	text-align: center;
     transform: translate(-50%);
-	font-size: 1.1rem;
+	font-weight: 700;
+	padding-bottom: 5px;
+	font-size: 1.6rem;
 }
 
 .footer {
 	position: absolute;
-	bottom: 5%;
-    left: 50%;
-    transform: translate(-50%);
-	font-size: 1.1rem;
+	font-size: 0rem;
 }
 
 .character-box {
@@ -54,17 +61,16 @@ body {
 	align-items: center;
 	text-align: center;
 	line-height: 1.4rem;
-	height: calc(100vh - 6rem);
-	width: 20rem;
-	padding: 1rem;
-	border: 1px rgba(12,12,12,200) solid;
-	box-shadow: 0px 0px 4px 1px rgba(12,12,12,20);
+	height: calc(30rem);
+	width: 17rem;
+	border: 1px rgba(10,10,10,0.7) solid;
+	box-shadow: 2px 1px 9px 3px rgba(10,10,10,0.7);
 }
 
 h1 {
-    font-family: 'Raleway', sans-serif;
-	padding-top: 2rem;
+	font-family: 'Oswald', sans-serif;
+	font-size: 22px;
+	padding-top: 1.3rem;
 	display: block;
-	font-size: 1.3rem;
-	font-weight: 600;
+	font-weight: 0;
 }

[esx]/esx_multicharacter/html/ui.html

@@ -9,7 +9,7 @@
     </head>
     <body style="display: none;">
 	    <div class="main-container">
-			<div class='header'>ESX Legacy</div>
+			<div class='header'>Character Info</div>
             <div class="character-box" data-charid="1">
                 <h3 class="character-fullname"></h3>
                 <div class="character-info"></div>

[esx]/esx_multicharacter/locales/en.lua

@@ -3,10 +3,10 @@ Locales["en"] = {
 	["female"] = "Female",
 	["delete_label"] = "Delete %s %s?",
 	["select_char"] = "Select Character",
-	["create_char"] = "Create new character",
-	["char_play"] = "Play this character",
-	["char_disabled"] = "This character is disabled",
-	["char_delete"] = "Delete this character",
+	["create_char"] = "New Character",
+	["char_play"] = "Play",
+	["char_disabled"] = "Disabled",
+	["char_delete"] = "Delete",
 	["cancel"] = "Cancel",
 	["confirm"] = "Confirm",
 	["command_setslots"] = "Set multicharacter slots number of a player",

[esx]/esx_multicharacter/server/main.lua

@@ -213,6 +213,7 @@ elseif ESX.GetConfig().Multichar == true then
 	end)
 
 	RegisterNetEvent('esx_multicharacter:relog', function()
+		local source = source
 		TriggerEvent('esx:playerLogout', source)
 	end)