Created
October 9, 2013 05:31
-
-
Save scottgwald/6896647 to your computer and use it in GitHub Desktop.
wearscript to draw sensor values in webview
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html style="width:100%; height:100%; overflow:hidden"> | |
| <head> | |
| </head> | |
| <body style="width:100%; height:100%; overflow:hidden; margin:0"> | |
| <h2> | |
| <span id="lat"></span>, | |
| <span id="lng"></span>, | |
| <span id="deg"></span> | |
| </h2> | |
| <h2> | |
| rotation Vector:  | |
| <span id="rot0"></span>, | |
| <span id="rot1"></span>, | |
| <span id="rot2"></span> | |
| </h2> | |
| <canvas id="canvas" width="427" height="240" style="display:block"> | |
| </canvas> | |
| <script> | |
| function cb(data) { | |
| if(data['type'] == 3){ | |
| degrees = data['values'][0]; | |
| rot0 = data['values'][0]; | |
| draw(); | |
| }else if(data['type'] == -1){ | |
| lat = data['values'][0]; | |
| lng = data['values'][1]; | |
| drawLocation(); | |
| } else if(data['type'] == 11) { | |
| rot0 = data['values'][0]; | |
| rot1 = data['values'][1]; | |
| rot2 = data['values'][2]; | |
| draw(); | |
| } | |
| } | |
| function server() { | |
| WS.sensorOn(3, interval); | |
| WS.sensorOn(11, interval); | |
| WS.sensorOn(-1, 10); | |
| WS.sensorCallback("cb"); | |
| WS.dataLog(false, true, interval); | |
| init(); | |
| } | |
| // Global variables | |
| var img = null, | |
| needle = null, | |
| ctx = null, | |
| degrees = 0, | |
| lat = 0, | |
| lng = 0, | |
| imgd = null, | |
| interval = 1, | |
| rot0 = 0; | |
| function clearCanvas() { | |
| // clear canvas | |
| ctx.clearRect(0, 0, 200, 200); | |
| } | |
| function drawLocation() { | |
| var lng_s = document.getElementById('lng'); | |
| var lat_s = document.getElementById('lat'); | |
| lng_s.innerHTML = lng; | |
| lat_s.innerHTML = lat; | |
| } | |
| function draw() { | |
| clearCanvas(); | |
| var deg_s = document.getElementById('deg'); | |
| var rot0_s = document.getElementById('rot0'); | |
| var rot1_s = document.getElementById('rot1'); | |
| var rot2_s = document.getElementById('rot2'); | |
| deg_s.innerHTML = degrees; | |
| rot0_s.innerHTML = rot0; | |
| rot1_s.innerHTML = rot1; | |
| rot2_s.innerHTML = rot2; | |
| } | |
| function init() { | |
| // Grab the compass element | |
| var canvas = document.getElementById('canvas'); | |
| degrees = 0; | |
| // Canvas supported? | |
| if (canvas.getContext('2d')) { | |
| ctx = canvas.getContext('2d'); | |
| } else { | |
| alert("Canvas not supported!"); | |
| } | |
| } | |
| $(function () { | |
| WS.serverConnect('{{WSUrl}}', 'server'); | |
| WS.displayWebView(); | |
| }); | |
| </script> | |
| </body> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment