X

Geertjan's Blog

  • May 10, 2016

Plugging into Devices with Oracle JET on Cordova (Part 1)

Geertjan Wielenga
Product Manager

In a previous blog entry, I discussed how to create AngularJS applications that access the native resources on devices, such as the camera on Android, via Cordova. Let's now do the same thing with an Oracle JET application. Start by using Yeoman to scaffold your hybrid (i.e. Cordova-based) Oracle JET application. Now you're good to go with the instructions that follow.

Take the following steps:

  1. In the "hybrid" folder in your application, you'll find a file named "config.xml", which is the central configuration file for all your Cordova-related work. Underneath the Cordova Whitelist plugin, add the Cordova Camera plugin, as shown below:
    <content src="index.html" />
    <plugin name="cordova-plugin-whitelist" spec="1" />
    <plugin name="cordova-plugin-camera" spec="1" />
    <access origin="*" />
    Then build the application, as shown in the earlier YouTube clip on this topic, i.e., "grunt build --platform android" and you'll find the "cordova-plugin-camera" folder has been added for you:



  2. Open the "incidents.html" file, which is in "src/js/views", and add a button that has its "click" event bound to a function named "takePicture":
    <button data-bind="click: takePicture">Take Picture!</button>
  3. Open the "incidents.js" file, which is in "src/js/viewModels", and add the function that you referenced in your HTML file, making use of the Cordova Camera API:
    self.takePicture = function () {
    navigator.camera.getPicture(
    function (imageURI) {
    //to be done
    },
    function (err) {
    //to be done
    },
    {
    quality: 50,
    destinationType: Camera.DestinationType.FILE_URI
    }
    );
    };

When you serve up the application to the device, using "serve --platform=android --destination=device", you'll be able to click the button and start the camera. After you take a picture, nothing happens, though that's the point of this blog entry—simply to show you how to connect to a resource on a device, subsequent blog entries will show subsequent steps.

Join the discussion

Comments ( 1 )
  • John Brock Friday, May 13, 2016

    Remember that Oracle JET uses Cordovoa right off the shelf without any modifications or wrappers. So if you wanted to use Cordova commands to look up the name for a specific plugin for instance, you can type on the command line:

    cordova plugin search <some name like: contact>

    and Cordova will open your browser with the results of that search. You can then follow the process that Geertjan describes, or do the normal:

    cordova plugin add <plugin name>


Please enter your name.Please provide a valid email address.Please enter a comment.CAPTCHA challenge response provided was incorrect. Please try again.