New: Add option to show course-level progress on PLP nav button (fix #226)

[swashbuck]

Fixes #226

New

• Adds the _useCourseProgressInNavigationButton option to show course-level progress on the PLP nav button instead of page-level progress.

Testing

1. In course.json, set _pageLevelProgress._useCourseProgressInNavigationButton to true.
2. Go to a page and complete it, but leave other pages incomplete.

Expected result

The PLP button in the navigation should show as partially completed since only one page is complete.

[joe-replin]

I'm wondering (for the sake of a clean & streamlined AAT UI) if we could combine the following two configuration options:

"_isShownInNavigationBar": true,
"_showAtCourseLevelInNavigationBar": false

Once combined, it would be a dropdown choice of page, course or none. As you mentioned offline, backwards compatability becomes an issue but I'm assuming we would have a plan for this?

[oliverfoster]

I'm wondering (for the sake of a clean & streamlined AAT UI) if we could combine the following two configuration options:

"_isShownInNavigationBar": true,
"_showAtCourseLevelInNavigationBar": false

Once combined, it would be a dropdown choice of page, course or none. As you mentioned offline, backwards compatability becomes an issue but I'm assuming we would have a plan for this?

Please don't do this yet. Wait for migration scripts.

[oliverfoster]

_showAtCourseLevelInNavigationBar to _useCourseProgressInNavigationButton, to match the description?

[joe-allen-89]

Functionality wise works exactly as expected. Just one minor change, currently the aria label for the nav button still says page progress when it's showing course progress, think it should say course progress?

Also feels a bit odd that it could potentially show course progress in the button but only that page's items in the drawer, not sure if we want to just leave that as config options though.

[swashbuck]

@joe-allen-89 I believe all of this text should be configurable. For example, you can update the following in course.json to indicate course progress:

"_pageLevelProgress": {
  "pageLevelProgress": "List of page sections and completion status. Select incomplete sections to jump directly to the content.",
  "pageLevelProgressIndicatorBar": "Course progress. {{percentageComplete}}%. Open page sections.",
  "pageLevelProgressMenuBar": "Course completion {{percentageComplete}}%",
  "_navTooltip": {
      "text": "Course progress"
  },
  "navLabel": "Course progress"
},

We could make new string properties for when the course progress is shown on the nav bar, but that seems to overcomplicate things imo.

[joe-allen-89]

@swashbuck Yes, wasn't sure if we wanted to add something similar to MCQ instruction text to avoid config issues, happy to say it's overkill and I'm making it needlessly complicated though.

[swashbuck]

Also feels a bit odd that it could potentially show course progress in the button but only that page's items in the drawer, not sure if we want to just leave that as config options though.

@joe-allen-89 I could see a use case where the client wants course-level progress on the nav button but a more simplified PLP drawer that only shows the current page items. I do see your point, though, and I believe @joe-replin had also mentioned having a single option to show one or the other.

We already have _showAtCourseLevel to include the content objects in the PLP drawer. Not to complicate things necessarily, but we could add a new option to show just the title of the current page ("Presentation Components" in this screenshot).

[swashbuck]

@swashbuck Yes, wasn't sure if we wanted to add something similar to MCQ instruction text to avoid config issues, happy to say it's overkill and I'm making it needlessly complicated though.

@joe-allen-89 Do you mean like the ariaQuestion property for question components?

[joe-allen-89]

If you can see use cases of showing course in the button but page components in the drawer I think it's best to leave my queries as config options then rather than over complicating.

[cahirodoherty-learningpool]

👀

[github-actions]

🎉 This PR is included in version 7.8.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀