Bugfix: Correct dynamic adjustment of x axis labels on device graph

client_src/js/DeviceReadingDisplay.mjs

@@ -12,6 +12,7 @@ import Chart from '../../node_modules/chart.js/dist/Chart.bundle.min.js';
 import GetFromUrl from './Helpers/GetFromUrl.mjs';
 import GetContainingElement from './Helpers/GetContainingElement.mjs';
 import Postify from './Helpers/Postify.mjs';
+import { human_duration_unit } from './Helpers/DateHelper.mjs';
 
 
 class DeviceReadingDisplay {
@@ -238,7 +239,7 @@ class DeviceReadingDisplay {
 						type: "time",
 						time: {
 							format: "YYYY-MM-DD HH:mm",
-							tooltipFormat: 'll HH:mm'
+							tooltipFormat: 'll HH:mm',
 						},
 						scaleLabel: {
 							display: true,
@@ -354,7 +355,8 @@ class DeviceReadingDisplay {
 		
 		// Update the x axis labels
 		// this.chart.data.labels = new_data_obj.data.map((point) => point.t);
-		
+		this.chart.options.scales.xAxes[0].time.unit = human_duration_unit(this.end_time.diff(this.start_time));
+		console.log(`New unit: ${this.chart.options.scales.xAxes[0].time.unit}`);
 		// Update the chart
 		this.chart.update();
 		

client_src/js/Helpers/DateHelper.mjs

@@ -0,0 +1,13 @@
+"use strict";
+
+function human_duration_unit(milliseconds) {
+	let seconds = Math.floor(milliseconds / 1000);
+	if(seconds <= 60) return "second";
+	if(seconds <= 60*60) return "minute";
+	if(seconds <= 60*60*24) return "hour";
+	if(seconds <= 60*60*24*45) return "day";
+	if(seconds <= 60*60*24*365) return "month";
+	return "year";
+}
+
+export { human_duration_unit };