Clearer Tooltip
This commit is contained in:
@@ -476,8 +476,13 @@ function initSpotMessages(aoMessages, aoTracks) {
|
|||||||
onEachFeature: function(feature, oLayer) {
|
onEachFeature: function(feature, oLayer) {
|
||||||
var asProperties = feature.properties;
|
var asProperties = feature.properties;
|
||||||
var $Tooltip = $('<div>', {'class':'track_tooltip'});
|
var $Tooltip = $('<div>', {'class':'track_tooltip'});
|
||||||
$('<p>', {'class':'name'}).addIcon('fa-track-'+asProperties.type, true).append(asProperties.name).appendTo($Tooltip);
|
$('<p>', {'class':'name', 'title':asProperties.name}).addIcon('fa-track-'+asProperties.type+' fa-fw', true).append(asProperties.name).appendTo($Tooltip);
|
||||||
if(asProperties.Name != asProperties.description) $('<p>', {'class':'description'}).text(asProperties.description).appendTo($Tooltip);
|
|
||||||
|
var $TooltipDetails = $('<div>', {'class':'details'});
|
||||||
|
if(asProperties.Name != asProperties.description && asProperties.description != '') {
|
||||||
|
$('<p>', {'class':'description', 'title':asProperties.description}).text(asProperties.description).appendTo($TooltipDetails);
|
||||||
|
}
|
||||||
|
$TooltipDetails.append($('<div>', {'class':'separator'}));
|
||||||
|
|
||||||
var aiCoords = feature.geometry.coordinates;
|
var aiCoords = feature.geometry.coordinates;
|
||||||
if(aiCoords && asProperties.type != 'hitchhiking') {
|
if(aiCoords && asProperties.type != 'hitchhiking') {
|
||||||
@@ -522,10 +527,12 @@ function initSpotMessages(aoMessages, aoTracks) {
|
|||||||
+((iTimeDays>0 || iTimeMinutes==0)?'':iTimeMinutes) //Minutes
|
+((iTimeDays>0 || iTimeMinutes==0)?'':iTimeMinutes) //Minutes
|
||||||
|
|
||||||
//Tooltip info
|
//Tooltip info
|
||||||
$('<p>', {'class':'detail'}).addIcon('fa-distance fa-fw', true).append(Math.round(iDistance/1000)+'km').appendTo($Tooltip);
|
$('<p>', {'class':'detail'}).addIcon('fa-distance fa-fw', true).append(Math.round(iDistance/1000)+'km').appendTo($TooltipDetails);
|
||||||
$('<p>', {'class':'detail'}).addIcon('fa-time fa-fw', true).append(sDuration).appendTo($Tooltip);
|
$('<p>', {'class':'detail'}).addIcon('fa-time fa-fw', true).append(sDuration).appendTo($TooltipDetails);
|
||||||
$('<p>', {'class':'detail'}).addIcon('fa-elev-gain fa-fw', true).append(iElevGain+'m').appendTo($Tooltip);
|
$('<p>', {'class':'detail'}).addIcon('fa-elev-gain fa-fw', true).append(iElevGain+'m').appendTo($TooltipDetails);
|
||||||
$('<p>', {'class':'detail'}).addIcon('fa-elev-drop fa-fw', true).append(iElevDrop+'m').appendTo($Tooltip);
|
$('<p>', {'class':'detail'}).addIcon('fa-elev-drop fa-fw', true).append(iElevDrop+'m').appendTo($TooltipDetails);
|
||||||
|
|
||||||
|
$TooltipDetails.appendTo($Tooltip);
|
||||||
|
|
||||||
//Trail Start/End
|
//Trail Start/End
|
||||||
self.tmp(['trail-markers', asProperties.name], {
|
self.tmp(['trail-markers', asProperties.name], {
|
||||||
|
|||||||
@@ -118,10 +118,27 @@ $legend-color: $post-color;
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
}
|
}
|
||||||
&.description {
|
}
|
||||||
|
|
||||||
|
.name, .description {
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.separator {
|
||||||
|
border-top: 1px solid #CCC;
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.details {
|
||||||
|
padding-left: calc(1.25em*1.2 + 0.5rem);
|
||||||
|
|
||||||
|
.description {
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
}
|
}
|
||||||
&.detail {
|
|
||||||
|
.detail {
|
||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user