Widget JavaScript Events

Xen HTML will notify you of various system-level events that directly relate to the lifecycle of your widget.

Widget Lifecycle

All widgets will have the following events called during their lifetime:

1. window.onload()

The widget has loaded, and is now running.

2. window.onpause()

The widget will be paused, because it is no longer visible to the user. This event is not yet implemented.

3. window.onresume()

The widget has been resumed, and is now visible to the user.

4. window.onunload()

The widget is in the process of shutting down.

Example

The following is an example code snippet for integrating with these events:

window.onload = function() {
    console.log('widget loaded');
};

window.onpause = function() {
    console.log('widget paused');
};

window.onresume = function() {
    console.log('widget resumed');
};

window.onunload = function() {
    console.log('widget shutdown');
};

This can be implemented anywhere.

Pausing and resuming

Your widget will spend most of its time in a paused state; it is not visible to the user, and all JavaScript execution is 'frozen'.

If you need to update your widget on a long-running timer, then it is recommended to do any necessary work in the window.onresume() event. This is because your timer will not fire when expected due to JavaScript execution being 'frozen'.