Clever Geek Handbook

Phonegap Build: Accelerometer not working.

Let me first start by saying that I have seen a lot of these questions and many of them just say it is <script src="cordova-x-x-x.js"></script>

and some say the cordova.js file is not included in the Phonegap Build file.

So, I've been testing and fixing my code for a while now and am still getting the error from onError function

. I also copied and pasted the code from the phonegap docs .

So here's the clean code from the url:

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

    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8">
    document.addEventListener("deviceready", onDeviceReady, false);

    function onDeviceReady() {
        navigator.accelerometer.getCurrentAcceleration(onSuccess, onError);
    }

    function onSuccess(acceleration) {
        alert('Acceleration X: ' + acceleration.x + '\n' +
              'Acceleration Y: ' + acceleration.y + '\n' +
              'Acceleration Z: ' + acceleration.z + '\n' +
              'Timestamp: '      + acceleration.timestamp + '\n');
    }

    function onError() {
        alert('onError!');
    }

    </script>
  </head>
  <body>
  </body>
</html>

And in my config.xml file I added:

<gap:plugin name="org.apache.cordova.device-motion" />
<gap:plugin name="org.apache.cordova.device-orientation" />
+3


source to share


3 answers


After testing and polling the Phonegap Build team, they showed me the code with all the features. And this is the best way to make the accelerometer work with Phonegap Build



    <!DOCTYPE html>
<html>
  <head>
    <title>Device Ready Example</title>

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

    function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

    function onDeviceReady() {
        alert("Device is Ready");
        alert(device.available);
    }

    function getAcceleration(){
        navigator.accelerometer.getCurrentAcceleration(onAccelSuccess, onError);
    }

    function onAccelSuccess(acceleration) {
        var element = document.getElementById('accelerometer');
        element.innerHTML = 'Acceleration X: ' + acceleration.x         + '<br />' +
                            'Acceleration Y: ' + acceleration.y         + '<br />' +
                            'Acceleration Z: ' + acceleration.z         + '<br />' +
                            'Timestamp: '      + acceleration.timestamp + '<br />';
    }

    function onError() {
        alert('onError!');
    }

    function startWatch() {
        // Update acceleration every 1 seconds
        var options = { frequency: 1000 };

        watchID = navigator.accelerometer.watchAcceleration(onAccelSuccess, onError, options);
    }

    function stopWatch() {
        if (watchID) {
            navigator.accelerometer.clearWatch(watchID);
            watchID = null;
        }
    }
    </script>
  </head>
  <body onload="onLoad()">
    <p>
        <button onclick="getAcceleration()">Get Acceleration</button>
    </p>
    <p>
        <button onclick="startWatch()">Watch Acceleration</button>
    </p>
    <p>
        <button onclick="stopWatch()">Stop Watching Acceleration</button>
    </p>
    <div id="accelerometer">Waiting for accelerometer...</div>
  </body>
</html>
+3


source


I would say you try a full clean reinstall / restore using cordova. First of all, you must install a cordova for this. If you want to know how to get started with this, you should check out the Cordova documentation: Cordova CLI-Docs

After you have installed cordova, you enter a terminal and enter the following commands:

  • cd ~ / desktop
  • corova create test com.example.test test
  • cd test
  • Cordoba platform add android
  • cordova plugin add org.apache.cordova.device-motion
  • Cordoba build


Open the built project in Eclipse and add

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

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

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

    // device APIs are available
    //
    function onDeviceReady() {
        navigator.accelerometer.getCurrentAcceleration(onSuccess, onError);
    }

    // onSuccess: Get a snapshot of the current acceleration
    //
    function onSuccess(acceleration) {
        alert('Acceleration X: ' + acceleration.x + '\n' +
              'Acceleration Y: ' + acceleration.y + '\n' +
              'Acceleration Z: ' + acceleration.z + '\n' +
              'Timestamp: '      + acceleration.timestamp + '\n');
    }

    // onError: Failed to get the acceleration
    //
    function onError() {
        alert('onError!');
    }

    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>getCurrentAcceleration</p>
  </body>
</html>

Save everything and deploy the project to your device. And let me know if it worked or not.

0


source


Can't comment, so answering instead.

Regarding the above comment re "Phonegap and Cordova are similar (Came codebase)"

From http://docs.build.phonegap.com/en_US/3.1.0/introduction_getting_started.md.html :

To do this, just make sure in your index.html

<script src = "phonegap.js">

Note that this is interchangeable with

<script src = "cordova.js">

0


source






More articles:


All Articles