diff --git a/packages/client/public/icons/gravity.png b/packages/client/public/icons/gravity.png index 8a56d17..c84becf 100644 Binary files a/packages/client/public/icons/gravity.png and b/packages/client/public/icons/gravity.png differ diff --git a/packages/client/public/turbine3.webp b/packages/client/public/turbine3.webp new file mode 100644 index 0000000..668c8ff Binary files /dev/null and b/packages/client/public/turbine3.webp differ diff --git a/packages/client/public/turbine4.webp b/packages/client/public/turbine4.webp new file mode 100644 index 0000000..c9fd3ab Binary files /dev/null and b/packages/client/public/turbine4.webp differ diff --git a/packages/client/src/App.tsx b/packages/client/src/App.tsx index 2eae39c..333c07c 100644 --- a/packages/client/src/App.tsx +++ b/packages/client/src/App.tsx @@ -1,65 +1,12 @@ -import { useComponentValue } from "@latticexyz/react"; -import { singletonEntity } from "@latticexyz/store-sync/recs"; import LoadingScreen from "@/components/loadingScreen/loadingScreen"; import RootLayout from "./components/layout/layout"; import GameRoot from "./game/gameRoot"; -import { useMUD } from "./useMUD"; export const App = () => { - const { - components: { Counter }, - systemCalls: { - mudGetAllFacilityEntityMetadatas, - mudBuildFacility, - mudGetEntityMetadataAtPosition, - }, - } = useMUD(); - - const counter = useComponentValue(Counter, singletonEntity); - return ( -
- Counter: {counter?.value ?? "??"} -
- - - ); diff --git a/packages/client/src/game/data/tutorial.ts b/packages/client/src/game/data/tutorial.ts index b55cd19..dd0a29b 100644 --- a/packages/client/src/game/data/tutorial.ts +++ b/packages/client/src/game/data/tutorial.ts @@ -25,13 +25,13 @@ export const tutorialSteps = [ screens: [ { name: "A world of floating cities", - text: "In a realm where the vastness of the cosmos meets the dreams of mortals, floating cities known as Laputas drift amidst the stars, tethered only by the delicate dance of gravity and ambition.

As a visionary architect of this celestial expanse, you are tasked with weaving together resources, imagination, and the very essence of the universe, to sculpt a city that not only floats but thrives. Let the dance of construction and collaboration begin, for in this ballet of creation, every tile, every choice, and every alliance matters.

Welcome, builder of the skies, to a journey of wonder and infinite possibilities.", + text: "In a realm where the vastness of the cosmos meets the dreams of mortals, floating cities known as Laputas drift amidst the stars, tethered only by the delicate dance of gravity and ambition.

As a visionary architect of this celestial expanse, you are tasked with weaving together resources, imagination, and the very essence of the universe, to sculpt a city that not only floats but thrives.
Let the dance of construction and collaboration begin, for in this ballet of creation, every tile, every choice, and every alliance matters.

Welcome, builder of the skies, to a journey of wonder and infinite possibilities.", image: "scroll.webp", }, { name: "Into the skies!", - text: `Embark on the foundational step of your skyward journey: the Gravity Hill. This magnificent contraption is the beating heart of your floating haven, generating the essential force of gravity. Choose the Gravity Hill from your inventory, and place it to set the cornerstone of your ethereal city.

- ${EntityData.facilities.gravityhill.description}`, + text: `Embark on the foundational step of your skyward journey: the Gravity Hill. This magnificent contraption is the beating heart of your floating haven, generating the essential force of gravity.

+ ${EntityData.facilities.gravityhill.description}

Choose the Gravity Hill from your inventory, and place it to set the cornerstone of your ethereal city.`, entity: EntityData.facilities.gravityhill, }, ], @@ -48,7 +48,7 @@ export const tutorialSteps = [ { name: "Power it up", text: `As your floating city takes shape, energy shall become the lifeblood that keeps it alive and thriving. The Whirly Dynamo was born out of sheer necessity and innovation. As the demand for airborne cities increased, traditional power sources proved inefficient. Groundbreaking engineers and physicists from around the world convened, seeking a solution that could harness the vast energy potential of the stratosphere. Their answer was the Whirly Dynamo.

Today, the Whirly Dynamo stands not just as a beacon of energy but as a testament to STAKAC's unwavering commitment to innovation and progress.`, - image: `turbine2.webp`, + image: `turbine3.webp`, }, { name: "Power it up", diff --git a/packages/client/src/game/systems/gameLoop.tsx b/packages/client/src/game/systems/gameLoop.tsx index 57f04c5..fa9a49a 100644 --- a/packages/client/src/game/systems/gameLoop.tsx +++ b/packages/client/src/game/systems/gameLoop.tsx @@ -1,4 +1,4 @@ -import { useEffect } from "react"; +import { useEffect, useState } from "react"; import resourceFactory from "./resourceFactory"; import EntityData from "../data/entities"; import { useMUD } from "@/useMUD"; @@ -21,7 +21,9 @@ function GameLoop() { EntityCustomization, OwnedBy, }, + network: { latestBlock$ }, } = useMUD(); + const [, setLatestBlock] = useState(null!); // Startup useOnce(() => { @@ -32,6 +34,20 @@ function GameLoop() { } }); + useEffect(() => { + const subscription = latestBlock$.subscribe((block) => { + console.log("Received block:", block); + const event = new CustomEvent("blockReceived", { + detail: parseInt(block.number!.toString()), + }); + document.dispatchEvent(event); + setLatestBlock(parseInt(block.number!.toString())); + }); + + // Cleanup: Unsubscribe when the component is unmounted + return () => subscription.unsubscribe(); + }, [latestBlock$]); + useEffect(() => { const { setCursor, yaw, variant } = getState().input.cursor; const rotation = 90;