The whiteboard allows developers to use the custom event interface provided by sdk to broadcast with other clients in the current room in the room. The receiver needs to register the custom event name in advance. All custom event information will be restored one by one during playback. When the developer is playing back, he can register the corresponding custom event listener, and he can also receive the current information.
Developers can use the dispatchMagixEvent of room to send messages to all clients in the room.
/**
* Send custom events
* @param name custom event name, other clients can register for event listeners in this field to receive the callback
* @param payload sends content, which can be any data that can be serialized by JSON.
*/
dispatchMagixEvent(name: string, payload: any): void;
Send a custom event through the following code.
room.dispatchMagixEvent("SendGift", {
senderName: "ZhangJie",
receiverName: "Lili",
giftType: "Lamborghini",
imageIds: [1273, 2653, 23, 17283],
timestamp: 1541820428865,
});
The API is lightweight and does not guarantee stability in high frequency and large amounts of
payloaddata scenarios.
// Custom event listener
/**
* High-frequency custom event monitoring
* @param name custom event name
* @param listener custom event callback (return a large number of events at once)
*/
addMagixEventListener(name: string, listener: EventListener): void;
export type EventListener = (event: Event) => void;
export type Event = {
//Custom information name
readonly event: string;
//Event information
readonly payload: any;
//Sender memberId
readonly authorId: number;
readonly scope: Scope;
readonly phase: EventPhase;
};
/**
* High-frequency custom event monitoring
* @param name custom event name
* @param listener custom event callback (return a large number of events at once)
* @param fireInterval callback interval, milliseconds, mandatory >= 500
*/
addMagixEventListener(name: string, listener: EventsListener, fireInterval: number): void;
export type EventsListener = (events: Event[]) => void;
function onRecevieGift(eventObject) {
console.log(eventObject.payload); // event payload
}
room.addMagixEventListener("SendGift", onRecevieGift);
//When the following code is executed
/*
room.dispatchMagixEvent("SendGift", {
senderName: "ZhangJie",
receiverName: "Lili",
giftType: "Lamborghini",
imageIds: [1273, 2653, 23, 17283],
timestamp: 1541820428865,
});
*/
//The following content will be output
{
"senderName": "ZhangJie",
"receiverName": "Lili",
"giftType": "Lamborghini",
"imageIds": [1273, 2653, 23, 17283],
"timestamp": 1541820428865,
}
function onRecevieGifts(eventObjects) {
// What is passed is not the Event, but the Event array
console.log(eventObjects);
}
room.addMagixEventListener("SendGift", onRecevieGifts);
/**
* Log off custom monitoring, including high-frequency custom events
* @param name custom event name
* @param listener listens to the event, if not passed, all listeners of the custom event will be removed
*/
public removeMagixEventListener(name: string, listener?: EventListener): void;
example.
room.removeMagixEventListener("SendGift", onRecevieGift);