fix stuff, add percentage bar

This commit is contained in:
Reid 2023-08-13 03:16:17 -07:00
parent c4c0dc879e
commit f9403100de
4 changed files with 71 additions and 6 deletions

View file

@ -0,0 +1,64 @@
import Hooks from "@rbxts/roact-hooks"
import Roact from "@rbxts/roact"
import Padding from "./padding"
function colorBetween(startColor: Color3, endColor: Color3, degree: number): Color3 {
return startColor.Lerp(endColor, degree)
}
interface percentageBarProps extends Roact.JsxInstanceProperties<UIPadding> {
current: number
max: number
highColor: Color3
lowColor: Color3
bgColor: Color3
text?: string
Event?: Roact.JsxInstanceEvents<Frame>
Change?: Roact.JsxInstanceChangeEvents<Frame>
}
const percentageBar: Hooks.FC<percentageBarProps> = (props, _hooks) => {
const { current, max, highColor, lowColor, bgColor, text } = props
const spreadableProps = { ...props } as Partial<percentageBarProps>
delete spreadableProps.current
delete spreadableProps.max
delete spreadableProps.highColor
delete spreadableProps.lowColor
delete spreadableProps.bgColor
delete spreadableProps.text
return (
<frame BackgroundColor3={bgColor} BorderSizePixel={0} {...spreadableProps}>
<frame BackgroundTransparency={1} Size={new UDim2(current / max, 0, 1, 0)} ZIndex={1} BorderSizePixel={0}>
<frame BackgroundColor3={colorBetween(lowColor, highColor, current / max)} Size={new UDim2(1, 0, 1, 0)} BorderSizePixel={0}/>
</frame>
<frame Size={new UDim2(1, 0, 1, 0)} BackgroundTransparency={1}>
<Padding PaddingY={new UDim(.1, 0)} PaddingX={new UDim(0, 8)}/>
<textlabel
BackgroundTransparency={1}
Text={`${math.floor(current)} / ${math.floor(max)}`}
ZIndex={2}
Size={new UDim2(1, 0, 1, 0)}
TextXAlignment={Enum.TextXAlignment.Right}
TextColor3={Color3.fromHex("#cdd6f4")}
TextScaled
/>
{(text !== undefined) ? (
<textlabel
BackgroundTransparency={1}
Text={text}
ZIndex={2}
Size={new UDim2(1, 0, 1, 0)}
TextXAlignment={Enum.TextXAlignment.Left}
TextColor3={Color3.fromHex("#cdd6f4")}
TextScaled
/>
) : undefined}
</frame>
</frame>
)
}
export default new Hooks(Roact)(percentageBar)

View file

@ -1,6 +1,6 @@
import { CharacterRigR6 } from "@rbxts/character-promise"
import Log, { Logger } from "@rbxts/log"
import { Players, StarterGui } from "@rbxts/services"
import { Players } from "@rbxts/services"
import { start } from "ReplicatedStorage/ecs"
import { clientState } from "ReplicatedStorage/ecs/state"
import { Host } from "ReplicatedStorage/hosts"
@ -23,9 +23,6 @@ const ClientState = new clientState(
clientLogger
)
// no fuck off
StarterGui.SetCoreGuiEnabled(Enum.CoreGuiType.Backpack, false)
const worldAndClientState = start(HOST, ClientState)
showGUI(worldAndClientState[0], ClientState)
setEnvironment(HOST)

View file

@ -3,12 +3,16 @@ import Hooks from "@rbxts/roact-hooks"
import Slot from "./slot"
import { useWorldContext } from "../contexts/worldContext"
import Padding from "ReplicatedStorage/ui/padding"
import { StarterGui } from "@rbxts/services"
interface hotbarProps extends Roact.JsxInstanceProperties<Frame> {
Event?: Roact.JsxInstanceEvents<Frame>
Change?: Roact.JsxInstanceChangeEvents<Frame>
}
// no fuck off
StarterGui.SetCoreGuiEnabled(Enum.CoreGuiType.Backpack, false)
const hotbar: Hooks.FC<hotbarProps> = (props, hooks) => {
const spreadableProps = { ...props } as Partial<hotbarProps>

View file

@ -24,13 +24,13 @@ const slot: Hooks.FC<slotProps> = (props, hooks) => {
const { clientState } = useWorldContext(hooks)
const handleActivated = (): void => {
const handleActivated = (): void => {
tool.Parent !== clientState.character
? clientState.character.Humanoid.EquipTool(tool)
: clientState.character.Humanoid.UnequipTools()
}
// maybe opt this into our system for inputs?
// TODO: maybe opt this into our system for inputs?
useEffect(() => {
const guid = HttpService.GenerateGUID(false)
ContextActionService.BindAction(