mirror of
https://github.com/Roslund/sthlm-mesh.git
synced 2026-08-07 01:13:09 +02:00
deploy: 590d274d2d
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -0,0 +1,140 @@
|
||||
async function transitionStatusGauge() {
|
||||
try {
|
||||
await fetchNodes();
|
||||
createTransitionGauge();
|
||||
} catch (err) {
|
||||
console.error('Error creating transition status gauge:', err);
|
||||
showTransitionGaugeError();
|
||||
}
|
||||
}
|
||||
|
||||
async function createTransitionGauge() {
|
||||
const canvas = document.getElementById('transitionGauge');
|
||||
if (!canvas) {
|
||||
console.warn('Canvas transitionGauge not found');
|
||||
return;
|
||||
}
|
||||
|
||||
const ctx = canvas.getContext('2d');
|
||||
|
||||
// Show loading
|
||||
ctx.font = '16px Arial';
|
||||
ctx.fillStyle = 'gray';
|
||||
ctx.textAlign = 'center';
|
||||
ctx.fillText('Loading...', canvas.width/2, canvas.height/2);
|
||||
|
||||
// Filter nodes heard today (last 24 hours)
|
||||
const now = new Date();
|
||||
const twentyFourHoursAgo = new Date(now.getTime() - 24 * 60 * 60 * 1000);
|
||||
|
||||
const nodesHeardToday = nodes.filter(node =>
|
||||
node.updated_at &&
|
||||
new Date(node.updated_at) >= twentyFourHoursAgo
|
||||
);
|
||||
|
||||
if (nodesHeardToday.length === 0) {
|
||||
showNoDataMessage(ctx, canvas, 'No nodes heard today');
|
||||
return;
|
||||
}
|
||||
|
||||
// Count nodes with MediumFast channel_id
|
||||
const mediumFastNodes = nodesHeardToday.filter(node =>
|
||||
node.channel_id === 'MediumFast'
|
||||
);
|
||||
|
||||
const totalNodes = nodesHeardToday.length;
|
||||
const mediumFastCount = mediumFastNodes.length;
|
||||
const transitionPercentage = totalNodes > 0 ? (mediumFastCount / totalNodes) * 100 : 0;
|
||||
|
||||
// Create gauge chart using doughnut chart
|
||||
const data = [mediumFastCount, totalNodes - mediumFastCount];
|
||||
const maxValue = totalNodes;
|
||||
|
||||
new Chart(ctx, {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: data,
|
||||
backgroundColor: [
|
||||
getTransitionColor(transitionPercentage),
|
||||
'rgba(220, 220, 220, 0.3)'
|
||||
],
|
||||
borderWidth: 0,
|
||||
cutout: '70%'
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
rotation: -90, // Start from top
|
||||
circumference: 180, // Half circle
|
||||
plugins: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
tooltip: {
|
||||
enabled: false
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [{
|
||||
afterDraw: function(chart) {
|
||||
// Add center text showing the counts and percentage
|
||||
const centerX = chart.width / 2;
|
||||
const centerY = chart.height / 2 + 20; // Adjust for half circle
|
||||
|
||||
ctx.save();
|
||||
ctx.font = 'bold 24px Arial';
|
||||
ctx.fillStyle = '#333';
|
||||
ctx.textAlign = 'center';
|
||||
ctx.fillText(`${mediumFastCount}/${totalNodes}`, centerX, centerY);
|
||||
|
||||
ctx.font = 'bold 18px Arial';
|
||||
ctx.fillStyle = getTransitionColor(transitionPercentage);
|
||||
ctx.fillText(`${transitionPercentage.toFixed(1)}%`, centerX, centerY + 25);
|
||||
|
||||
ctx.font = '12px Arial';
|
||||
ctx.fillStyle = '#666';
|
||||
ctx.fillText('Använder MediumFast', centerX, centerY + 45);
|
||||
ctx.restore();
|
||||
}
|
||||
}]
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function getTransitionColor(percentage) {
|
||||
if (percentage >= 75) {
|
||||
return 'rgba(1, 163, 23, 0.8)'; // Green - excellent progress
|
||||
} else if (percentage >= 50) {
|
||||
return 'rgba(234, 184, 57, 0.8)'; // Yellow - good progress
|
||||
} else if (percentage >= 25) {
|
||||
return 'rgba(255, 140, 0, 0.8)'; // Orange - some progress
|
||||
} else {
|
||||
return 'rgba(255, 69, 0, 0.8)'; // Red - limited progress
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function showTransitionGaugeError() {
|
||||
const canvas = document.getElementById('transitionGauge');
|
||||
if (!canvas) return;
|
||||
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
ctx.font = '16px Arial';
|
||||
ctx.fillStyle = 'red';
|
||||
ctx.textAlign = 'center';
|
||||
ctx.fillText('Error loading data', canvas.width/2, canvas.height/2);
|
||||
}
|
||||
|
||||
function showNoDataMessage(ctx, canvas, message) {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
ctx.font = '16px Arial';
|
||||
ctx.fillStyle = 'gray';
|
||||
ctx.textAlign = 'center';
|
||||
ctx.fillText(message, canvas.width/2, canvas.height/2);
|
||||
}
|
||||
|
||||
// Initialize the transition gauge when the page loads
|
||||
transitionStatusGauge();
|
||||
+1
-1
@@ -1 +1 @@
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml"><url><loc>https://sthlm-mesh.se/docs/settings/</loc><lastmod>2025-09-21T21:23:50+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/device_role/</loc><lastmod>2025-02-26T18:42:15+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/position/</loc><lastmod>2025-02-22T09:11:26+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meetup-1-oktober-sundbyberg/</loc><lastmod>2025-09-21T21:20:34+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/%C3%B6verg%C3%A5ng-till-mediumfast-den-27-september/</loc><lastmod>2025-09-20T10:37:42+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meshtastic-p%C3%A5-sec-t/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meetup-19-augusti-telefonplan/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meetup-8-april-sundbyberg/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2024/meetup-4-september-sundbyberg/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2024/meetup-15-maj-urban-deli/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/</loc><lastmod>2025-08-24T19:47:51+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/mqtt/</loc><lastmod>2025-03-31T19:16:34+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/meetups/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/neighbor_info/</loc><lastmod>2025-02-23T20:48:06+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/past-meetups/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/kartor/</loc><lastmod>2025-03-08T20:11:28+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/hardware/</loc><lastmod>2025-04-21T12:00:04+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/solar_nodes/</loc><lastmod>2025-04-21T01:54:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/communities/</loc><lastmod>2025-02-23T20:48:06+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/categories/</loc></url><url><loc>https://sthlm-mesh.se/docs/</loc><lastmod>2025-03-03T22:48:04+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/messages/</loc><lastmod>2025-07-13T10:01:31+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/about/</loc><lastmod>2025-02-23T18:02:23+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/status/</loc><lastmod>2025-09-20T10:52:39+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/</loc><lastmod>2025-09-21T21:23:50+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/tags/</loc></url></urlset>
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml"><url><loc>https://sthlm-mesh.se/docs/settings/</loc><lastmod>2025-09-21T21:23:50+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/device_role/</loc><lastmod>2025-02-26T18:42:15+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/position/</loc><lastmod>2025-02-22T09:11:26+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meetup-1-oktober-sundbyberg/</loc><lastmod>2025-09-21T21:20:34+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/%C3%B6verg%C3%A5ng-till-mediumfast-den-27-september/</loc><lastmod>2025-09-21T22:33:53+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meshtastic-p%C3%A5-sec-t/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meetup-19-augusti-telefonplan/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2025/meetup-8-april-sundbyberg/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2024/meetup-4-september-sundbyberg/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/2024/meetup-15-maj-urban-deli/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/</loc><lastmod>2025-08-24T19:47:51+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/mqtt/</loc><lastmod>2025-03-31T19:16:34+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/meetups/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/neighbor_info/</loc><lastmod>2025-02-23T20:48:06+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/blog/past-meetups/</loc><lastmod>2025-09-21T20:27:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/kartor/</loc><lastmod>2025-03-08T20:11:28+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/hardware/</loc><lastmod>2025-04-21T12:00:04+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/solar_nodes/</loc><lastmod>2025-04-21T01:54:22+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/docs/communities/</loc><lastmod>2025-02-23T20:48:06+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/categories/</loc></url><url><loc>https://sthlm-mesh.se/docs/</loc><lastmod>2025-03-03T22:48:04+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/messages/</loc><lastmod>2025-07-13T10:01:31+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/about/</loc><lastmod>2025-02-23T18:02:23+01:00</lastmod></url><url><loc>https://sthlm-mesh.se/status/</loc><lastmod>2025-09-20T10:52:39+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/</loc><lastmod>2025-09-21T21:23:50+02:00</lastmod></url><url><loc>https://sthlm-mesh.se/tags/</loc></url></urlset>
|
||||
Reference in New Issue
Block a user