Manage room state

The Interactive Whiteboard SDK provides the state property in the room interface to indicate the various states of a room. By reading or modifying the state property of a room object, you can change the behavior of the whiteboard or implement custom business logic.

This page describes the different states of an interactive whiteboard room and how to listen for room state changes.

In an interactive whiteboard room, the state property includes the following fields:

• memberState: The whiteboard tool currently in use. By modifying the memberState value of the current room, you can switch the whiteboard tool. See Use Whiteboard Tools.
• broadcastState: The view mode of the user, as well as the user ID of the host in the room.
• cameraState: The state of the view, including the coordinates of the center, the width and height, and the scale factor of the view.
• roomMember.: The information of all the users in interactive mode (those who have read and write permission) in the room.
• sceneState: The information of the current scene, including the name, index, and path of the scene. By modifying the sceneState value of the current room, you can switch the scene. See Manage Scenes.
• globalState: The global state of the room. You can use globalState to implement custom business logic.

To get the current room states, you can either read the value of each field, or register a callback to listen for their changes.

To follow the procedure on this page, ensure that you have integrated the Interactive Whiteboard SDK into your project and implemented joining a room. For details, see Join the Whiteboard Room.

The following section extends the Join a Whiteboard Room sample code to show the implementation of getting or listening for room states.

After successfully joining a whiteboard room, to get a room state, you can directly read the corresponding field in the state property of the room object.

For example, to get information about the current scene (sceneState) after joining a room, add the following line to the joinWhiteboard.js file:

whiteWebSdk.joinRoom(joinRoomParams).then(function(room) {

room.bindHtmlElement(document.getElementById("whiteboard"));

// Add the following code to get the path, name, and index of the current scene.

var sceneState = room.state.sceneState;

console.log("scene path:", sceneState.scenePath);

console.log("scene name:", sceneState.sceneName);

console.log("scene index:", sceneState.index);

}).catch(function(err) {

console.error(err);

});

Save the changes, refresh the index.html page, and open the console of your browser. You can see the following information on the console:

[White] join room success

scene path: /init

scene name: init

scene index: 0

The Interactive Whiteboard SDK provides the onRoomStateChanged method in RoomCallbacks to report room state changes. You can register this callback when calling joinRoom to listen for room state changes in real time.

For example, to listen for changes of broadcastState, you can add the following code to the joinWhiteboard.js file:

var whiteWebSdk = new WhiteWebSdk({

appIdentifier: "RMmxxxQ",

});

var joinRoomParams = {

uuid: "a7exxxa69",

roomToken: "NETLESSROOM_YWs9xxxNjk",

};

// Define the callback to be listened for.

var roomCallbacks = {

onRoomStateChanged: function onStateChanged(modifyState) {

// When the broadcastState field changes, output the current broadcastState.

if (modifyState.broadcastState) {

console.log(modifyState);

} else {

// Ignore the changes of other fields.

}

},

};

// Register the callback when joining a room.

whiteWebSdk.joinRoom(joinRoomParams, roomCallbacks).then(function(room) {

room.bindHtmlElement(document.getElementById("whiteboard"));

// Set the view mode of the user as broadcaster.

room.setViewMode("broadcaster");

}).catch(function(err) {

console.error(err);

});

Save the changes, refresh the index.html page, and open the console of your browser. You can see the following information on the console:

broadcasterId: 409

mode: "broadcaster"

• roomState
• joinRoom
• RoomCallbacks