Unable to get Device Detail in Phonegap application

1
votes

I am trying to get device detail in an phonegap application using cordova. I have included the org.apache.cordova.device plugin in plugins folder

I have done entry in config.xml file

<feature name="Device">
    <param name="android-package" value="org.apache.cordova.device" />
</feature>

And when I run the application in my android mobile after compiling it on Phonegap

index.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="css/kendo.common.min.css" rel="stylesheet" />
    <link href="css/kendo.silver.min.css" rel="stylesheet" />
    <link href="css/examples.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="device.js"></script>
    <script type="text/javascript" src="phonegap.js"></script>
    <script type="text/javascript" src="PushNotification.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript">
        app.initialize();
    </script>
</head>
<body class="app">
    Application Started
</body>
</html>

index.js

var app = {
    // Application Constructor
    initialize: function() {
        this.bindEvents();
    },
    // Bind Event Listeners
    //
    // Bind any events that are required on startup. Common events are:
    // 'load', 'deviceready', 'offline', and 'online'.
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    // deviceready Event Handler
    //
    // The scope of 'this' is the event. In order to call the 'receivedEvent'
    // function, we must explicity call 'app.receivedEvent(...);'
    onDeviceReady: function() {
        alert("Device Ready");
        try
        {
            alert(device.model);
        }
        catch(e)
        {
            alert(e.message);
        }
        //app.receivedEvent('deviceready');

    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        var pushNotification = window.plugins.pushNotification;
        pushNotification.register(app.successHandler, app.errorHandler,{"senderID":"XXX","ecb":"app.onNotificationGCM"});

        console.log('Received Event: ' + id);
    },

    successHandler: function(result) {
        alert('Callback Success! Result = '+result)
    },

    errorHandler:function(error) {
        alert(error);
    },

    onNotificationGCM: function(e) {
        switch( e.event )
        {
            case 'registered':
                if ( e.regid.length > 0 )
                {
                    console.log("Regid " + e.regid);
                    alert('registration id = '+e.regid);
                }
            break;

            case 'message':
              // this is the actual push notification. its format depends on the data model from the push server
              alert('message = '+e.message+' msgcnt = '+e.msgcnt);
            break;

            case 'error':
              alert('GCM error = '+e.msg);
            break;

            default:
              alert('An unknown GCM event has occurred');
              break;
        }
    }
};

I get device is undefined alert box.

5
androidcordova
which version of cordova ? – Divesh Salian
try adding the plugin from CLI and then run this command cordova build android – Divesh Salian
I have added the plugin from command line and I am using PhoneGap Cloud Build to compile my application. – Siddharth Nagar
I have tried all that but its still not working... – Siddharth Nagar
Do you run your code after the 'deviceready' event? – Mulhoon

5 Answers

2
votes

Mine worked.

No need to put inside index.js. You can insert any javascript files without problem.

I put this script inside my index.html without any problem.

< script > 
alert(device.cordova);
alert(device.model);
alert(device.name);
alert(device.platform);
alert(device.uuid);
alert(device.version); 
< /script>

P.S: no need to use <uses-permission android:name="android.permission.READ_PHONE_STATE" /> in your android manifest.

1
votes

You're adding wrong lines in config.xml to add plugins in phonegap build.

To add the device plugin, you must not add the <feature> lines in config.xml, but the line :

<gap:plugin name="org.apache.cordova.device" />

For plugins usage in phonegap build, refer to this page.

1
votes

i experienced that the native plugin files don't get copied into the platforms folder when you add them via command line and rebuild the project. i managed to solve this in two ways:

  1. either

    • remove your platform (platform remove <platform>)
    • add the plugin via command line
    • add the platform again (platform add <platform>)

  2. or

manually copy the native plugin files into their appropriate plugin folder inside the platform folder. that way you won't have to remove your platform and lose all the changes you made to the native project.

on a sidenote, you don't have to mess around with your config.xml when u add plugins via command line, as this should be done automatically.

0
votes

This code is working:

      <script type="text/javascript">
         document.addEventListener("deviceready",onDeviceReady,false);
        function onDeviceReady () {
          var element = document.getElementById('demo');
            element.innerHTML = 'Device Model: '    + device.model    + '<br />' +
                        'Device Cordova: '  + device.cordova  + '<br />' +
                        'Device Platform: ' + device.platform + '<br />' +
                        'Device UUID: '     + device.uuid     + '<br />' +
                        'Device Version: '  + device.version  + '<br />';
         </script>

In html you have to mention add <div id="demo"></div> below body tag.

For clear understanding, please refer 'Full Example' part in the link: [1] http://docs.phonegap.com/en/3.3.0/cordova_device_device.md.html#Device

-1
votes

Add the below permission in AndroidManifest.xml

<uses-permission android:name="android.permission.READ_PHONE_STATE" />