Some test text!

Search
Hamburger Icon

iOS / Guides

Add an API for Cordova / Ionic

This project is no longer in development. If you are looking for cross-platform solution, check out React Native or Flutter. If you are looking to add to your current Cordova/Ionic project, check out the WebViewer sample.

Introduction

The Apryse iOS Cordova API includes all of the most used functions and methods for viewing, annotating and saving PDF documents. However, it is possible your app may need access to APIs that are available as part of the native API, but are not directly available to Cordova.

This guide provides an example of how to add a "save" API to the Cordova interface, which triggers a save of the file and returns the file path of the save file. You can follow the same pattern to add new APIs that your Cordova app may need. The new APIs could be simple ones, which expose one piece of functionality, or custom ones, that expose a series of native commands under the hood.

Example: Adding the "save" API

1. Fork and clone Apryse's Cordova Plugin Repo

The plugin is hosted on GitHub here: https://github.com/PDFTron/pdftron-cordova

Fork the project and clone a copy of the repository to your disk.

2. Update the .js interface file

The .js interface file lists all of the Cordova APIs. It is located, starting at the forked plugin project, at www/PDFTron.js.

Add the following new API:

NativeViewer.prototype.save = function (success, error) {
exec(success, error, 'Apryse', 'save', []);
};

In the code above, success and error are output parameters, Apryse is the name of the module, save is the name of the method, and [] is an empty input parameter list.

3. Update the native Objective-C header

The Objective-C header defines the interface for the native methods called by JavaScript. The file is found at src/ios/PDFTron.h.

Add the method signature:

-(void)save:(CDVInvokedUrlCommand*)command;

4. Implement the new method in the Objective-C implementation file

The Objective-C implementation file is found at src/ios/PDFTron.m. This file is where the underlying native implementation is written.

Sometimes this is as simple as a single line of code. In this case it is calling save, which is asynchronous, and which we want to return a string (the file path).

-(void)save:(CDVInvokedUrlCommand *)command
{
    [self.documentViewController saveDocument:e_ptincremental completionHandler:^(BOOL success) {
        // this code is executed after the document has successfully saved
        NSString* filePath = self.documentViewController.coordinatedDocument.fileURL.path;

        if (!filePath )
        {
            filePath = [self.documentViewController.document GetFileName];
        }

        CDVPluginResult* pluginResult;

        if( success )
        {
            // return that the save commend succeeded, along with the file path
            pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsString:filePath];
        }
        else
        {
            // return that the save commanf failed, along with the file path for the attempted save
            pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR messageAsString:filePath];
        }

        [self.commandDelegate sendPluginResult:pluginResult callbackId:command.callbackId];

    }];

}

5. Push the code and integrate the updated plugin

Push your changes back to your forked copy of the repo.

Next, from the command line, navigate to the root of your Cordova app project and remove the Apryse Cordova plugin as follows:

cordova plugin remove pdftron-cordova

Then integrate your forked copy of the repo with the changes, using the appropriate names for your Git(Hub) name/repo:

cordova plugin add https://github.com:MyGithubOrg/pdftron-cordova-fork.git

The new method is now ready to use.

Note that if you later on need to update any code in the plugin (for example to add another method, or to fix a bug), you will need to remove and re-add the Cordova plugin every time in order to make the changes visible to your app.

6. Access the new functionality

The app can now access the new API as follows:

this.viewer.save(function (s) {
    console.log(s);
    fileUrl = "file://" + encodeURI(s);
    console.log(fileUrl);
}, function (e) {
    console.log(e);
});

6. All done!

If you're only developing for iOS, then you're all done!

If you're also deploying on Android, you'll need to repeat steps 3 and 4 for Android.

If you're developing for both iOS and Android, please consider submitting a PR, as upstreaming the change will simplify your developing and make the API available for other Apryse customers.

Get the answers you need: Chat with us