Android

Integration in a 100% native Android app requires setting up a separate activity that contains the WebView where the signup module will show up.

This guide will walk you through setting the WebView app and making sure your app has direct connection to the Signup module and can receive events and data from it.

Create and host an empty html page for loading the Signup module

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Signup</title>
</head>
<body>
  <script>
    window.onCheckinLoad = (sdk) => {
      window.checkin.settings.setLang('en')
      sdk.signUp.open()
    }
    // Listen to module events to be able to close the webview activity
    // when user closes the Signup module
    Object.defineProperty(window, 'regilyEventCallback', {
      value: function (eventData) {
        window.Android.onEvent(JSON.stringify(eventData))
      }
    })
  </script>
</body>
</html>

Within window.onCheckinLoad you should also define your setOnUpdate and setOnCompleted methods to handle the user data.

This is done exactly the same way described in the section on handling user data.

Create a new Android Activity

Create a new activity called Checkin.com. This activity is responsible for loading the Signup module inside a fullscreen webview, and listening to flow events:

package com.regily;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

import org.json.JSONException;
import org.json.JSONObject;

public class Regily extends AppCompatActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_regily);
    
    WebView myWebView = (WebView) findViewById(R.id.webview);
		myWebView.setWebViewClient(new WebViewClient());

		// Enable JavaScript on the WebView
		WebSettings webSettings = myWebView.getSettings();
		webSettings.setJavaScriptEnabled(true);

		// Set this Activity as a JavaScript interface for events handling
		myWebView.addJavascriptInterface(this, "Android");

		// Load Signup module with Android support (Change this)
		myWebView.loadUrl("https://myintegrationsite/index.html");
  }
  
  // Handler for Module state events. E.g. open/close
  @JavascriptInterface
  public void onEvent(String eventData) throws JSONException {
    JSONObject data = new JSONObject(eventData);
    
    switch (data.getString("action")) {
      case "open-module":
        Toast.makeText(this, "Module is open!", Toast.LENGTH_SHORT).show();
        break;
      case "close-module":
        this.finish();
        break;
    }
  }
}

Add a Webview to your Activity layout file

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:app="http://schemas.android.com/apk/res-auto"
	xmlns:tools="http://schemas.android.com/tools"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	app:layout_behavior="@string/appbar_scrolling_view_behavior"
	tools:context=".Regily">

	<WebView
		android:id="@+id/webview"
		android:layout_width="match_parent"
		android:layout_height="match_parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Remove ActionBar from your Webview Activity

This is one of the things you can do do make Signup module look better without distraction from the ActionBar. Other things you can do is making your Activity transparent so the original app content is still visible behind the Signup module.

Modify your new Activity in the AndroidManifest.xml file to look like this:

<activity android:name=".Regily" android:theme="@style/Theme.AppCompat.Light.NoActionBar"></activity>

Give your app permission to access the internet

This can be done by adding the following to your AndroidManifest.xml file

<manifest ... >
    <uses-permission android:name="android.permission.INTERNET" />
    ...
</manifest>

Launch the module with a button tap!

Put a button you want to use to open the Signup module in one of your Activities

<Button
    android:id="@+id/button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="openSignup"
    android:text="Signup" />

Then do this in the openSignup function to open Signup module in the new activity

public void openSignup(View view) {
  Intent intent = new Intent(this, Regily.class);
  startActivity(intent);
}