`<callAction>`

Triggers an action when clicked or in response to a specified user interaction

<callAction> is a General Operator component that triggers an action based on a click interaction or a specified boolean condition. The available actions are:

addChildren: Adds one or more children to the target component.
deleteChildren: Deletes one or more children from the target component.
submitAnswer: Submits the target answer component.
resample: Resamples the target component.
startAnimation: Starts the animation of the target component.
stopAnimation: Stops the animation of the target component.
toggleAnimation: Toggles the animation of the target component.
playVideo: Plays the target video component.
pauseVideo: Pauses the target video component.
navigateToTarget: Navigates to a specified target, such as a reference link.
copyDoenetMLToClipboard: Copies the DoenetML of the target component to the clipboard.

Attributes and Properties

Attributes for `<callAction>`

Labels (1)

labelIsName

boolean. Default value: false. Whether to use this component's name as its rendered label.

Positioning (2)

anchor

point. Default value: $\left( 0, 0 \right)$. Coordinates of the anchor point used to position this component on a graph.

positionFromAnchor

keyword. Where this component sits relative to its anchor point.

Value	Description
`upperRight`	Place the component above and to the right of the anchor point.
`upperLeft`	Place the component above and to the left of the anchor point.
`lowerRight`	Place the component below and to the right of the anchor point.
`lowerLeft`	Place the component below and to the left of the anchor point.
`top`	Place the component directly above the anchor point.
`bottom`	Place the component directly below the anchor point.
`left`	Place the component directly to the left of the anchor point.
`right`	Place the component directly to the right of the anchor point.
`center` (default)	Center the component on the anchor point.

Triggering (4)

triggerWhen

boolean. Default value: false. Boolean expression that fires the action whenever it transitions to true.

triggerWhenObjectsClicked

reference. References to components whose click events should fire this action.

triggerWhenObjectsFocused

reference. References to components whose focus events should fire this action.

triggerWith

reference. References to components whose value changes should fire this action.

Other (5)

actionName

text. Name of the action to invoke on the target component.

draggable

boolean. Default value: true. Whether the action button can be dragged on a graph.

number

number. Numeric argument passed to the invoked action.

numbers

numberList. Numeric arguments passed to the invoked action.

target

reference. Reference to the component whose action will be invoked.

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 `<callAction name="c">`

Labels (2)

$c.label

label. The label rendered with this component.

$c.labelIsName

boolean. Whether to use this component's name as its rendered label.

Positioning (2)

$c.anchor

point. The coordinates where this component is anchored on the graph.

$c.positionFromAnchor

text. Where this component sits relative to its anchor point.

Other (6)

$c.actionName

text. Name of the action to invoke on the target component.

$c.disabled

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

$c.draggable

boolean. Whether the action button can be dragged on a graph.

$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.

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: Add a `<point>` child to a `<graph>`

Each time the <callAction> button is clicked, a new <point> child is added to the graph at $(2,3)$ .

Example: Delete a `<point>` child from a `<graph>`

Each time the second <callAction> button is clicked, a <point> child that was added previously is deleted from the <graph>.

Example: Perform multiple actions with one click

Multiple <callActions> can be performed with the action of one button click when grouped together inside a <triggerSet> component.

Example: Generate new random numbers

Each time the <callAction> button is clicked, the <sampleRandomNumbers/> component is resampled.

Attribute Examples

Attribute Example: labelIsName

Using the labelIsName attribute is a shortcut to adding a separate <label> child to the <callAction> component.

Attribute Example: anchor

The anchor attribute specifies the position of the <callAction> button when the <callAction> is used inside a <graph>.

Attribute Example: actionName

The actionName attribute specifies the action to be performed by the <callAction> component.

Attribute Example: actionName=“resample”

The resample specification for the actionName acts on the <sampleRandomNumbers> component to generate a new set of random numbers.

Attribute Example: actionName=“addChildren”

The addChildren specification for the actionName attribute creates one or more children of the target component.

Attribute Example: actionName=“deleteChildren”

The deleteChildren specification for the actionName attribute deletes one or more children of the target component that have been added to the <graph> with a <callAction>.

Attribute Example: actionName=“submitAnswer”

The submitAnswer specification for the actionName attribute triggers automatic submission of the target <answer> when the condition for the <callAction> is satisfied.

Attribute Example: actionName=“startAnimation”

The startAnimation specification for the actionName attribute acts on a target <animateFromSequence/> component.

Attribute Example: actionName=“stopAnimation”

The stopAnimation specification for the actionName attribute acts on a target <animateFromSequence/> component.

Attribute Example: actionName=“toggleAnimation”

The toggleAnimation specification for the actionName attribute acts on a target <animateFromSequence/> component.

Attribute Example: actionName=“playVideo”

The playVideo specification for the actionName attribute acts on a target <video/> component.

Attribute Example: actionName=“pauseVideo”

The pauseVideo specification for the actionName attribute acts on a target <video/> component.

Attribute Example: actionName=“navigateToTarget”

The navigateToTarget specification for the actionName attribute acts on a target <ref/> component. The user is automatically taken to the referenced link when the condition for the <callAction> becomes true.

Attribute Example: actionName=“copyDoenetMLToClipboard”

The copyDoenetMLToClipboard specification for the actionName attribute acts on a target sectional component.

Attribute Example: triggerWhen

The triggerWhen attribute takes a boolean condition that triggers the action to occur when the condition is true.

Note that this process is repeated each time the boolean is newly true. To observe this behavior, drag the point back and forth into the negative $x$ region several times. Also, move the blue <point> child each time so that you can clearly see the new <point> child that appears.

Attribute Example: triggerWith

The triggerWith attribute references a named <callAction>, <updateValue>, <triggerSet>, <booleanInput>, or an <answer>.

When the user perfoms any interaction with the referenced component (including submitting an incorrect answer or unchecking a checkbox), the <callAction> is performed.

Attribute Example: triggerWhenObjectsClicked

The triggerWhenObjectsClicked attribute takes a component reference as input. Any graphical component that can be clicked can serve as a trigger.

c caption

<callAction>