From 20959fd287937868362c3879c4b20e8ab2f11a20 Mon Sep 17 00:00:00 2001
From: Norbert Renner <norbert.renner@gmx.de>
Date: Sat, 27 Jan 2018 11:13:30 +0100
Subject: [PATCH] Refactor duplicate abbr definitions; add kWh abbr

---
 index.html               | 10 +++++-----
 js/control/TrackStats.js | 12 ++++++------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/index.html b/index.html
index cc790e9..96eda76 100644
--- a/index.html
+++ b/index.html
@@ -203,23 +203,23 @@
             <ul id="stats">
                 <li>
                     <div class="text-muted small hidden-sm-down">Distance</div>
-                    <p class="stats-label" id="distance">0 <abbr title="kilometer">km</abbr></p>
+                    <p class="stats-label"><span id="distance">0</span> <abbr title="kilometer">km</abbr></p>
                 </li>
                 <li hidden>
                     <div class="text-muted small hidden-sm-down">Travel time</div>
-                    <p class="stats-label" id="totaltime">0 <abbr title="minutes">min</abbr></p>
+                    <p class="stats-label"><span id="totaltime">0</span> <abbr title="minutes">min</abbr></p>
                 </li>
                 <li hidden>
                     <div class="text-muted small hidden-sm-down">Total Energy (per 100km)</div>
-                    <p class="stats-label" id="totalenergy">0 (0)</p>
+                    <p class="stats-label"><span id="totalenergy">0 (0)</span> <abbr title="kilowatt hour">kWh</abbr></p>
                 </li>
                 <li>
                     <div class="text-muted small hidden-sm-down">Ascend (Plain ascend)</div>
-                    <p class="stats-label" id="ascend">0 (0) <abbr title="meter">m</abbr></p>
+                    <p class="stats-label"><span id="ascend">0 (0)</span> <abbr title="meter">m</abbr></p>
                 </li>
                 <li>
                     <div class="text-muted small hidden-sm-down">Cost (Mean cost factor)</div>
-                    <p class="stats-label" id="cost">- (-)</p>
+                    <p class="stats-label"><span id="cost">- (-)</span></p>
                 </li>
             </ul>
             <button id="sidebar-btn" class="btn btn-secondary btn-sm" type="button" aria-label="Toggle sidebar">
diff --git a/js/control/TrackStats.js b/js/control/TrackStats.js
index f6abc9d..0af8fa0 100644
--- a/js/control/TrackStats.js
+++ b/js/control/TrackStats.js
@@ -8,14 +8,14 @@ BR.TrackStats = L.Class.extend({
             formattedEnergy = L.Util.formatNum(stats.totalEnergy / 3600000., 2),
             meanEnergy = stats.trackLength ? L.Util.formatNum(stats.totalEnergy / 36. / stats.trackLength, 2) : '';
 
-        $('#distance').html(length1 + ' <abbr title="kilometer">km</abbr>');
-        $('#ascend').html(stats.filteredAscend + ' (' + stats.plainAscend +')' + ' <abbr title="meter">m</abbr>');
+        $('#distance').html(length1);
+        $('#ascend').html(stats.filteredAscend + ' (' + stats.plainAscend +')');
         $('#cost').html(stats.cost + ' (' + meanCostFactor + ')');
-        $('#totaltime').html(formattedTime + ' <abbr title="minutes">min</abbr>');
-        $('#totalenergy').html(formattedEnergy + ' (' + meanEnergy +') kWh');
+        $('#totaltime').html(formattedTime);
+        $('#totalenergy').html(formattedEnergy + ' (' + meanEnergy +')');
 
-        document.getElementById('totaltime').parentElement.hidden = !stats.totalTime;
-        document.getElementById('totalenergy').parentElement.hidden = !stats.totalEnergy;
+        document.getElementById('totaltime').parentElement.parentElement.hidden = !stats.totalTime;
+        document.getElementById('totalenergy').parentElement.parentElement.hidden = !stats.totalEnergy;
     },
 
     calcStats: function(polyline, segments) {