Global

Members

# CroquetContext

The react context to store the object returned from Session.join(). You can obtrain the value by calling useContext(CroquetContext). You can access useful values such as view, model, etc. from the value of this context.

Example:
const croquetContext = useContext(CroquetContext);
const sessionId = croquetContext.id;

Methods

# useViewId() → {string}

A hook to obtain the viewId.

Returns:
Type
string
Example 
const myViewId:string = useViewId();

# useSessionId() → {string}

A hook to obtain the sessionid.

Returns:
Type
string
Example 
const sessionId:string = useSessionId();

# useModelRoot() → {Model}

A hook to obtain the root model object.

Returns:
  • The instance of a subclass of Model used as the root Model.
Type
Model
Example 
const model = useModelRoot();

# useModelById() → {Model}

A hook to obtain a sub model object.

Returns:

the model object of a subclass of Model with id.

Type
Model
Example 
const submodel = useModelRoot(rootModel.someData.id);

# usePublish()

A hook to create a function that publishes a view event.

Example 
type GrabData = {viewId:string, id:string};
const publishRelease = usePublish<GrabData>((id) => 
  [model.id, 'release', {viewId: myViewId, id}]);

# useSubscribe()

A hook to set up a subscription to a Croquet message.

Example 
function grabBall(data:GrabData):void  {}
useSubscribe<GrabData>(model.id, "grabbed", grabBall);

# useUpdateCallback()

Hook that sets up a callback for Croquet.View.update(). The callback function is called at each simulation cycle.

Example 
useUpdateCallback((update:time:number) => void);

# useSyncedCallback()

Hook that sets up a callback for Croquet.View.synced(). The callback function is called when a Croquet synced event occurs.

Example 
useSyncedCallback(synced:() => void);

# useDetachCallback()

Hook that sets up a callback for Croquet.View.detach(). The callback function is called when the root View is detached.

Example 
useDetachCallback(detach:() => void);

# InCroquetSession()

Main wrapper component that starts and manages a croquet session, enabling child elements to use the hooks described above.

It takes the same parameters as Session.join except that it doesn't need a root View class, since croquet-react provides a suitable View class behind the scenes.

Example 
function MyApp() {
   return (
     <InCroquetSession
       apiKey="1_123abc",
       appId="com.example.myapp"
       name="mySession"
       password="secret"
       model={MyRootModel}
          ...
     >
       // child elements that use hooks go here...
       <MyComponent/>
     </InCroquetSession>
   );
}