From f7644804df7f51b76962c3a7929ffab94c4fd64a Mon Sep 17 00:00:00 2001
From: Oliver Foster <oliver.foster@kineo.com>
Date: Wed, 12 Jun 2024 08:37:41 +0100
Subject: [PATCH] Added correctness arialabels and _canShowMarking support

---
 js/PageLevelProgressIndicatorView.js | 12 +++++++-----
 templates/pageLevelProgressItem.jsx  | 10 ++++++++++
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/js/PageLevelProgressIndicatorView.js b/js/PageLevelProgressIndicatorView.js
index 28481a6..efc0a3d 100644
--- a/js/PageLevelProgressIndicatorView.js
+++ b/js/PageLevelProgressIndicatorView.js
@@ -78,14 +78,16 @@ class PageLevelProgressIndicatorView extends Backbone.View {
   checkCompletion() {
     const percentage = this.setPercentageComplete();
     const isComplete = (percentage === 100);
-    const isCorrect = this.model.get('_isCorrect');
-    const isPartlyCorrect = this.model.get('_isAtLeastOneCorrectSelection');
+    const canShowMarking = Boolean(this.model.get('_canShowMarking'));
+    const isCorrect = (canShowMarking && isComplete && this.model.get('_isCorrect') === true);
+    const isPartlyCorrect = (canShowMarking && isComplete && this.model.get('_isCorrect') === false && this.model.get('_isAtLeastOneCorrectSelection'));
+    const isIncorrect = (canShowMarking && isComplete && this.model.get('_isCorrect') === false && !this.model.get('_isAtLeastOneCorrectSelection'));
     this.$el
       .toggleClass('is-complete', isComplete)
       .toggleClass('is-incomplete', !isComplete)
-      .toggleClass('is-correct', isComplete && isCorrect === true)
-      .toggleClass('is-partially-correct', isComplete && isCorrect === false && isPartlyCorrect)
-      .toggleClass('is-incorrect', isComplete && isCorrect === false && !isPartlyCorrect);
+      .toggleClass('is-correct', isCorrect)
+      .toggleClass('is-partially-correct', isPartlyCorrect)
+      .toggleClass('is-incorrect', isIncorrect);
   }
 
 }
diff --git a/templates/pageLevelProgressItem.jsx b/templates/pageLevelProgressItem.jsx
index cb16f2e..a611c7a 100644
--- a/templates/pageLevelProgressItem.jsx
+++ b/templates/pageLevelProgressItem.jsx
@@ -13,6 +13,9 @@ export default function PageLevelProgressItem(props) {
     _isLocked,
     _isVisible,
     _isComplete,
+    _isCorrect,
+    _isAtLeastOneCorrectSelection,
+    _canShowMarking,
     title,
     altTitle,
     _id,
@@ -20,6 +23,10 @@ export default function PageLevelProgressItem(props) {
     _children
   } = props;
 
+  const isCorrect = (_canShowMarking && _isComplete && _isCorrect === true);
+  const isPartlyCorrect = (_canShowMarking && _isComplete && _isCorrect === false && _isAtLeastOneCorrectSelection);
+  const isIncorrect = (_canShowMarking && _isComplete && _isCorrect === false && !_isAtLeastOneCorrectSelection);
+
   const indicatorSeat = React.createRef();
   useEffect(() => {
     if (_isOptional) return;
@@ -57,6 +64,9 @@ export default function PageLevelProgressItem(props) {
           _isOptional && `${_globals._extensions._pageLevelProgress.optionalContent}.`,
           !_isOptional && _isComplete && `${_globals._accessibility._ariaLabels.complete}.`,
           !_isOptional && !_isComplete && `${_globals._accessibility._ariaLabels.incomplete}.`,
+          isCorrect && `${_globals._accessibility._ariaLabels.answeredCorrectly}.`,
+          isPartlyCorrect && `${_globals._accessibility._ariaLabels.answeredPartlyCorrect ?? _globals._accessibility._ariaLabels.answeredIncorrectly}.`,
+          isIncorrect && `${_globals._accessibility._ariaLabels.answeredIncorrectly}.`,
           compile(a11y.normalize(altTitle || title))
         ])}
       >