Assessment Results Graphic is a presentation component similar in behaviour to the Graphic component. However, a different graphic can be displayed based on the following state of the associated assessment:
- incomplete
- failed
- passed
The _assessmentIncomplete
image is only needed if the Assessment Results Graphic can been seen by the learner prior to assessment completion (i.e. it hasn't been hidden either by the Trickle extension or by using _isVisibleBeforeCompletion: false
). Otherwise, it can safely be left out.
It is expected that most of the time this component will have _isOptional: true
. If it is not optional, it does support the same _setCompletionOn
settings as the Assessment Results component.
The attributes listed below are used in components.json to configure Assessment Results Graphic, and are properly formatted as JSON in example.json.
The core model attributes are inherited by every Adapt component. Read more
This must be set to: "assessmentResultsGraphic"
.
CSS class name(s) to be applied to this component's containing div
. The class must be predefined in one of the Less files. Separate multiple classes with a space.
This defines the horizontal position of the component in the block. Acceptable values are full
, left
or right
.
This value must match the _id
of the assessment for which the graphic should be displayed. If you only have one assessment, you can leave this blank (the article's _assessment._id
must also be blank).
The object that defines the images to use for each assessment state. It contains the following settings that apply to the _assessmentIncomplete
, _assessmentPassed
, and _assessmentFailed
objects.
File name (including path) of the image. Path should be relative to the src
folder (e.g. "course/en/images/assessment-pass.jpg"
).
The alternative text for this image. Assign alt text to images that convey course content only.
The graphic displayed uses an aria-label attribute. This uses the content from each graphic's alt
property. If alt
is not set, the graphic will be hidden.
You must specify both the failed and passed images. If you don't want to have a different graphic for each of those assessment states, you should probably just be using the standard Graphic component.
No known limitations.
Author / maintainer: CGKineo
Accessibility support: Yes
RTL support: Yes
Cross-platform coverage: Chrome, Chrome for Android, Firefox (ESR + latest version), Edge, Safari for macOS/iOS/iPadOS, Opera