Skip to content

Instantly share code, notes, and snippets.

@zuk

zuk/compass.js

Last active August 29, 2015 13:56
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zuk/8890366 to your computer and use it in GitHub Desktop.
Save zuk/8890366 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
compass.js
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<title>Hello World</title>
</head>
<body>
<div class="app">
<h1 id="compass-reading">Apache Cordova</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript">
app.initialize();
$('.app').on('click', function () {
alert('Hello!');
});
function gotCompassReading(reading) {
$('#compass-reading').text(reading.magneticHeading);
$('.app').css('transform', 'rotate('+( -reading.magneticHeading )+'deg)');
}
function gotCompassError(err) {
alert(err);
}
$(document).on('deviceready', function () {
navigator.compass.watchHeading(gotCompassReading, gotCompassError);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment