From ac403599196a1bcab5397368a8bb39724cb0db42 Mon Sep 17 00:00:00 2001 From: Warner Harper Date: Wed, 4 Mar 2026 12:46:14 -0500 Subject: [PATCH 1/4] Small accessbility fix for piecharts --- client/src/components/body/Reading/Reading.js | 4 ++++ client/src/components/exercise/lab14/pages/RSAEncryption.js | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/client/src/components/body/Reading/Reading.js b/client/src/components/body/Reading/Reading.js index 1cec2257e..c23335ba4 100644 --- a/client/src/components/body/Reading/Reading.js +++ b/client/src/components/body/Reading/Reading.js @@ -225,6 +225,7 @@ const Reading = (props) => { } } setReadingData(data[0].reading); + console.log(data[0].reading); }); if (isImagine) { @@ -360,6 +361,9 @@ const Reading = (props) => { data={readingData?.piechart.data} options={largeViewPortOptions} height={!isImagine && PIE_SIZE} + aria-label={ + "Pie chart describing " + readingData.piechart.header + } /> {readingData?.piechart?.caption !== "" && diff --git a/client/src/components/exercise/lab14/pages/RSAEncryption.js b/client/src/components/exercise/lab14/pages/RSAEncryption.js index 62d4b8115..1fedf8b79 100644 --- a/client/src/components/exercise/lab14/pages/RSAEncryption.js +++ b/client/src/components/exercise/lab14/pages/RSAEncryption.js @@ -121,7 +121,7 @@ const RSAEncryption = () => { } catch (err) { // On some older systems, the 'crypto' library doesn't have full compatibility. // Instead of *actually* doing RSA, we fake it and just shuffle some numbers. - + let publicKey = "69d8e47ce6873023aa78cfe7d7e0f93f5276fc3f704872b072a49e5c5c5a8480545bc614ff2ddcb8cf157b2500bb2695f2beaa1df4a55d25c985a7a6c6d48603c34cf67b717a31832d141ab485b78935fc6231d231cc987680ba8855a5d4505363323882c256abec86839466ef45194837f09e3c07f675b4b792524eba1b14cef21ffa2fad22d158851419167cc6ff4b166951c7645ff1bcf96f4c281f76a05fcb57c3eb9b8e93b13e87d04edebe6fed"; let n = From 9c43b840155f15c42ee55d63fa2a8a137b3b41b6 Mon Sep 17 00:00:00 2001 From: Warner Harper Date: Wed, 4 Mar 2026 12:52:16 -0500 Subject: [PATCH 2/4] wording changed --- client/src/components/body/Reading/Reading.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/components/body/Reading/Reading.js b/client/src/components/body/Reading/Reading.js index c23335ba4..af0b8ce10 100644 --- a/client/src/components/body/Reading/Reading.js +++ b/client/src/components/body/Reading/Reading.js @@ -362,7 +362,7 @@ const Reading = (props) => { options={largeViewPortOptions} height={!isImagine && PIE_SIZE} aria-label={ - "Pie chart describing " + readingData.piechart.header + "Pie chart titled " + readingData.piechart.header } /> From fc88d886715af4089b95a6fd6ef62363f3703244 Mon Sep 17 00:00:00 2001 From: Warner Harper Date: Tue, 31 Mar 2026 13:18:31 -0400 Subject: [PATCH 3/4] Imporved aria-label --- client/src/components/body/Reading/Reading.js | 23 +++++++++++++++---- 1 file changed, 19 insertions(+), 4 deletions(-) diff --git a/client/src/components/body/Reading/Reading.js b/client/src/components/body/Reading/Reading.js index af0b8ce10..9281ffcad 100644 --- a/client/src/components/body/Reading/Reading.js +++ b/client/src/components/body/Reading/Reading.js @@ -35,6 +35,7 @@ const Reading = (props) => { ); const [originalPieLabels, setOriginalPieLabels] = useState([]); const [mobileLabelWrap, setMobileLabelWrap] = useState(false); + const [accessiblePieLabel, setAccessiblePieLabel] = useState(""); let [scrollPositionPercentage, setScrollPositionPercentage] = useState(0); let [seconds, setSeconds] = useState(0); let [pagePosition, setPagePosition] = useState([]); @@ -195,6 +196,18 @@ const Reading = (props) => { return labelsForReturn; } + const createAccessiblePieLabel = (pieLabels, pieDataSet, pieTitle) => { + let formattedLabel = "Pie chart titled '" + pieTitle + "' with data: "; + for (let index = 0; index < pieLabels.length; index++) { + if (index != pieLabels.length - 1) { + formattedLabel += pieLabels[index] + ": " + pieDataSet[index] + ", "; + } else { + formattedLabel += pieLabels[index] + ": " + pieDataSet[index] + "."; + } + } + setAccessiblePieLabel(formattedLabel); + }; + useEffect(() => { const windowResizeEvent = () => { if (window.innerWidth > PIE_WINDOW_RESIZE_WIDTH) { @@ -224,8 +237,12 @@ const Reading = (props) => { ); } } + createAccessiblePieLabel( + data[0].reading.piechart.data.labels, + data[0].reading.piechart.data.datasets[0].data, + data[0].reading.piechart.header, + ); setReadingData(data[0].reading); - console.log(data[0].reading); }); if (isImagine) { @@ -361,9 +378,7 @@ const Reading = (props) => { data={readingData?.piechart.data} options={largeViewPortOptions} height={!isImagine && PIE_SIZE} - aria-label={ - "Pie chart titled " + readingData.piechart.header - } + aria-label={accessiblePieLabel} /> {readingData?.piechart?.caption !== "" && From 880739a3414b1a919a62ffb279656be2c62a1a9d Mon Sep 17 00:00:00 2001 From: Warner Harper Date: Thu, 2 Apr 2026 12:10:23 -0400 Subject: [PATCH 4/4] added role to piechart --- client/src/components/body/Reading/Reading.js | 1 + 1 file changed, 1 insertion(+) diff --git a/client/src/components/body/Reading/Reading.js b/client/src/components/body/Reading/Reading.js index 9281ffcad..1b4dee804 100644 --- a/client/src/components/body/Reading/Reading.js +++ b/client/src/components/body/Reading/Reading.js @@ -379,6 +379,7 @@ const Reading = (props) => { options={largeViewPortOptions} height={!isImagine && PIE_SIZE} aria-label={accessiblePieLabel} + role="img" /> {readingData?.piechart?.caption !== "" &&