diff --git a/src/public/index.html b/src/public/index.html index df29df7..5b124f3 100644 --- a/src/public/index.html +++ b/src/public/index.html @@ -876,7 +876,7 @@

Temperature

- {{ Number(selectedNode.temperature).toFixed(0) }}ºC + {{ formatTemperature(selectedNode.temperature) }} ???

@@ -1466,6 +1466,16 @@ + +
+ +
Metrics will be shown in the selected format.
+ +
+
@@ -1575,6 +1585,14 @@ return localStorage.setItem("config_enable_map_animations", value); } + function getConfigTemperatureFormat() { + return localStorage.getItem("config_temperature_format") || "celsius"; + } + + function setConfigTemperatureFormat(format) { + return localStorage.setItem("config_temperature_format", format); + } + function getConfigMapSelectedTileLayer() { return localStorage.getItem("config_map_selected_tile_layer") || "OpenStreetMap"; } @@ -1677,6 +1695,7 @@ configZoomLevelGoToNode: window.getConfigZoomLevelGoToNode(), configAutoUpdatePositionInUrl: window.getConfigAutoUpdatePositionInUrl(), configEnableMapAnimations: window.getConfigEnableMapAnimations(), + configTemperatureFormat: window.getConfigTemperatureFormat(), isShowingHardwareModels: false, hardwareModelStats: null, @@ -2101,7 +2120,7 @@ datasets: [{ label: 'Temperature', data: environmentMetrics.map((environmentMetric) => { - return environmentMetric.temperature; + return this.convertTemperature(environmentMetric.temperature); }), borderColor: '#22c55e', backgroundColor: '#e5e7eb', @@ -2117,7 +2136,7 @@ y: { display: false, // Hide y-axis labels min: -25, - max: 100, + max: 200, }, }, plugins: { @@ -2129,7 +2148,7 @@ intersect: false, displayColors: false, callbacks: { - label: (item) => item.formattedValue + "ºC", + label: (item) => item.formattedValue + this.getTemperatureUnit(), }, }, }, @@ -2461,6 +2480,36 @@ var daysPlural = days === 1 ? 'day' : 'days'; return `${days} ${daysPlural} ${hours}h ${minutes}m ${seconds}s`; }, + formatTemperature: function(celsius) { + switch(this.configTemperatureFormat){ + case "celsius": { + return `${Number(celsius).toFixed(0)}ºC`; + } + case "fahrenheit": { + const fahrenheit = this.celsiusToFahrenheit(celsius); + return `${fahrenheit.toFixed(0)}ºF`; + } + } + }, + convertTemperature: function(celsius) { + switch(this.configTemperatureFormat){ + case "celsius": { + return celsius; + } + case "fahrenheit": { + return this.celsiusToFahrenheit(celsius); + } + } + }, + getTemperatureUnit: function() { + switch(this.configTemperatureFormat){ + case "celsius": return "ºC"; + case "fahrenheit": return "ºF"; + } + }, + celsiusToFahrenheit: function(celsius) { + return (celsius * 9/5) + 32; + }, }, computed: { searchedNodes() { @@ -2511,6 +2560,9 @@ configEnableMapAnimations() { window.setConfigEnableMapAnimations(this.configEnableMapAnimations); }, + configTemperatureFormat() { + window.setConfigTemperatureFormat(this.configTemperatureFormat); + }, }, }).mount('#app');