`<cascade>`

Sectional component that reveals its children step-by-step

<cascade> is a Sectional container that reveals its children one at a time as the learner makes progress. Each child is hidden until the preceding child has been completed — answered correctly (creditAchieved = 1), or having no creditAchieved at all (in which case it is treated as auto-completed the moment it becomes visible).

The numCompleted property tracks how many children have been completed so far. Use <cascadeMessage> inside a <cascade> to show a “continuation message” in place of a not-yet-revealed entry.

A <cascade> automatically turns on aggregateScores on every scored child (sections, <problem>, nested <cascade>s, even bare <p> paragraphs that contain answers). That is what gives each child a creditAchieved value the cascade can watch — without it, a paragraph or section containing an <answer> would not roll the answer’s credit up into its own, and the cascade would have no way to tell when the child is “done”. You therefore do not need to set aggregateScores by hand on cascade children.

Attributes and Properties

Attributes for `<cascade>`

Scoring (9)

aggregateScores

boolean. Default value: false. Whether to aggregate scores of scored descendants into a section credit-achieved value.

colorCorrectness

boolean. Default value: false. Whether to color-code answers in this section based on correctness.

displayDigitsForCreditAchieved

integer. Default value: 3. Number of significant digits to display for the section's credit achieved value.

forceIndividualAnswerColoring

boolean. Default value: false. Whether to force per-answer color-correctness even when section-wide check work is enabled.

sectionWideCheckWork

boolean. Default value: false. Whether to show a single section-wide check-work button instead of per-answer buttons.

showCorrectness

boolean. Default value: false. Whether to display correctness indicators for answers in this section.

submitLabel

text. Default value: Check Work. Label for the section-wide submit button when correctness is shown.

submitLabelNoCorrectness

text. Default value: Submit Response. Label for the section-wide submit button when correctness is not shown.

weight

number. Default value: 1. Relative weight of this section when aggregated by an enclosing scored section.

Other (15)

asList

boolean. Default value: false. Whether to render this section's children as a list.

boxAll

boolean. Default value: false. Whether to draw boxes around all cascade entries regardless of progress.

boxed

boolean. Default value: false. Whether to render this section with a visible box around it.

completedColor

text. Default value: var(--lightGreen). Color used to indicate this section has been completed.

hideFutureSections

boolean. Default value: false. Whether to hide later cascade sections until previous ones are completed.

includeAutoName

boolean. Default value: false. Whether to include the auto-generated section name (e.g. "Section") in the rendered title.

includeAutoNameIfNoTitle

boolean. Default value: true. Whether to include the auto-generated name when no explicit title is provided.

includeAutoNumber

boolean. Default value: false. Whether to include the auto-generated section number in the rendered title.

includeAutoNumberIfNoTitle

boolean. Default value: true. Whether to include the auto-generated number when no explicit title is provided.

inProgressColor

text. Default value: var(--mainGray). Color used to indicate this section is in progress.

level

integer. The heading level for this section (overrides the default level inferred from nesting).

noAutoTitle

boolean. Default value: true. Whether to suppress the auto-generated title entirely.

notStartedColor

text. Default value: var(--mainGray). Color used to indicate this section has not been started.

renameTo

text. Override the auto-generated section name (e.g. rename "Section" to a custom label).

revealAll

boolean. Default value: false. Whether all cascade entries should be revealed regardless of progress.

Common to all components (9)

copy

reference. Create an independent copy of another component by reference. Enter a references a $name.

disabled

boolean. Default value: false. Whether this component is disabled and cannot be interacted with.

extend

reference. Extend another component by reference, inheriting its children and attributes. Enter a reference as $name.

fixed

boolean. Default value: false. Whether this component's value is fixed and cannot be modified.

fixLocation

boolean. Default value: false. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

hide

boolean. Default value: false. Whether to hide this component from the rendered output.

isResponse

boolean. Default value: false. Whether this component is treated as a response for the purposes of assessment.

name

text. The name used to reference this component from elsewhere in the document.

styleNumber

integer. Default value: 1. The style number used to select this component's visual styling from the available style definitions.

Properties for `<cascade name="c">`

Scoring (6)

$c.aggregateScores

boolean. Whether scores of scored descendants are aggregated into this section's credit value.

$c.displayDigitsForCreditAchieved

integer. Number of significant digits to display for the section's credit achieved value.

$c.sectionWideCheckWork

boolean. Whether to show a single section-wide check-work button instead of per-answer buttons.

$c.submitLabel

text. Label for the section-wide submit button when correctness is shown.

$c.submitLabelNoCorrectness

text. Label for the section-wide submit button when correctness is not shown.

$c.weight

number. Relative weight of this section when aggregated by an enclosing scored section.

Other (18)

$c.asList

boolean. Whether to render this section's children as a list.

$c.boxed

boolean. Whether this section is rendered with a visible box around it.

$c.creditAchieved

number. Aggregate credit achieved (between 0 and 1) for scored descendants of this section.

$c.disabled

boolean. Whether this component is disabled and cannot be interacted with.

$c.fixed

boolean. Whether this component's value is fixed and cannot be modified.

$c.fixLocation

boolean. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

$c.hidden

boolean. Whether this component is hidden from the rendered output.

$c.hideFutureSections

boolean. Whether to hide later cascade sections until previous ones are completed.

$c.includeAutoName

boolean. Whether to include the auto-generated section name (e.g. "Section") in the rendered title.

$c.includeAutoNameIfNoTitle

boolean. Whether to include the auto-generated name when no explicit title is provided.

$c.includeAutoNumber

boolean. Whether to include the auto-generated section number in the rendered title.

$c.includeAutoNumberIfNoTitle

boolean. Whether to include the auto-generated number when no explicit title is provided.

$c.noAutoTitle

boolean. Whether to suppress the auto-generated title entirely.

$c.numCompleted

integer. The number of cascade sections currently completed.

$c.open

boolean. Whether this section is currently open (for collapsible sections).

$c.percentCreditAchieved

number. Aggregate credit achieved as a percentage (between 0 and 100).

$c.sectionNumber

text. The displayed number for this section.

$c.title

text. The displayed title text for this section.

Common to all components (4)

$c.doenetML

text. The DoenetML source code that produced this component.

$c.hide

boolean. Whether to hide this component from the rendered output.

$c.isResponse

boolean. Whether this component is treated as a response for the purposes of assessment.

$c.styleNumber

integer. The style number used to select this component's visual styling from the available style definitions.

Examples

Example: Step-by-step questions

Each <section> is revealed only after the previous one is answered correctly. The numCompleted property of the named <cascade> updates as the learner progresses.

Example: Nested cascade inside a section

The outer <cascade> reveals its three <section> children one at a time. The middle section contains an inner <cascade> whose children are bare <p> paragraphs. Because the outer cascade has turned on aggregateScores for the middle section, and that section’s inner cascade turns it on for each <p>, each paragraph rolls up the credit of its <answer> — so the inner cascade can hide the second paragraph until the first answer is correct, then reveal it.

Example: Cascade with continuation messages

Each <cascadeMessage> replaces the entry that would otherwise be hidden. When the preceding section is completed the message disappears and the next section appears.

Attribute Examples

Attribute Example: hideFutureSections

With hideFutureSections, later children are completely hidden (titles and all) until the preceding child is completed. Without it, the title of the next section still appears greyed-out so the learner can see what is coming.

Attribute Example: revealAll

Setting revealAll shows every child immediately, ignoring completion. This is useful when authoring (so you can see every step) or when you want the cascade structure without enforcing the order.

Attribute Example: boxAll

boxAll draws a box around every child regardless of progress, instead of boxing only the currently-active child.

Property Examples

Property Example: numCompleted

The numCompleted property counts how many children have been completed so far, in order. Once a child is skipped (e.g. its answer is wrong), counting stops at that point.

caption cascadeMessage

<cascade>