giovedì 14 febbraio 2013

Accelerazioni in HTML5/PhoneGap

Un esempio di come registrare le accelerazioni su un dispositivo mobile senza utilizzare le API native

In questo caso e' stata usata la libreria PhoneGap ... la stessa cosa sarebbe stata possibile anche con il solo HTML5 con il problema di dover gestire le differenti implementazioni sui differenti browsers

-----------------------------------------
<!DOCTYPE html>
<html>
  <head>
    <title>Accelerazione</title>

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

    document.addEventListener("deviceready", onDeviceReady, false);

    function onDeviceReady() {
    var options = { frequency: 100 };
        navigator.accelerometer.watchAcceleration(onSuccess, onError);
    }

    // onSuccess: Get a snapshot of the current acceleration
    //
    function onSuccess(acceleration) {
    
    var accx = document.getElementById('accx');
    var accy = document.getElementById('accy');
    var accz = document.getElementById('accz');
   
    accx.innerHTML = 'Accelerazione X :  '     +acceleration.x;
    accy.innerHTML = 'Accelerazione Y :  '     +acceleration.y;
    accz.innerHTML = 'Accelerazione Z :  '     +acceleration.z;
   
  
    }

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

    </script>
  </head>
  <body>
    <p id="accx">Accelerazione X : </p><br>
    <p id="accy">Accelerazione Y : </p><br>
    <p id="accz">Accelerazione Z : </p><br>

    
  </body>
</html>


-----------------------------------------