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
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);
}