From 65e3a8a453540d24ad2bad006339b4eb007c2bda Mon Sep 17 00:00:00 2001
From: Libby Baldwin <libby.baldwin@gmail.com>
Date: Mon, 19 Dec 2011 18:30:54 -0800
Subject: [PATCH] add compass demo for Android

---
 .../templates/project/assets/www/index.html   | 10 +++++++---
 .../templates/project/assets/www/main.js      | 19 +++++++++++++++++++
 2 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/bin/templates/project/phonegap/templates/project/assets/www/index.html b/bin/templates/project/phonegap/templates/project/assets/www/index.html
index a3bf1635..d89121be 100644
--- a/bin/templates/project/phonegap/templates/project/assets/www/index.html
+++ b/bin/templates/project/phonegap/templates/project/assets/www/index.html
@@ -4,7 +4,7 @@
     <meta name="viewport" content="width=320; user-scalable=no" />
     <meta http-equiv="Content-type" content="text/html; charset=utf-8">
     <title>PhoneGap</title>
-	  <link rel="stylesheet" href="master.css" type="text/css" media="screen" title="no title" charset="utf-8">
+	  <link rel="stylesheet" href="master.css" type="text/css" media="screen" title="no title">
 	  <script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"></script>
 	  <script type="text/javascript" charset="utf-8" src="main.js"></script>
 
@@ -29,8 +29,12 @@
     <a href="#" class="btn large" onclick="beep();">Beep</a>
     <a href="#" class="btn large" onclick="vibrate();">Vibrate</a>
     <a href="#" class="btn large" onclick="show_pic();">Get a Picture</a>
-    <a href="#" class="btn large" onclick="get_contacts();">Get Phone's Contacts</a>
-    <a href="#" class="btn large" onclick="check_network();">Check Network</a>
+    <a href="#" class="btn large" onclick="get_contacts();return false;">Get Phone's Contacts</a>
+    <a href="#" class="btn large" onclick="check_network();return false;">Check Network</a>
+    <dl>
+	<dt>Compass Heading:</dt><dd id="h">Off</dd>
+    </dl>
+    <a href="#" class="btn large" onclick="toggleCompass();return false;">Toggle Compass</a>
     <div id="viewport" class="viewport" style="display: none;">
       <img style="width:60px;height:60px" id="test_img" src="" />
     </div>
diff --git a/bin/templates/project/phonegap/templates/project/assets/www/main.js b/bin/templates/project/phonegap/templates/project/assets/www/main.js
index 1001aabc..f6316928 100644
--- a/bin/templates/project/phonegap/templates/project/assets/www/main.js
+++ b/bin/templates/project/phonegap/templates/project/assets/www/main.js
@@ -119,6 +119,25 @@ function check_network() {
     confirm('Connection type:\n ' + states[networkState]);
 }
 
+var watchID = null;
+
+function updateHeading(h) {
+    document.getElementById('h').innerHTML = h.magneticHeading;
+}
+
+function toggleCompass() {
+    if (watchID !== null) {
+        navigator.compass.clearWatch(watchID);
+        watchID = null;
+        updateHeading({ magneticHeading : "Off"});
+    } else {        
+        var options = { frequency: 1000 };
+        watchID = navigator.compass.watchHeading(updateHeading, function(e) {
+            alert('Compass Error: ' + e.code);
+        }, options);
+    }
+}
+
 function init() {
     // the next line makes it impossible to see Contacts on the HTC Evo since it
     // doesn't have a scroll button