Phonegap - accelerometer app.
Hej jeg er helt ny med at lave apps - har med dreamweaver cs6 lavet nogle app der er mere eller mindre bare er hjemmesider i en app. nu vil jeg gerne prøve at bruge nogle af de muligheder der er i phonegap API og bruge telefonens hardware. til at starte med vil jeg "bare" gerne lave en app som kan vise og gemme data fra accelerometeret i en fil... men da jeg allerede ikke virker med accelerometeret, er det det jeg vil spørge jer om i måske kan fortælle mig havd jeg gør galt i denne kode som bare skal vise data fra accelerometeret.her er min kode (tyv stjålet fra nogle hvor jeg ka se det virker...)
---------------------------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>kayak</title>
<link href="jquery-mobile/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>
<script src="cordova.js"></script>
<link rel="stylesheet" type="text/css" href="main.css">
<link href="jQueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.button.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.autocomplete.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.menu.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="cordova.js"></script>
<script src="jQueryAssets/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery-ui-1.9.2.button.custom.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery-ui-1.9.2.autocomplete.custom.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
var deviceReady = false;
function roundNumber(num) {
var dec = 3;
var result = Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
return result;
}
//-------------------------------------------------------------------------
// Acceleration
//-------------------------------------------------------------------------
var watchAccelId = null;
/**
* Start watching acceleration
*/
var watchAccel = function() {
console.log("watchAccel()");
// Success callback
var success = function(a){
document.getElementById('x').innerHTML = roundNumber(a.x);
document.getElementById('y').innerHTML = roundNumber(a.y);
document.getElementById('z').innerHTML = roundNumber(a.z);
console.log("watchAccel success callback");
};
// Fail callback
var fail = function(e){
console.log("watchAccel fail callback with error code "+e);
stopAccel();
setAccelStatus(Accelerometer.ERROR_MSG[e]);
};
// Update acceleration every 1 sec
var opt = {};
opt.frequency = 1000;
watchAccelId = navigator.accelerometer.watchAcceleration(success, fail, opt);
setAccelStatus("Running");
};
/**
* Stop watching the acceleration
*/
var stopAccel = function() {
console.log("stopAccel()");
setAccelStatus("Stopped");
if (watchAccelId) {
navigator.accelerometer.clearWatch(watchAccelId);
watchAccelId = null;
}
};
/**
* Get current acceleration
*/
var getAccel = function() {
console.log("getAccel()");
// Stop accel if running
stopAccel();
// Success callback
var success = function(a){
document.getElementById('x').innerHTML = roundNumber(a.x);
document.getElementById('y').innerHTML = roundNumber(a.y);
document.getElementById('z').innerHTML = roundNumber(a.z);
};
// Fail callback
var fail = function(e){
console.log("getAccel fail callback with error code "+e);
setAccelStatus(Accelerometer.ERROR_MSG[e]);
};
// Make call
var opt = {};
navigator.accelerometer.getCurrentAcceleration(success, fail, opt);
};
/**
* Set accelerometer status
*/
var setAccelStatus = function(status) {
document.getElementById('accel_status').innerHTML = status;
};
/**
* Function called when page has finished loading.
*/
function init() {
console.log("accelerometer.init()");
document.addEventListener("deviceready", function() {
deviceReady = true;
console.log("Device="+device.platform+" "+device.version);
}, false);
window.setTimeout(function() {
if (!deviceReady) {
alert("Error: Apache Cordova did not initialize. Demo will not run correctly.");
}
},1000);
}
</script>
</head>
<body>
<div data-role="page" id="page">
<div data-role="header">
<h1>Kayak any</h1>
</div>
<div data-role="content">
<ul data-role="listview">
<li><a href="#page2">sc</a></li>
<li><a href="#page3">Page Three</a></li>
<li><a href="#page4">Page Four</a></li>
</ul>
</div>
<div data-role="footer">
<h4>By Troels Lund</h4>
</div>
</div>
<div id="page2" data-role="page" data-theme="a">
<div data-role="header">
<h1>Page Two</h1>
</div>
<div data-role="content">
</div>
<h1>Acceleration</h1>
<div id="info">
<div id="accel_status">Stopped</div>
<div ><table width="100%">
<tr><td width="20%">X:</td><td id="x"> </td></tr>
<tr><td width="20%">Y:</td><td id="y"> </td></tr>
<tr><td width="20%">Z:</td><td id="z"> </td></tr>
</table></div>
</div>
<h2>Action</h2>
<button onclick="getAccel();" id="Button1">Get Acceleration</button>
<button onclick="watchAccel();" id="Button2">Start Watch</button>
<div class="btn large" onclick="getAccel();">Get Acceleration</div>
<div class="btn large" onclick="watchAccel();">Start Watch</div>
<div class="btn large" onclick="stopAccel();">Clear Watch</div>
<h2> </h2><div class="backBtn ui-btn ui-btn-up-a" onclick="backHome();">Back</div>
</div>
<div data-role="footer">
<h4>Page Footer</h4>
</div>
</div>
<script type="text/javascript">
$(function() {
$( "#Button1" ).button();
});
-----------------------------------
nogle der kan give et godt bud på hvad jeg gør galt siden at koden, som skulle virke, ikke gør det hos mig?
