Search code examples
javascriptioscordovaphonegap-pluginshybrid-mobile-app

What is necessary to use a phonegap plugin?

I am working on a project where I need to use navigator.notification.alert ... as a replacement for alert() (because alert() has a label at the top saying index.html).

I am using the PhoneGap View application for iOS to test this application out, and nowhere does it allow me to invoke that method (navigator.notification.alert()).

Here is what I did:

  • Installed the plugin using phonegap plugin add ...
  • Called the method ... .alert(...)

Since I am fairly new to Phonegap and Cordova, I would like a list of everything I would need to actually use this plugin.

Is there any JavaScript file which I would need to import? Is there a way to import the plugin into my HTML? Can I have a list of everything I need to do to use any PhoneGap plugin?

Update 1

Even after creating a new phonegap application, I don't get any cordova.js files:

enter image description here

Solution

  • Try adding platform with (it will add cordova.js file which is necessary for plugins)

    cordova platform add android/ios

    and then build

    cordova build

    Possibly issue of Phonegap reported here and here.(Due to that its not adding cordova.js file)

    Do call any plugins after device ready because that makes plugins available. If you will call plugins directly then you may get plugins undefined.

    For Example

    <!DOCTYPE html>
<html>
  <head>
    <title>Notification Example</title>

    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    //
    function onDeviceReady() {
        // Empty
    }

    // alert dialog dismissed
    function alertDismissed() {
        // do something
    }

    // Show a custom alert
    //
    function showAlert() {
        navigator.notification.alert(
            'You are the winner!',  // message
            alertDismissed,         // callback
            'Game Over',            // title
            'Done'                  // buttonName
        );
    }

    </script>
  </head>
  <body>
    <p><a href="#" onclick="showAlert(); return false;">Show Alert</a></p>
  </body>
</html>

    Reference

    Regards.