Scrubz UI Utils

– Scrubz UI Utils –

[Purchase]

Purchase from Tebex - $10

[Information]

While there are definitely many progbars/notifications/prompts(not so much of these…) here on the forums, there aren’t any that allow the customization I included with mine. So I decided to throw them up here on the forums as my first paid release. :scrubzuwu:

This resource was built using React & Typescript and contains a progress bar (2 styles), notifications, and a prompt. This code is standalone which means it will work with any framework.

[EDIT]

Since I have not seen (and still haven’t) a forum post stating that resources on tebex can no longer be obfuscated but have since been told otherwise by cfx staff, I have restructured the download included when purchasing the resource. You now get 3 folders inside the download. 1) Contains the ui made with React. 2) Contains the resource made with Typescript. 3) Contains a built resource. THE BUILT RESOURCE IS OBFUSCATED. I do this via webpacking on all my resources, but since you receive both the unbuilt frontend AND resource, this isn’t an issue.

[Warning]

I have no plans on transferring any of the clientside typescript code over to lua. Do NOT ask.
If you have plans on editing or changing things, you are more than welcome to. BUT BE WARNED. While I don’t mind in assisting in MINOR things, I’m not going to teach you React or Typescript.

[Settings]

There are various settings for each. Please check out this pastebin for a full list.

[Media]

Progbar Style 1


Progbar Style 2

Prompt Example

Notifications

1 Like

I thought the new fivem rules didnt allow you to have your code obfuscated anymore, But I could be wrong.

Anyways it looks nice, great job!

I thought the same.

It is forbidden to obfuscate any resource you trying to sell here! Read the rules! IP locking is neither allowed. You have to get access to the full code.

Obfuscated and discord in releases post

I have since updated the post and download to include the unbuilt frontend and clientside code (there is no serverside code).

This looks pretty neat. :slight_smile:

Client side TS isn’t really hard to convert if that’s stopping anyone from purchasing this resource.

1 Like

You shouldn’t even have to do so. The only thing it does is handle the export. Usage is done like the following example:

UI = exports.ui_utils.FetchComponent()

RegisterCommand('uitest_progbar', function()
	UI.Progbar.Start({
		time = 10000,
		text = 'Giving Scrubz headpats!!',
		type = 2,
		color = {
			text = 'rgba(0, 0, 0, 1)',
			fill = 'linear-gradient(90deg, rgba(171,171,171,1) 0%, rgba(223,0,30,1) 100%)'
		}
	})
end)

RegisterCommand('uitest_prompt', function()
	UI.Prompt.Start({
		text = '[E] - To Gib Tacos!',
		color = 'black',
		background = '#4CBB17'
	})
	Citizen.Wait(2000)
	UI.Prompt.Change({
		text = 'Thanks!!!!',
		color = 'white',
		background = 'linear-gradient(90deg, rgba(0,255,236,1) 0%, rgba(206,0,223,1) 100%)'
	})
	Citizen.Wait(2000)
    UI.Prompt.Stop()
end)

RegisterCommand('uitest', function()
	UI.Notify({
		style = 'success',
		duration = 5000,
		message = 'Uwuuuuu',
		color = 'white',
	})
	Citizen.Wait(2000)
	UI.Notify({
		style = 'custom',
		duration = 5000,
		message = 'You can even do gradients!!',
		color = 'black',
		background = 'linear-gradient(90deg, rgba(0,255,236,1) 0%, rgba(206,0,223,1) 100%)',
		position = {
			x = 'center',
			y = 'center'
		},
		icon = {
			name = 'fas fa-globe',
			color = 'black'
		}
	})
end)
1 Like

I dropped the price to $10 since 20 seemed like maybe a bit too much. My bad ma doods.

OP request