Questa applicazione e' un porting della precedente
Geocompass per Android per FirefoxOS
A parte il linguaggio differente, il codice condivide larghe parte di righe che sono state semplicemente copiate complice una sintassi uguale tra Java e Javascript
Il programma e' stato scritto con l'aiuto di Cordova/Phonegap.
Per istruzioni si puo' consultare
Wikipedia o
questa pagina
index.html
----------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<title>Geocompass</title>
<style>
#content {
width: 100px;
height:100px;
margin: 0px auto;
}
</style>
<script type="text/javascript" charset="utf-8" src="./js/cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="./js/misura.js"></script>
</head>
<body onload="drawCanvas();">
<div id="content">
<canvas id="myCanvas" width="256" height="256">Your browser doesn't support canvas tag</canvas>
</div>
<p id="ang" style="text-align:center;font-family:arial;color:red;font-size:30px;"></p>
<p style="text-align:center;font-family:arial;color:red;font-size:30px;">Strike/Dip</p><center>
<p><a style='text-align:center;font-family:arial;color:red;font-size:20px;' href='http://en.wikipedia.org/wiki/Strike_and_dip'>Help</a></p></center>
<p style="text-align:center;font-family:arial;color:red;font-size:15px;">Contact : lucainnoc@gmail.com</p></center>
</body>
</html>
----------------------------------------------------
misura.js
----------------------------------------------------
var surface;
var misura;
var angle = 0;
var ang_maxpendenza = 0;
function drawCanvas() {
screen.mozLockOrientation("portrait-primary");
surface = document.getElementById("myCanvas");
if (surface.getContext) {
misura = new Image();
misura.onload = loadingComplete;
misura.src = "./img/misura.png";
if (ang_maxpendenza < 10)
{
misura.src = "./img/orizzontale.png";
}
if (ang_maxpendenza > 80)
{
misura.src = "./img/verticale.png";
}
}
}
function loadingComplete(e) {
var surfaceContext = surface.getContext('2d');
surfaceContext.fillStyle = "rgb(255,255,255)";
surfaceContext.fillRect(0, 0, surface.width, surface.height);
surfaceContext.save();
surfaceContext.translate(misura.width * 0.5, misura.height * 0.5);
if ((ang_maxpendenza > 10) && (ang_maxpendenza < 80))
{
surfaceContext.rotate(angle* 0.0174532925199432957);
}
surfaceContext.translate(-misura.width * 0.5, -misura.height * 0.5);
surfaceContext.drawImage(misura, 0, 0);
surfaceContext.restore();
}
function converti2deg(angolo) {
return angolo*(180/Math.PI);
}
function converti2rad(angolo) {
return angolo*(Math.PI/180);
}
window.addEventListener('deviceorientation', function(event) {
var azimuth = event.alpha;
var pitch = event.beta;
var roll = event.gamma;
pitch = converti2rad(pitch);
roll = converti2rad(roll);
var cosalfa = Math.cos(roll-(Math.PI/2));
var cosbeta = Math.cos(pitch-(Math.PI/2));
var dir_maxpendenza = -converti2deg(Math.atan(cosalfa/cosbeta));
if ((pitch < 0) && (roll<=0)) dir_maxpendenza = dir_maxpendenza + 180;
if ((pitch <= 0) && (roll>0)) dir_maxpendenza = dir_maxpendenza + 180;
if ((pitch > 0) && (roll>0)) dir_maxpendenza = dir_maxpendenza + 360;
if ((pitch == 0) && (roll>0)) dir_maxpendenza = 270;
if ((pitch > 0) && (roll==0)) dir_maxpendenza = 0;
ang_maxpendenza = 90-converti2deg(Math.acos(Math.sqrt((cosalfa*cosalfa)+(cosbeta*cosbeta))));
var dir_maxpendenza_reale = (azimuth+dir_maxpendenza)%360;
document.getElementById("ang").innerHTML = dir_maxpendenza_reale.toFixed(0)+"/"+ang_maxpendenza.toFixed(0);
if (ang_maxpendenza < 10) document.getElementById("ang").innerHTML = "Horizontal";
if (ang_maxpendenza > 80) document.getElementById("ang").innerHTML = "Vertical " + azimuth.toFixed(0) + "-" + (azimuth.toFixed(0)+180)%360;
angle = dir_maxpendenza;
drawCanvas()
}, false);
----------------------------------------------------
manifest.webapp
----------------------------------------------------
{
"name": "Geocompass",
"description": "Compass for Geologists",
"launch_path":"/index.html",
"installs_allowed_from":["*"],
"version":"0.9.0","name":"Geocompass",
"orientation": "portrait-primary",
"icons": {
"256": "/img/icon-256.png",
"128": "/img/icon-128.png",
"120": "/img/icon-120.png",
"90": "/img/icon-90.png",
"60": "/img/icon-60.png",
"32": "/img/icon-32.png"
},
"developer": {
"name": "Luca Innocenti",
"url": "http://debiaonoldcomputers.blogspot.com/"
},
"default_locale": "en"
}
----------------------------------------------------
