[STEP5] Interlinking Widgets

To create a seamless experience between the widget and the app and to achieve our service goals through integration, you can call the "JS interface" for specified actions within the widget webview linked to the mobile app to connect with the app.
The name of the JavaScript interface to be referenced within the widget is [WaikerInterface].

Example of JS Interface Integration

webView.addJavascriptInterface(WebAppInterface(this), "WaikerInterface")

class WebAppInterface(private val context: Context) {
    @JavascriptInterface
    fun close() {
        // Logic to close the current in-app webview that called this method
    }

    fun newWindow(url: String) {
        // Logic to open a new in-app webview with the provided URL
    }

    // Implement any necessary logic from the list below
}

webView.configuration.userContentController.add(self, name: "WaikerInterface")

extension ViewController: WKScriptMessageHandler {
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if message.name == "WaikerInterface" {
            if let body = message.body as? [String: Any] {
                if let method = body["method"] as? String {
                    switch method {
                    case "close":
                        // Logic to close the current in-app webview that called this method
                        break
                    case "newWindow":
                        if let url = body["url"] as? String {
                            // Logic to open a new in-app webview with the provided URL
                        }
                        break
                    // Implement any necessary logic from the list below
                    default:
                        break
                    }
                }
            }
        }
    }
}

List of JS Interfaces

Function Name	Parameters	callbackReturn	Action Description
close	-	-	Close WebView
newWindow	url: string;	-	Invoke New WebView
moveToSell	ticker: string;	-	Navigate to the Stock Sell Page
moveToBuy	ticker: string;	-	Navigate to the Stock Buy Page
moveToStock	ticker: string;	-	Navigate to the Stock Details Page
share	title?: string; text?: string; url: string;	-	Share Action