Plugins Overview for Your Intel® XDK Cordova* App

Apache* Cordova* plugins are a very important tool for enhancing the features and functionality of your mobile HTML5 Cordova application. They provide a way to extend your app's JavaScript* API, resulting in a much tighter integration of your app with the mobile device's software and hardware.

There are hundreds of Cordova (and Adobe* PhoneGap*) plugins available for use with your app. They can be found in the Apache Cordova Plugins Registry and similar plugin registries, as well as many open source github repos. If you work for a large company your IT department may even maintain a set of Cordova plugins they've developed for mobile apps used by your company's employees.

The Intel XDK references and uses Cordova plugins throughout the development cycle of your HTML5 Cordova application. The most apparent usage is in the Projects and Build tabs. The Projects tab lets you select which Cordova plugins will be included as a part of your app. The Build tab will then automatically incorporate those plugins, along with your app sources, into your app build package. Less obvious is their use in the Simulate tab.

The Simulate tab makes note of which Cordova plugins you've included using the Projects tab and will only present to your application those APIs that correspond to the plugins you've added to your project.

See Debug & Test Overview for recommendations on how to debug your Intel XDK apps, especially those that incorporate third-party plugins.

What is a Cordova Plugin?

Paraphrasing the Cordova Plugin Development Guide:

A plugin is a package of code that allows your Cordova HTML5 app to communicate with the native platform on which it runs. Plugins provide access to platform functionality that is ordinarily unavailable to browser-based apps. The core Cordova (and Intel XDK) APIs are implemented as plugins. Many other plugins are available that enable features such as barcode scanners, NFC communication and access to local phone and tablet software databases (such as phone contacts and calendar entries).

Plugins consist of a JavaScript API and native code modules (for each platform supported by the plugin) that support the plugin's JavaScript API. In essence, when your app calls the plugin's JavaScript API, it is redirected to the underlying plugin native code that implements that API on the device. For example, the JavaScript API is redirected to Java code on an Android device or to Objective C code on an iOS device. Plugins can be complex or simple: providing APIs as complex as a persistent database engine or as simple as a method to turn on the camera's flash LED.

Cordova plugin software layers

Do I Need to Learn How to Write Native Code in Java, Objective C and C#?

Absolutely not. Most plugins can be pulled directly from a plugin registry or github repo and used as-is, without learning how the plugin operates internally. You do not need to "compile" anything to use a properly structured plugin, most are ready to use without any configuration or internal programming required.

You will need to learn how to use the plugin's JavaScript API in order to use it within your app; but that is to be expected. You can think of a Cordova plugin as a JavaScript library that extends the device-specific features your app can access, features that you typically are not able to access from a standard browser or WebView (the embedded browser that interprets your HTML5 hybrid app). Plugins provide the extra features that distinguish a mobile app from a browser-based web app.

Some important points to keep in mind regarding Cordova plugins:
Since plugins are third-party libraries, the Intel XDK has no explicit knowledge of a specific plugin's internal functionality or code. The Simulate tab only provides direct support for the "core" Cordova plugins.
Not all plugins are created equal! Many plugins are available for only the Android and iOS platforms. The "core" Cordova plugins support a wide range of Cordova platforms. Be sure to confirm that the plugins you plan to use support the platforms on which you plan to deploy your app, or use platform and feature detection techniques to implement an alternate solution for unsupported platforms.
Not all plugins support all platforms with identical API behavior. In other words, some aspects of a plugin API may vary as a function of the platform (this is usually due to platform details, not because the plugin is incomplete or deficient). Variations include properties that have no meaning on some platforms or methods that do not exist on other platforms. See the plugin's documentation for these details (some plugins include a "quirks" documentation section), and use platform and feature detection techniques to properly handle these API "quirks."
The Intel XDK does not include a mechanism to judge the quality of a plugin. There are many resources on the web, including the cordova-plugins and phonegap-plugins tags on StackOverflow* that can be used to determine which plugins are the most reliable and how to work around bugs associated with specific plugins. In addition, you can get support directly from the author of many github hosted plugins if you have issues with those plugins.
Some third-party plugins are written for older versions of Cordova and may not work with current versions of Cordova.
The "core" Cordova APIs are all written as Cordova plugins. The "core" Cordova plugins are maintained by the Cordova CLI development community.
Third-party Cordova plugins can be used with Cordova builds and Crosswalk for Android builds.
If you are developing your own Cordova plugin you may need to install and use the Cordova CLI system on your development system. You can share your plugin with others without requiring that they also install the Cordova CLI system, only you (the plugin developer) will need to install Cordova CLI (and only for plugin development, the Intel XDK does not require that the Cordova CLI be installed on your development system as a condition of inclusion in your app).
The Simulate tab does not use Cordova native code for simulation of plugin APIs, it relies on code written for the node-WebKit environment on which it runs to provide a simulation of the native code component. Thus, for those plugins that the Simulate tab does support, only the JavaScript component of each plugin is used within the Simulate tab.
The Intel App Preview applications that you downloaded from the respective app stores for quick debug of your HTML5 mobile apps do not include support for third-party Cordova plugins, only for the "core" Cordova plugins. To debug an app that relies on a non-core Cordova plugin you must either use feature detection to skip over or "fake out" plugin-specific code when it is not present (as will be the case when your app runs inside of App Preview and the Simulate tab). You must build your app so that it includes the third-party plugins and then run and debug your built app on a real device.

See Debug & Test Overview for recommendations on how to debug your mobile Cordova apps, especially those that incorporate third-party plugins.

How Do I Reference cordova.js Script from My Project index.html File

To enable the use of Cordova plugins in an HTML5+Cordova project type, reference the cordova.js script file exactly once in your index.html file:

<script type="text/javascript" src="cordova.js">

If your project contains more than one HTML file (or page) that will use Cordova APIs, you must include a reference to the cordova.js script file in each of those HTML files. It is highly recommended that you limit yourself to building single-page apps (SPAs) when creating Cordova applications. See this Cordova Best Practices article for more details. Also, note that the cordova.js file is a "phantom" file; it is not present in your project directory, but is added by the Cordova build system when your application is built (it is customized for your app as part of the build process).

How Do I Add and Maintain Plugins for an Intel XDK Project?

To add new plugins for the active project, use the Projects tab under Plugin Management. You can add plugins from:

  • A plugins registry
  • A git repository

You also use Plugin Management to maintain/manage your plugins over time, such as to change versions or variables of an existing plugin or add/remove plugins. See Adding and Managing Plugins.

Where are Plugins Stored?

The Plugin Manager stores the plugins you add to your project in a directory named plugins within the project directory on your development system. This means that when you add a plugin, the plugin is fetched and added to your project's plugins directory. You can view the contents of your plugins directory and your source directory root (usually named www using the file tree in the Develop tab or your development system's file explorer tool. 

Where Can I View Documentation About Plugins?

As you explore plugins using the Projects tab, you can also view documentation details (Get Documentation) for possible new plugins as well as plugins already added to your project (see Adding and Managing Plugins). You can also view plugin documentation in the API Reference section of the Apache Cordova Documentation pages.

Where Can I Read Short Code Examples about Using Certain Cordova Plugins?

Several short articles have been created and published to the Intel Developer Zone about using the core Cordova plugin APIs; these short articles include code snippets. For example, see:

For additional short code examples, search using the Intel Developer Zone search tool (upper-right of the page).

For more complete information about compiler optimizations, see our Optimization Notice.