Code Monkey home page Code Monkey logo

rnokay's Introduction

Installation

1) Create folder custom_modules in your project root folder:

  • Project_Name/custom_modules
2) Added folder with library to your custom_modules folder:

  • Project_Name/custom_modules/RNOkaySDK
3) Added to package.json dependencies:

  • "react-native-okay-sdk": "file:custom_modules/RNOkaySDK"
4) Install node_modules:

$ npm install
5) Link library with react-native:

$ react-native link react-native-okay-sdk

Android

6) Configure Android project:

  • Open Project_Name/android/build.gradle
  • Set minSdkVersion in build.gradle
buildscript {
    ext {
        buildToolsVersion = "28.0.3"
        minSdkVersion = 16
        compileSdkVersion = 28
        targetSdkVersion = 28
        supportLibVersion = "28.0.0"
    }
    .....
    dependencies {
      classpath("com.android.tools.build:gradle:3.4.1") // update gradle to 3.4.1
      ...
    }
    .....
}
  • Added maven repository to build.gradle
allprojects {
    repositories {
        mavenLocal()
        google()
        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url "$rootDir/../node_modules/react-native/android"

        }
        // Begin: Added This
        maven {
            url 'https://dl.bintray.com/okaythis/maven'
        }
        // End:
    }
}
7) Added permissions to AndroidManifest.xml:

  • Open Project_Name/android/src/main/AndroidManifest.xml
  • Added user-permissions to AndroidManifest.xml
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.READ_PHONE_STATE"/>
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
8) Added databinding and multidex for android:

  • open Project_Name/android/app/build.gradle
android {
    compileSdkVersion rootProject.ext.compileSdkVersion

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
    // Begin Added DataBinding
    dataBinding {
        enabled = true
    }
    // End
    defaultConfig {
       ...
       multiDexEnabled true // Added this line
    }
    ...
}
9) Install react-native Firebase:

iOS

6) Download PSA.framework and PSACommon.framework:
7) Unpack content of PSA.zip and PSACommon.zip to the RN's PROJECT_DIR/ios
8) Open XCode project structure
  • right-click on Frameworks folder in Project Structure
  • click Add files to "PROJECT_NAME"...
  • Added PSA.framework and PSACommon.framework
9) Open PROJECT_NAME target
  • Open Build Phases tab
  • Remove PSA.framework and PSACommon.framework from Link Binaries with Libraries
  • Open General tab
  • Drag and drop PSA.framework and PSACommon.framework into Embedded Binaries
10) Added Push Notifications
11) Install react-native Firebase:

Usage

Allowed methods:
  • permissionRequest()
     RNOkaySdk.permissionRequest().then(response => console.log(response)); // Response: Array or required permissions
    CompontentDidMount() {
        RNOkaySdk.init("http://protdemo.demohoster.com").then(response =>
            ...
        );
    }
  • updateDeviceToken(token) // (ONLY FOR iOS). Token received from PushNotificationsIOS
    // For example
    CompontentDidMount() {
         PushNotificationIOS.addEventListener('register', token => {
                RNOkaySdk.updateDeviceToken(token);
          })
          ...
        );
    }
    
    
  • isEnrolled()
  • isReadyForAuthorization()
  • authorization(SpaAuthorizationData) // Called after receive message from firebase
    firebase.messaging().onMessage(message => {
      startAuthorization(message.data.sessionId);
    });
    startAuthorization = (sessionId) => {
        firebase.iid().get()
          .then(instanceID => {
            RNOkaySdk.authorization({
              SpaAuthorizationData: {
                sessionId: sessionId, // Received from firebase messaging
                appPNS: instanceID,
                pageTheme: { // Page Theme customization, if you don't want customization: pageTheme: null
                    actionBarTitle: "YOUR_ACTION_BAR_TITLE",
                    actionBarBackgroundColor: 5,
                    actionBarTextColor: 10,
                    buttonTextColor: 15,
                }
              }
            }).then(response => console.log(response));
          })
          .catch(error => console.log(error));
    }
  • enrollProcedure(SpaEnrollData)
    firebase.iid().get()
      .then(instanceID => {
        RNOkaySdk.enrollProcedure({
          SpaEnrollData: {
            host: "http://protdemo.demohoster.com", // PSS server address
            appPns: instanceID,
            pubPss: pubPssBase64, // public Pss key https://github.com/Okaythis/okay-example/wiki/Mobile-Client-Settings
            installationId: "9990", // installationId https://github.com/Okaythis/okay-example/wiki/Mobile-Client-Settings
            pageTheme: { // Page Theme customization, if you don't want customization: pageTheme: null.
               actionBarTitle: "YOUR_ACTION_BAR_TITLE",
               actionBarBackgroundColor: "#ffffff",
               actionBarTextColor: "#ffffff",
               buttonTextColor: "#ffffff",
            }
          }
        }).then(response => console.log(response));
      })
      .catch(error => console.log(error));

Page Theme properies for Android

Page Theme properies for iOS: Not available now.

rnokay's People

Contributors

meyerpv avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.