darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-07-15 19:01:04 -04:00
Code Issues Packages Projects Releases Wiki Activity

Experimenting with chart.js

Browse Source
This commit is contained in:
Jonathan Bobel
2024-05-14 15:45:33 -04:00
parent b9d41dad86
commit f517180581
7 changed files with 1094 additions and 648 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
app/assets/javascripts/dataVisualization.js
View File

@@ -4,8 +4,8 @@
const data = {
messageStats: {
totalMessages: 1000,
delivered: 800,
pending: 100,
delivered: 820,
pending: 80,
failed: 100
},
dailyUsage: {
@@ -31,9 +31,9 @@
// Update total messages progress bar percentages
const dailyUsage = data.dailyUsage;
const dailyUsageLimit = dailyUsage.dailyUsageLimit;
// const dailyUsageLimit = dailyUsage.dailyUsageLimit;
const yearlyUsage = data.yearlyUsage;
const yearlyUsageLimit = yearlyUsage.yearlyUsageLimit;
// const yearlyUsageLimit = yearlyUsage.yearlyUsageLimit;
function updateUsageBar(elementId, dailyUsage, dailyUsageLimit, yearlyUsage, yearlyUsageLimit) {
// Ensure element exists
@@ -51,10 +51,10 @@
}
// Update usage bars
updateUsageBar("dailyUsage-bar", dailyUsage.dailyUsage, dailyUsageLimit);
updateUsageBar("dailyUsageRemaining-bar", dailyUsageLimit - dailyUsage.dailyUsage, dailyUsageLimit);
updateUsageBar("yearlyUsage-bar", yearlyUsage.yearlyUsage, yearlyUsageLimit);
updateUsageBar("yearlyUsageRemaining-bar", yearlyUsageLimit - yearlyUsage.yearlyUsage, yearlyUsageLimit);
// updateUsageBar("dailyUsage-bar", dailyUsage.dailyUsage, dailyUsageLimit);
// updateUsageBar("dailyUsageRemaining-bar", dailyUsageLimit - dailyUsage.dailyUsage, dailyUsageLimit);
// updateUsageBar("yearlyUsage-bar", yearlyUsage.yearlyUsage, yearlyUsageLimit);
// updateUsageBar("yearlyUsageRemaining-bar", yearlyUsageLimit - yearlyUsage.yearlyUsage, yearlyUsageLimit);
// Update total messages legend values
document.getElementById("total-value").innerText = `Total: ${messageStats.totalMessages} messages`;
@@ -63,9 +63,9 @@
document.getElementById("failed-value").innerText = `Failed: ${messageStats.failed}`;
// Update usage legend values
document.getElementById("daily-usage-value").innerText = `Daily usage: ${dailyUsage.dailyUsage}`;
document.getElementById("daily-remaining-value").innerText = `Remaining messages: ${dailyUsage.dailyUsageLimit - dailyUsage.dailyUsage}`;
document.getElementById("yearly-usage-value").innerText = `Yearly usage: ${yearlyUsage.yearlyUsage}`;
document.getElementById("yearly-remaining-value").innerText = `Remaining messages: ${yearlyUsage.yearlyUsageLimit - yearlyUsage.yearlyUsage}`;
// document.getElementById("daily-usage-value").innerText = `Daily usage: ${dailyUsage.dailyUsage}`;
// document.getElementById("daily-remaining-value").innerText = `Remaining messages: ${dailyUsage.dailyUsageLimit - dailyUsage.dailyUsage}`;
// document.getElementById("yearly-usage-value").innerText = `Yearly usage: ${yearlyUsage.yearlyUsage}`;
// document.getElementById("yearly-remaining-value").innerText = `Remaining messages: ${yearlyUsage.yearlyUsageLimit - yearlyUsage.yearlyUsage}`;
})(window);