Reusable Accessible Mapping PlatformStepItem Class
Creates a step in the choice tree. A step item can contain several bricks in it and can take different states. Each step can advance and retreat by either displaying its selected child or hiding it.
Imports RAMP Modules:
Util
TmplHelper
TmplUtil
Array
Dictionary
Bricks
Uses RAMP Templates:
templates/layer_selector_template.json
Constructor
StepItem
-
config -
[] -
[] -
[] -
[] -
[] -
[]
Parameters:
-
configObjecta config definition of the step item
-
[]String optionalcontent brick id
-
[]Brick optionaltype of the content brick
-
[]Object optionala brick config object that will be passed to Brick.new() init function
-
[]Array optionala set of callbacks set on the create Brick object
-
[]String optionala name of the Brick event the callback should react to
-
[]Function optionala function to be executed when the specified event is fired
Returns:
A built StepItem object.
Item Index
Methods
- _addContentBrick
- _doInternalCheck
- _getChildNodes
- _getCloseTimelines
- _getOpenTimelines
- _internalCheckHelper
- _makeCloseTimeline
- _makeOpenTimeline
- _makeShiftTimeline
- _notifyCurrentStepChange
- _notifyStateChange
- _toggleBrickNotices
- _wireBrickUp
- addChild
- advance
- currentStep
- displayBrickNotices
- getContentOuterHeight
- getContentPosition
- isCompleted
- isValid
- retreat
- setData
- setState
Properties
Methods
_addContentBrick
-
contentItem
Instantiates and adds a new brick to this step item.
_doInternalCheck
()
private
Checks this step item validity by checking validity of all its Bricks.
_getChildNodes
-
except
Returns an array of child step nodes except for steps whose ids are passed in except param.
Parameters:
-
exceptArrayan array of child step ids to not include in the result
Returns:
an array of child step nodes
_getCloseTimelines
-
tls -
skip -
reset
Generates a close timeline for this particular step item and adds it to the global close timeline. Calls the same on the target child.
Parameters:
Returns:
itself
_getOpenTimelines
-
tls -
targetChildStepId -
skip
Generates an open timeline for this particular step item and adds it to the global open timeline. Calls the same on the target child.
Parameters:
Returns:
itself
_internalCheckHelper
-
required -
targetBrick -
contentBricks
Checks Brick's requirements. Enables or disabled the target Brick based on validity of its requirements.
_makeCloseTimeline
-
skipFirst -
resetState
Creates timeline for retreat animation - when the part of the choice tree is collapsing, switching to another branch of the tree.
Parameters:
Returns:
a constructed close timeline
_makeOpenTimeline
-
targetChildStepId -
skipFirst
Creates timeline for advance animation - when the part of the choice tree is unfolding, (after switching to another branch of the tree).
Parameters:
Returns:
a constructed open timeline
_makeShiftTimeline
-
targetChildStepId
Creates timeline for shift animation - when the selected option for a choice is changing - animating horizontally.
Parameters:
-
targetChildStepIdStringspecifies the target childId
Returns:
a constructed shift timeline
_notifyCurrentStepChange
()
private
Emits a CURRENT_STEP_CHANGE event with a payload of id and level of the current step item.
This notifies the trunk of the tree and this step is now a current step. The trunk in turn notifies
every other step that they are not current steps.
_notifyStateChange
-
state
Emits a STATE_CHANGE event with a payload of id, level and state of the current step item.
Additionally sets state of all the content bricks to corresponding states.
Parameters:
-
stateStringstate to set the step item to
Returns:
itself
_toggleBrickNotices
-
bricks -
show
Toggles the visibility of notices for specified bricks.
Parameters:
Returns:
a promise that is resolved after animation is completed
_wireBrickUp
-
contentItem -
contentBrick
Wire up listeners on the given Brick.
-
brickIds
Clears this step by resetting its state to DEFAULT, clearing all content bricks, and hide all brick notices.
Parameters:
-
brickIdsArray[description]
Returns:
itself
addChild
-
stepItem
Adds a given step item object as a child for this step item.
Parameters:
-
stepItemStepItema stepItem object to be added as a child.
Returns:
itself
advance
-
targetChildStepId -
[targetChildData]
Advances the current step to the step with the provided id. The target id has to be a child step. Additionally, the tree expands down if the target child has an active child as well, and so on, until no active child is present.
Parameters:
Returns:
itself
currentStep
-
level -
stepId
Makes the step specified by the level and stepId a current step by setting a proper CSS class.
displayBrickNotices
-
[data]
Set Brick notices, mostly errors.
Parameters:
-
[data]Object optionala dictionary of objects containing Brick notices
getContentOuterHeight
()
Number
Get outer height of the content node
Returns:
outer height of the content node
getContentPosition
()
Object
Get position of the content node.
Returns:
jQuery position object of the content node
isCompleted
()
Boolean
Checks if the step is completed. It's considered completed if its state is SUCCESS.
Returns:
true if completed; false, otherwise
isValid
()
Boolean
Checks if the step is valid. It's considered valid if all its content bricks are valid.
Returns:
true if completed; false, otherwise
retreat
()
StepItem
chainable
Retreats the current step item by collapsing its active children and resetting their states to default. After, active child step is set to null.
Returns:
itself
Properties
_activeChildStep
Unknown
private
A step item of the currently active child of this step item. If there is no active child, it means that a choice or action hasn't been made on this step yet or it's the last step in the branch.
Default: null
_childSteps
Unknown
private
A collection of the child step items of this step item. Should not be accessed directly.
Default: {}
_contentNode
Unknown
private
Node of the content div.
Default: null
_optionsBackgroundNode
Unknown
private
Node of the options background node. It's used to change the state of the child steps - SUCCESS, ERROR, etc.
Default: null
_optionsContainerNode
Unknown
private
Node of the options container.
Default: null
_optionsNode
Unknown
private
Node of the options div.
Default: null
_parent
Unknown
private
A step item of the parent step item if any. Used only for animating background when opening/collapsing (error) notices.
Default: null
_state
Unknown
private
The current state of this step item.
Default: StepItem.state.DEFAULT,
_stepData
Unknown
private
An object containing some data. This is used like that: when the step is advanced, a data object is provided by external code; this object is then passed to whichever child is being advanced so it can be retrieved later without external code having to store it somewhere.
Default: null
_timeline
Unknown
private
A timeline of this step item. Used for animation
_transitionDuration
Unknown
private
A default duration value for all single transitions of any elements of this step.
Default: 0.4
content
Array
private
An array of Brick configs and other related properties.
Default: null
Example:
[{
id: "sourceType",
type: Bricks.ChoiceBrick,
config: {
header: i18n.t("addDataset.dataSource"),
instructions: i18n.t("addDataset.help.dataSource"),
choices: [
{
key: "serviceTypeStep",
value: i18n.t("addDataset.dataSourceService")
},
{
key: "fileTypeStep",
value: i18n.t("addDataset.dataSourceFile")
}
]
},
on: [
{
eventName: Bricks.ChoiceBrick.event.CHANGE,
//expose: { as: "advance" },
callback: choiceTreeCallbacks.simpleAdvance
}
]
}]event
Object
static
Event names published by the StepItem
Example:
{
CURRENT_STEP_CHANGE: "stepItem/currentStepChange",
STATE_CHANGE: "stepItem/stateChange"
}level
Number
Indicates the level of the step, or how far down the tree this step appears.
Default: 0
node
JObject
A node of the StepItem.
Default: null
state
Object
static
A collection of possible StepItem states and their names.
Example:
state: {
SUCCESS: "step-state-success",
ERROR: "step-state-error",
DEFAULT: "step-state-default",
LOADING: "step-state-loading"
}Events
StepItem.event.CURRENT_STEP_CHANGE
Published whenever a StepItem becomes a current step. A current step has a distinct visual style.