Capacitor

Add the MetaMap button to your Capacitor app.

MetaMap for Capacitor Usage Guide

This is a guide to implement MetaMap in the Ionic Capacitor framework.

Capacitor Demo App

You can go to GitHub to download the MetaMap Capacitor demo app.

Install MetaMap for Capacitor

The following instructions use command line tools to install MetaMap for Capacitor to your existing Capacitor application.

  1. Use the following CLI to install MetaMap for your Capacitor project.

    npm i @avo121/mati-capacitor-plugin
    
  2. Build your application.

    ionic build
    
  3. Update the Capacitor files.

    npx cap sync
    

How to update Capacitor 3.x.x

npm install @capacitor/[email protected] @capacitor/[email protected] @capacitor/[email protected] @capacitor/[email protected] --force

How toAdd the MetaMap Button

Add the MetaMap button to your application's HTML and JavaScript files.

your_index.html

    <ion-content>
    <ion-button className="metaMapButtonCss" (click)="showMetaMapFlow()">Show MetaMapFlow
    </ion-button>
    </ion-content>

your_index.ts

import { Component } from '@angular/core';

import { MetaMapCapacitor } from "@avo121/mati-capacitor-plugin";

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  constructor() {}

  showMetaMapFlow() {
    let metadataParams = { param1: "value1" };
    let registerParams = { clientId: "YOUR_CLIENT_ID", flowId: "YOUR_FLOW_ID", metadata: metadataParams};

    MetaMapCapacitor.showMetaMapFlow(registerParams)
      .then( verification => console.log("verification success:" + verification.verificationId))
      .catch(() => console.log("verification cancelled"))
  }
}

Launch for Android

Run the following command to launch the application for Android:

ionic capacitor run android

Launch for iOS

To launch the application for iOS, you need to do the following:

  1. Set minimum iOS version in capacitor.config.json

     "ios": {
      "minVersion": "12.0"
    }
    
  2. Launch the application for iOS

    ionic capacitor run ios
    

Uninstall MetaMap for Capacitor

Use the following CLI to uninstall MetaMap from yours project.

npm uninstall --save npm i @avo121/mati-capacitor-plugin

Did this page help you?