Many small updates, added gyronym logic
Before Width: | Height: | Size: 9.1 KiB After Width: | Height: | Size: 9.1 KiB |
Before Width: | Height: | Size: 7.6 KiB After Width: | Height: | Size: 7.6 KiB |
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 3.6 KiB |
Before Width: | Height: | Size: 4.9 KiB After Width: | Height: | Size: 4.9 KiB |
Before Width: | Height: | Size: 5.4 KiB After Width: | Height: | Size: 5.4 KiB |
Before Width: | Height: | Size: 8.4 KiB After Width: | Height: | Size: 8.4 KiB |
Before Width: | Height: | Size: 693 B After Width: | Height: | Size: 693 B |
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 19 KiB |
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
Before Width: | Height: | Size: 6.2 KiB After Width: | Height: | Size: 6.2 KiB |
Before Width: | Height: | Size: 34 KiB After Width: | Height: | Size: 34 KiB |
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
Before Width: | Height: | Size: 64 KiB After Width: | Height: | Size: 64 KiB |
Before Width: | Height: | Size: 125 KiB After Width: | Height: | Size: 125 KiB |
Before Width: | Height: | Size: 8.4 KiB After Width: | Height: | Size: 8.4 KiB |
|
@ -69,6 +69,7 @@
|
||||||
<div id='by'>by <a href="https://keithirwin.us/">Keith Irwin</a></div>
|
<div id='by'>by <a href="https://keithirwin.us/">Keith Irwin</a></div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
|
<script src="gyronorm.complete.min.js"></script>
|
||||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
|
||||||
<script src="script.js"></script>
|
<script src="script.js"></script>
|
||||||
|
|
||||||
|
|
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 50 KiB |
|
@ -1,5 +1,5 @@
|
||||||
'use strict';
|
'use strict';
|
||||||
/* global navigator $ */
|
/* global navigator $ GyroNorm */
|
||||||
|
|
||||||
// Set units based on browser locale
|
// Set units based on browser locale
|
||||||
const metric = !(window.navigator.language=='en-US'||window.navigator.language=='my');
|
const metric = !(window.navigator.language=='en-US'||window.navigator.language=='my');
|
||||||
|
@ -39,23 +39,29 @@ else { navigator.geolocation.watchPosition(
|
||||||
}
|
}
|
||||||
|
|
||||||
// Set compass orientation
|
// Set compass orientation
|
||||||
function setRose(e) {
|
var gn = new GyroNorm()
|
||||||
|
|
||||||
|
gn.init().then(function(){
|
||||||
|
gn.start(function(data){
|
||||||
|
|
||||||
// No orientation data
|
// No orientation data
|
||||||
if(!e.absolute) {
|
if (!data.do.absolute) {
|
||||||
$('#rotated').hide();
|
$('#rotated').hide();
|
||||||
$('#no-dir').show();
|
$('#no-dir').show();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Set orientation
|
// Set orientation
|
||||||
else {
|
else {
|
||||||
var rot = 'rotate('+e.alpha.toString().substring(0,5)+'deg)';
|
const rot = 'rotate('+data.do.alpha.toString().substring(0,5)+'deg)';
|
||||||
$('#rose').css({
|
$('#rose').css({
|
||||||
'-ms-transform': rot,
|
'-ms-transform': rot,
|
||||||
'-webkit-transform': rot,
|
'-webkit-transform': rot,
|
||||||
'transform': rot
|
'transform': rot
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
}
|
|
||||||
window.addEventListener("deviceorientation", setRose, true);
|
window.addEventListener("deviceorientation", setRose, true);
|