reidlab/goopler
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

interface case, acrylic ui, swap to make, lint

Browse source
This commit is contained in:
Reid 2023-08-15 20:18:59 -07:00
parent f5584a9b0c
commit a5bc77030a
24 changed files with 353 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/StarterPlayer/StarterPlayerScripts/main.client.ts
View file

@ -1,8 +1,8 @@
import { CharacterRigR6 } from "@rbxts/character-promise"
import Log, { Logger } from "@rbxts/log"
import { Players } from "@rbxts/services"
import { Players, Workspace } from "@rbxts/services"
import { start } from "ReplicatedStorage/ecs"
import { clientState } from "ReplicatedStorage/ecs/state"
import { ClientState } from "ReplicatedStorage/ecs/state"
import { Host } from "ReplicatedStorage/hosts"
import { setEnvironment } from "ReplicatedStorage/idAttribute"
import showGUI from "./showGUI"
@ -13,7 +13,7 @@ const clientLogger = Logger.configure()
.WriteTo(Log.RobloxOutput())
.Create()
const ClientState = new clientState(
const clientState = new ClientState(
Players.LocalPlayer,
(Players.LocalPlayer.Character || Players.LocalPlayer.CharacterAdded.Wait()[0]) as CharacterRigR6,
false,
@ -23,6 +23,10 @@ const ClientState = new clientState(
clientLogger
)
const worldAndClientState = start(HOST, ClientState)
showGUI(worldAndClientState[0], ClientState)
setEnvironment(HOST)
const worldAndClientState = start(HOST, clientState)
showGUI(worldAndClientState[0], clientState)
setEnvironment(HOST)
task.delay(10, () => {
print(Workspace.CurrentCamera?.GetChildren())
})

4
src/StarterPlayer/StarterPlayerScripts/showGUI.tsx
View file

@ -1,12 +1,12 @@
import { World } from "@rbxts/matter"
import { clientState } from "ReplicatedStorage/ecs/state"
import { ClientState } from "ReplicatedStorage/ecs/state"
import { WorldContext } from "./ui/contexts/worldContext"
import Roact from "@rbxts/roact"
import Main from "./ui/main"
import { ReflexProvider } from "@rbxts/roact-reflex"
import { producer } from "ReplicatedStorage/ui/store/producer"
const showGUI = (world: World, state: clientState): void => {
const showGUI = (world: World, state: ClientState): void => {
const playerGui = state.player.WaitForChild("PlayerGui") as PlayerGui
const tree = (
<WorldContext.Provider value={{ world: world, clientState: state }}>

10
src/StarterPlayer/StarterPlayerScripts/ui/contexts/worldContext.tsx
View file

@ -1,16 +1,16 @@
import { World } from "@rbxts/matter"
import Roact from "@rbxts/roact"
import { useContext } from "@rbxts/roact-hooked"
import { clientState } from "ReplicatedStorage/ecs/state"
import { ClientState } from "ReplicatedStorage/ecs/state"
interface worldContextProps {
interface WorldContextProps {
world: World
clientState: clientState
clientState: ClientState
}
export const WorldContext = Roact.createContext<worldContextProps | undefined>(undefined)
export const WorldContext = Roact.createContext<WorldContextProps | undefined>(undefined)
export function useWorldContext(): worldContextProps {
export function useWorldContext(): WorldContextProps {
const context = useContext(WorldContext)
if (!context) {
error("useContext must be called within a Provider")

6
src/StarterPlayer/StarterPlayerScripts/ui/hotbar/hotbar.tsx
View file

@ -4,15 +4,15 @@ import { useWorldContext } from "../contexts/worldContext"
import Padding from "ReplicatedStorage/ui/components/padding"
import { StarterGui } from "@rbxts/services"
interface hotbarProps extends Roact.JsxInstanceProperties<Frame> {
interface HotbarProps extends Roact.JsxInstanceProperties<Frame> {
Event?: Roact.JsxInstanceEvents<Frame>
Change?: Roact.JsxInstanceChangeEvents<Frame>
}
StarterGui.SetCoreGuiEnabled(Enum.CoreGuiType.Backpack, false)
function hotbar(props: hotbarProps): Roact.Element {
const spreadableProps = { ...props } as Partial<hotbarProps>
function hotbar(props: HotbarProps): Roact.Element {
const spreadableProps = { ...props } as Partial<HotbarProps>
const { clientState } = useWorldContext()

57
src/StarterPlayer/StarterPlayerScripts/ui/hotbar/slot.tsx
View file

@ -3,8 +3,9 @@ import { useEffect } from "@rbxts/roact-hooked"
import { useWorldContext } from "../contexts/worldContext"
import { ContextActionService, HttpService } from "@rbxts/services"
import Padding from "ReplicatedStorage/ui/components/padding"
import Acrylic from "ReplicatedStorage/ui/components/acrylic"
interface slotProps extends Roact.JsxInstanceProperties<Frame> {
interface SlotProps extends Roact.JsxInstanceProperties<Frame> {
index: number
keycode: Enum.KeyCode
tool: Tool
@ -13,10 +14,10 @@ interface slotProps extends Roact.JsxInstanceProperties<Frame> {
Change?: Roact.JsxInstanceChangeEvents<Frame>
}
function slot(props: slotProps): Roact.Element {
function slot(props: SlotProps): Roact.Element {
const { index, keycode, tool } = props
const spreadableProps = { ...props } as Partial<slotProps>
const spreadableProps = { ...props } as Partial<SlotProps>
delete spreadableProps.index
delete spreadableProps.keycode
delete spreadableProps.tool
@ -48,37 +49,43 @@ function slot(props: slotProps): Roact.Element {
<frame
BackgroundColor3={Color3.fromHex("#11111b")}
BackgroundTransparency={
.7
.75
}
Size={new UDim2(1, 0, 1, 0)}
>
<Acrylic
radius={0}
distance={0.0001}
/>
<uiaspectratioconstraint
AspectRatio={6}
/>
<uicorner
CornerRadius={new UDim(0, 8)}
/>
<Padding
paddingY={new UDim(.3, 0)}
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.2, 0, 1, 0)}
Font={Enum.Font.GothamBold}
Text={tostring(index)}
TextScaled
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.8, 0, 1, 0)}
Position={new UDim2(.2, 0, 0, 0)}
Font={Enum.Font.Gotham}
Text={tool.Name}
TextXAlignment={Enum.TextXAlignment.Left}
TextScaled
/>
<frame BackgroundTransparency={1} Size={new UDim2(1, 0, 1, 0)}>
<Padding
paddingY={new UDim(.3, 0)}
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.2, 0, 1, 0)}
Font={Enum.Font.GothamBold}
Text={tostring(index)}
TextScaled
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.8, 0, 1, 0)}
Position={new UDim2(.2, 0, 0, 0)}
Font={Enum.Font.Gotham}
Text={tool.Name}
TextXAlignment={Enum.TextXAlignment.Left}
TextScaled
/>
</frame>
</frame>
)
}

6
src/StarterPlayer/StarterPlayerScripts/ui/main.tsx
View file

@ -2,13 +2,13 @@ import Roact from "@rbxts/roact"
import Hotbar from "./hotbar/hotbar"
import { withHookDetection } from "@rbxts/roact-hooked"
interface mainProps extends Roact.JsxInstanceEvents<ScreenGui> {
interface MainProps extends Roact.JsxInstanceEvents<ScreenGui> {
Event?: Roact.JsxInstanceEvents<ScreenGui>
Change?: Roact.JsxInstanceChangeEvents<ScreenGui>
}
export default function main(props: mainProps): Roact.Element {
const spreadableProps = { ...props } as Partial<mainProps>
export default function main(props: MainProps): Roact.Element {
const spreadableProps = { ...props } as Partial<MainProps>
withHookDetection(Roact)