Event Listeners

Introduction

Provided below are functions that activate when data is sent to the App from the widget.

Name	Description
onMessage	Function that activates when messages sent from widget are received on the App

📚 API Explanation and Example

onMessage

widget.onMessage.Add(function(player, data: any){});

Callback function that activates when a message is sent from the widget to the App.

Parameters

Name	Type	Description
player	Player	The player who owns the widget
data	Object	The message sent from the widget to the App

Example

Create a function to close the widget screen when x is pressed.

15KB

sample_EventListener.zip

archive

// Activates function when a player enters
App.onJoinPlayer.Add(function (player) {
	player.tag = {
		widget: null,
	};

	player.tag.widget = player.showWidget("sample.html.html", "top", 600, 500);
	player.tag.widget.onMessage.Add(function (player, msg) {
		// Closes the widget when the 'type: close' message is sent from the widget to the App 
		if (msg.type == "close") {
			player.showCenterLabel("Widget has been closed.");
			player.tag.widget.destroy();
			player.tag.widget = null;
		}
	});
});

sample.html: Button and script section

<i onclick="closeWidget()" class="fa-solid fa-xmark"></i>
<script type="text/javascript">
			// Calls the function when x button is pressed
			function closeWidget() {
				// Sends message to App 
				window.parent.postMessage(
					{
						type: "close",
					},
					"*"
				);
			}
</script>