Sign up! We’ll send you a link to your component, set up your Onymos Cloud Account, and generate your Onymos license credentials. In the meantime, you can get familiar with our API Documentation and developer resources, or join a whole community of developers building apps with Onymos on Reddit!

Add your components to a folder in your app’s root (e.g., onymos_components).

Add the Onymos Initialize component to your environment.

$ cordova plugin add onymos_components/onymos-component-initialize

Then we can add the Onymos Media component.

$ cordova plugin add onymos_components/onymos-component-media

Then update the widget inside your config.xml with the Onymos Widget ID you receive after you create an Onymos Cloud Account.

Using the Media component in your app
The Onymos team is revolutionizing media for mobile apps. When you use the Onymos Media component, you’re leveraging a proprietary compression algorithm that optimizes the quality of the images and video you, and your users, capture and upload!

Before we use Media, let’s make sure we have everything we need to configure your onymosConnectObject. The onymosConnectObject requires the appropriate Onymos license credentials: your Customer ID (also called an Onymos ID) and your Onymos Auth Token. You’ll need these credentials to use this (or any) component in your app.

Next, let’s go inside your Cordova app’s index.js file and initialize Media.

var OnymosInitalize
var OnymosMedia
var OnymosMediaConstants

document.addEventListener('deviceready', onDeviceReady, false);

function onDeviceReady() {
  const OnymosConnectObject={
    customerId : 'Your customerId goes here', 
    onymosAuthToken : 'Your onymosAuthToken goes here',  
    envType: 'PRD'
  }

  OnymosInitialize.initialize(
    OnymosConnectObject,
      
    function onymosInitializeSuccess(status){
      console.log("Onymos initialized Successfully.", status)
    },

    function onymosInitializeFailure(error){
      console.log("Onymos failed to initialize."), error
    })
}

Great! If we configured your onymosConnectObject correctly, onymosInitializeSuccess() should print its message to the console. Now we’re ready to use Media. Let’s create a function called captureMedia() in the index.js file, then your users will be able to take photos in your app!

function captureMedia() {
  OnymosMedia.select(
    callId,
    PictureSourceType, 
    MediaType,

    function mediaSelectionSuccess(mediaURI, mediaObj){
      console.log(mediaURI, mediaObj)
    }

    function mediaSelectionFailure(error){
      console.log(error)
    },
    
    options)
}

Your callId will be a string that identifies your media (e.g., ‘1’). PictureSourceType is a constant from OnymosMediaConstants that lets a user choose media already on their device, or opens the device’s camera to capture a new photo or video (PHOTOLIBRARY or CAMERA). We use MediaType to choose what sort of media you’ll let a device capture (PICTURE, VIDEO, or ALLMEDIA). Lastly, we can configure options to save captured media to the device or limit the duration of captured video.

Let’s actually configure the select() method.

function captureMedia() {
    OnymosMedia.select(
      '1',
      OnymosMediaConstants.PictureSourceType.CAMERA, 
      OnymosMediaConstants.MediaType.PICTURE,
  
      function mediaSelectionSuccess(mediaURI, mediaObj){
        console.log(mediaURI, mediaObj)
      }
  
      function mediaSelectionFailure(error){
        console.log(error)
      },
      
      {
        saveToPhotoAlbum: true
      })
  }
 

In index.html we can write the front-end code that calls captureMedia().

<div (click)="captureMedia()">
  <img src="https://img.icons8.com/android/48/000000/camera.png" alt="A camera icon"/>
</div>

Now, you and your users can take pictures from your app! Try changing the MediaSourceType so that the select() method can record video too (remember, you can limit the duration of the captured video in options), or add more even more functionality so that your app can upload media to the Onymos Cloud or your own database.

How do I squash this bug? Is Ionic supposed to do that? Why is this iOS build failing?

Let’s figure it out—join the Onymos community on Reddit! More of a loner? You can email us directly at customersuccess@onymos.com.