Cordova/PhoneGap/Ionic support

Goal

The goal of this guide is to show how MobileSDKv3 can be integrated and used at apps built with Cordova/PhoneGap/Ionic framework. This guides only work for MobileSDKv3, not for version v2 or older of the MobileSDK. If you are interested in integrating CameraManager MobileSDK into you mobile apps its required to support MobileSDKv3.

Assumptions

This guide assumes that the reader has basic knowledge of Cordova/PhoneGap/Ionic frameworks and familiar with their building process.

Overview

Apache Cordova is an open-source mobile development framework using HTML, CSS, JavaScript. Adobe PhoneGap framework is an open source distribution of Apache Cordova. Ionic is a complete open-source SDK for hybrid mobile app development build on top of Apache Cordova. The CameraManager MobileSDK is a native component. This guides explains how to incorporate the native components into the Cordova framework.

Installation guide

Building process is very similar for Cordova/PhoneGap/Ionic frameworks therefore below you can find instructions for MobileSDK plugin integration into Cordova project. 

Follow same steps to integrate MobileSDK plugin into PhoneGap/Ionic projects. 

Steps to setup iOS project

• Download and unzip the latest version of MobileSDK Cordova plugin.
• Download the latest version of CMMobileSDK.framework and put it at path/to/plugin/libs/ios.
• Add next lines to config.xml file of your Cordova project (or use ours Cordova Sample App):

<plugin name="plugin-mobile-sdk-v3" spec="relative/path/to/plugin" />
<engine name="ios" spec="^4.5.5" />

• Open Terminal app, navigate to root folder of your Cordova project and run next commands:
  • cordova platform add ios
  • cordova build ios
• Open platforms/ios/.xcworkspace.
• If using Xcode 10.2 or later:
  • Select Pods project
    • Select Alamofire - Build Settings - Swift language version - Swift 4.2
    • Select SwiftyJSON - Build Settings - Swift language version - Swift 4.2
• Run project.

  Steps to setup Android project

• Download and unzip the latest version of MobileSDK Cordova plugin.
• Download the latest version of CMMobileSDK.aar and put it at path/to/plugin/libs/android.
• Add/edit next lines to config.xml file of your Cordova project (or use ours Cordova Sample App):

<widget id="com.cameramanager.cordova" ...*xmlns:android="http://schemas.android.com/apk/res/android"**\>
      
    <plugin name="plugin-mobile-sdk-v3" spec="relative/path/to/plugin" />
    <engine name="android" spec="^8.0.0" />  
        
    <config-file target="AndroidManifest.xml" parent="/\*">  
        <uses-permission android:name="android.permission.WAKE\_LOCK" />  
    </config-file>

• Open Terminal app, navigate to root folder of your Cordova project and run next commands:
  cordova platform add android
  cordova build android
  cordova run android

Cordova sample app

To use sample app perform all the steps above for your target platform. 

Sample app implements very basic JS-to-native-code and vice-versa interactions.

Sample app does not contain access token retrieving logic.

For quick iOS or Android applications test hardcode access token retrieved by you at iOSMobileSDKv3.m or CMMobileSdkPlugin.java respectively and set valid camera id at index.js file at setupStreamerButton function at CMMobileSDK.checkStreamer() method invocation (method takes two parameters: camera id and streaming frame coordinates).

Feel free to improve and extend sample app  for your needs. 

Downloads

Cordova plugin

Cordova Sample App

Release notes

v1.0.4

• Updated iOS plugin for Xcode 11.2 & Swift 5.1.2
• Updated minimum deployment target to iOS 10.0

v1.0.3

• Updated iOS plugin for Xcode 10.2 & Swift 5

v1.0.2

• Fix Android plugin issue with the latest MobileSDK

v1.0.1

• Added support for Android platform. 

v1.0.0

• Initial release