From 908d7942388be2205d71a547564539af8d669659 Mon Sep 17 00:00:00 2001 From: James Wilson Date: Mon, 30 Jan 2017 11:58:29 -0600 Subject: [PATCH] Change altitude based on units. Increase width of altitude legend and use an SVG --- public_html/images/alt_legend_feet.svg | 1 + public_html/images/alt_legend_meters.svg | 1 + public_html/images/altitude_legend.png | Bin 1405 -> 0 bytes public_html/images/altitude_legend@2x.png | Bin 2637 -> 0 bytes public_html/images/altitude_legend@3x.png | Bin 3688 -> 0 bytes public_html/index.html | 2 +- public_html/script.js | 12 ++++++++++++ public_html/style.css | 21 ++++++++++++++------- 8 files changed, 29 insertions(+), 8 deletions(-) create mode 100644 public_html/images/alt_legend_feet.svg create mode 100644 public_html/images/alt_legend_meters.svg delete mode 100644 public_html/images/altitude_legend.png delete mode 100644 public_html/images/altitude_legend@2x.png delete mode 100644 public_html/images/altitude_legend@3x.png diff --git a/public_html/images/alt_legend_feet.svg b/public_html/images/alt_legend_feet.svg new file mode 100644 index 0000000..1bf22ad --- /dev/null +++ b/public_html/images/alt_legend_feet.svg @@ -0,0 +1 @@ +alt_legend_feet \ No newline at end of file diff --git a/public_html/images/alt_legend_meters.svg b/public_html/images/alt_legend_meters.svg new file mode 100644 index 0000000..b383d48 --- /dev/null +++ b/public_html/images/alt_legend_meters.svg @@ -0,0 +1 @@ +alt_legend_meters \ No newline at end of file diff --git a/public_html/images/altitude_legend.png b/public_html/images/altitude_legend.png deleted file mode 100644 index 2562dad1b74f1c1df1e9357f11175cd6993a24a2..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1405 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 Tsh8Zz0~>VT@?NR&lmGk|LKR&2 diff --git a/public_html/images/altitude_legend@3x.png b/public_html/images/altitude_legend@3x.png deleted file mode 100644 index 5f6d1926c05afb19a3b4c95e66ab7306c5d7e3c0..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 3688 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 -
+
diff --git a/public_html/script.js b/public_html/script.js index 0dd8a53..524adf6 100644 --- a/public_html/script.js +++ b/public_html/script.js @@ -1417,6 +1417,8 @@ function initializeUnitsSelector() { var displayUnits = localStorage['displayUnits']; DisplayUnits = displayUnits; + setAltitudeLegend(displayUnits); + // Initialize drop-down var unitsSelector = $("#units_selector"); unitsSelector.val(displayUnits); @@ -1429,6 +1431,8 @@ function onDisplayUnitsChanged(e) { localStorage['displayUnits'] = displayUnits; DisplayUnits = displayUnits; + setAltitudeLegend(displayUnits); + // Update filters updatePlaneFilter(); @@ -1450,6 +1454,14 @@ function onDisplayUnitsChanged(e) { }); } +function setAltitudeLegend(units) { + if (units === 'metric') { + $('#altitude_chart_button').addClass('altitudeMeters'); + } else { + $('#altitude_chart_button').removeClass('altitudeMeters'); + } +} + function onFilterByAltitude(e) { e.preventDefault(); updatePlaneFilter(); diff --git a/public_html/style.css b/public_html/style.css index 3b2eb15..2c4a8f8 100644 --- a/public_html/style.css +++ b/public_html/style.css @@ -609,18 +609,25 @@ select.error, textarea.error, input.error { #altitude_chart { float: right; - width: 502px; - height: 18px; - right: 40px; - bottom: 10px; + width: calc(100% - 5px); + max-width: 800px; + right: 5px; + bottom: 35px; background-color: transparent !important; } #altitude_chart_button { - background-image: url('images/altitude_legend.png'); + background-image: url('images/alt_legend_feet.svg'); + background-size: cover; background-color: transparent; - width: 502px; - height: 18px; + width: 100%; + height: 0; + padding: 0; + padding-bottom: calc(100% * 18 / 502); +} + +.altitudeMeters { + background-image: url('images/alt_legend_meters.svg') !important; } /* Retina 2x images */