Social Features: Changing Contexts

If you prefer to change contexts from buttons in the overlay view itself, you can make use of Context Actions. There are other ways to do this as well detailed in Example Use Cases.

Context Actions in Overlay Views

You can invoke actions to create/switch into contexts from the overlay view:

1. Context Create

<Button content=”Play” action=”{{FBInstant.action.contextCreate({{friendEntry.id}})” />

2. Context Switch

<Button content=”Play” action=”{{FBInstant.action.switchContext({{contextID}})” />

You can also pass callback functions for success and error for context actions:

// Success/error callbacks
const successFunc = (contextID) => {
    console.log("Context action success with context ID:", contextID);
};
const errorFunc = (error) => {
    console.log("Context action error with error", error);
};

// SDK call    
FBInstant.onContextChange(
    successFunc,
    errorFunc,
);

Custom Event Passing

It is supported to pass real-time events from an overlay view to your main game bundle with the syntax below:

// Overlay Definition
<View  onTapEvent="<custom_event>">
    <Image src="{{FBInstant.player.photo}}" className="profilePicture" width="50"/>
    <Text content="{{FBInstant.player.name}}" className="playerName"/>
</View>

// Javascript Event Handling
FBInstant.overlayViews.setCustomEventHandler((eventStr, overlayID) => {
   document.getElementById('overlayCustomEventOutput').innerHTML +=
      ' |' + eventStr + ' triggered by ' + overlayID + '| ';
});

Notes

  • The Custom Event Name cannot contain any data requests like {{FBInstant.player.name}}.