Page Example

Compass Sample Overview

The Compass sample application demonstrates how you can create a simple application using the device orientation event.

The following figure illustrates the main screen of the Compass.

Figure: Compass screen

Compass screen

The application opens with the main screen that shows the current device orientation.

Source Files

You can create and view the sample application project including the source files in the IDE.

File name Description
config.xml This file contains the application information for the platform to install and launch the application, including the view mode and the icon to be used in the device menu.
css/ This directory contains the CSS styling for the application UI.
index.html This is a starting file from which the application starts loading. It contains the layout of the application screens.
images/ This directory contains the images used to create the user interface.
js/ This directory contains the application code.

Implementation

The startSensor function adds a listener to the deviceorientation event.

function startSensor() 
{
   window.addEventListener('deviceorientation', onDeviceOrientation, false);
}