[distance-to-portal] also show bearing

This commit is contained in:
fkloft
2015-02-21 14:02:01 +01:00
parent 227d1b18ac
commit 9c534c8898
3 changed files with 86 additions and 10 deletions

View File

@ -0,0 +1,28 @@
#portal-distance {
text-align: center;
}
#portal-distance-bearing {
display: inline-block;
vertical-align: top;
position: relative;
height: 1em;
width: 1em;
}
#portal-distance-bearing:before, #portal-distance-bearing:after {
border-color: transparent currentcolor transparent transparent;
border-style: solid;
border-width: 0.75em 0.4em 0 0;
content: "";
height: 0;
width: 0;
position: absolute;
top: 0.15em;
left: 0.15em;
transform: skewY(-30deg);
}
#portal-distance-bearing:after {
left: auto;
right: 0.15em;
transform: scaleX(-1) skewY(-30deg);
}

View File

@ -22,8 +22,6 @@
// use own namespace for plugin
window.plugin.distanceToPortal = function() {};
window.plugin.distanceToPortal.addDistance = function(info) {
var ll = info.portal.getLatLng();
@ -41,12 +39,22 @@ window.plugin.distanceToPortal.addDistance = function(info) {
dist = Math.round(dist)+'m';
}
text = 'Distance: '+dist;
var bearing = window.plugin.distanceToPortal.currentLoc.bearingTo(ll);
var bearingWord = window.plugin.distanceToPortal.currentLoc.bearingWordTo(ll);
text = 'Distance: '+dist+' <span id="portal-distance-bearing" style="transform: rotate('+bearing+'deg)"></span> '
+ zeroPad(bearing, 3) + '° ' + bearingWord;
} else {
text = 'Location not set';
}
var div = $('<div>').addClass('portal-distance').text(text).attr('title','Double-click to set/change current location').on('dblclick',window.plugin.distanceToPortal.setLocation);
var div = $('<div>')
.attr({
id: 'portal-distance',
title: 'Double-click to set/change current location',
})
.html(text)
.on('dblclick', window.plugin.distanceToPortal.setLocation);
$('#resodetails').after(div);
@ -91,6 +99,8 @@ window.plugin.distanceToPortal.setLocation = function() {
window.plugin.distanceToPortal.setup = function() {
// https://github.com/gregallensworth/Leaflet/
@@INCLUDERAW:external/LatLng_Bearings.js@@
try {
window.plugin.distanceToPortal.currentLoc = L.latLng(JSON.parse(localStorage['plugin-distance-to-portal']));
@ -100,12 +110,7 @@ window.plugin.distanceToPortal.setup = function() {
window.plugin.distanceToPortal.currentLocMarker = null;
$('head').append(
'<style>'+
'div.portal-distance { text-align: center; }'+
'</style>'
);
$('<style>').prop('type', 'text/css').html('@@INCLUDESTRING:plugins/distance-to-portal.css@@').appendTo('head');
addHook('portalDetailsUpdated', window.plugin.distanceToPortal.addDistance);
};