Implement game-events listener

This document helps you implement event listeners within your native apps.

You may want to listen to the events Gamezop games broadcast if you have custom UI overlays to implement at the occurrence of specific events, or if you want to take any action when a particular in-game event occurs. This document guides you on how you can do that.

Guides are available for:

Android apps

If you have our game running within a WebView, you can listen to events with the following steps:

Step 1: Enable Javascript in WebView

Let's say your WebView is defined as myWebView. Here's a code-block for enabling Javascript:

val myWebView: WebView = findViewById(R.id.webview)
myWebView.settings.javaScriptEnabled = true

Step 2: Create a class to receive events

We will create a class called gamezopWebAppInterface. Within that, we will define a getGameEvents function. Do not change the name of the function, as this is the function our games will call to pass events to the app.

When our game calls the function, it will pass a stringified JSON object as an argument to the function which will have all the data on the event being sent.

Upon receiving the events, for simplicity sake, let's say we want to just print them in Toasts. You can, of course, replace this with your desired actions.

/** Instantiate the interface and set the context  */
class gamezopWebAppInterface(private val mContext: Context) {

    /** Get Game Events and Show a toast from the web page  */
    @JavascriptInterface
    fun getGameEvents(gameEvent: String) {
        Toast.makeText(mContext, gameEvent, Toast.LENGTH_SHORT).show()
    }
}

Step 3: Assign the class to your WebView

Where you initialise the Webview, you need to add a Javascript interface there. This is basically the class you created in Step 2.

val webView: WebView = findViewById(R.id.webview)
webView.addJavascriptInterface(gamezopWebAppInterface(this), "AndroidBridge")

That's all. You're good to go!

Flutter apps

For Flutter apps, you just need to add a JavaScript channel with the name AndroidBridge.

WebView( 
 initialUrl: url, 
 javascriptMode: JavascriptMode.unrestricted, 
 javascriptChannels: Set.from([ 
  JavascriptChannel( 
   name: 'AndroidBridge', onMessageReceived: (JavascriptMessage message) {
     // This is where you can use your game events
     print(message.message);
   }),
  ]), 
 onWebViewCreated: (WebViewController w) { 
  webViewController = w; 
 },
)

iOS apps

For iOS applications, you just need to add a JS Message Handler.

override func viewDidLoad() { 
  super.viewDidLoad() 
  let config = WKWebViewConfiguration()
  config.userContentController = WKUserContentController()
  config.userContentController.add(self, name: "gameState")
  let webView = WKWebView(frame: CGRect(x: 0, y: 0, width: 200, height: 200),     
  configuration: config) 
  view.addSubview(webView)
  webView.loadHTMLString(content, baseURL: nil)
 }

 func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
 print(message.body) 
}

Last updated