var theDetailElementAcceleration = document.getElementById('deets-accel');
var theDetailElementOrientation = document.getElementById('deets-orien');

function handleMotionEvent(event) {

    var x = event.accelerationIncludingGravity.x;
    var y = event.accelerationIncludingGravity.y;
    var z = event.accelerationIncludingGravity.z;

    // Do something awesome.

    var deets = "Acceleration x: " + x;
    deets += "<br>Acceleration y: " + y;
    deets += "<br>Acceleration z: " + z;

    theDetailElementAcceleration.innerHTML = deets;

}

function handleOrientationEvent(event) {
    var a = event.alpha;
    var b = event.beta;
    var g = event.gamma;

    // Do something awesome.

    var deets = "Orientation a: " + a;
    deets += "<br>Orientation b: " + b;
    deets += "<br>Orientation g: " + g;

    theDetailElementOrientation.innerHTML = deets;
}

if (window.DeviceMotionEvent) {
    window.addEventListener("devicemotion", handleMotionEvent, true);
} else {
    theDetailElementAcceleration.innerHTML = "Sorry, Motion not supported on this device";
}

if (window.DeviceOrientationEvent) {
    window.addEventListener("deviceorientation", handleOrientationEvent, true);
} else {
    theDetailElementOrientation.innerHTML = "Sorry, Orientation not supported on this device";
}