Yahoo! UI Library

gallery-accordion  1.12

Yahoo! UI Library > gallery-accordion > AccordionItem
Search:
 
Filters

Class AccordionItem - extends Widget

Create an AccordionItem widget.

Properties

Accordion.ATTRS - static Object

Static property used to define the default attribute configuration for the Accordion.

HTML_PARSER - protected static Object

Static Object hash used to capture existing markup for progressive enhancement. Keys correspond to config attribute names and values are selectors used to inspect the srcNode for an existing node structure.

NAME - static String

Static property provides a string to identify the class.

WidgetStdMod.TEMPLATES - Object

The template HTML strings for each of header components. e.g.
{
icon : '<a class="yui3-accordion-item-icon"></a>',
label: '<a href="#" class="yui3-accordion-item-label"></a>',
iconsContainer: '<div class="yui3-accordion-item-icons"></div>',
iconAlwaysVisible: '<a href="#" class="yui3-accordion-item-iconalwaysvisible"></a>',
iconExpanded: '<a href="#" class="yui3-accordion-item-iconexpanded"></a>',
iconClose: '<a href="#" class="yui3-accordion-item-iconclose yui3-accordion-item-iconclose-hidden"></a>'
}

Methods

_addHeaderComponents

protected void _addHeaderComponents ( )
Add label and icons in the header. Also, it creates header in if not set from markup

_applyParser

protected void _applyParser ( config )
Overwrites Widget's _applyParser method in order to parse yuiConfig attribute before entering in HTML_PARSER attributes
Parameters:
config <Object> User configuration object (will be populated with values from Node)

_closableChanged

protected void _closableChanged ( params )
Handles the change of "closableChanged" property. Hides or shows close icon
Parameters:
params <EventFacade> The event facade for the attribute change

_createHeader

protected void _createHeader ( )
Creates the header content

_extractFixedMethodValue

protected Number _extractFixedMethodValue ( value )
Parses and returns the value of contentHeight property, if set method "fixed". The value must be in this format: fixed-X, where X is integer
Parameters:
value <String> The value to be parsed
Returns: Number
The parsed value or null

_findStdModSection

protected Node _findStdModSection ( section )
Overwrites Y.WidgetStdMod fuction in order to resolve Widget 3.1 issue:
If CONTENT_TEMPLATE is null, in renderUI the result of the following code: this.getStdModNode( Y.WidgetStdMod.HEADER ); is null. The same is with this.getStdModNode( Y.WidgetStdMod.BODY );.
Parameters:
section <String> The section for which the render Node is to be found. Either WidgetStdMod.HEADER, WidgetStdMod.BODY or WidgetStdMod.FOOTER.
Returns: Node
The rendered node for the given section, or null if not found.

_labelChanged

protected void _labelChanged ( params )
Handles the change of "labelChanged" property. Updates item's UI with the label provided
Parameters:
params <EventFacade> The event facade for the attribute change

_onLinkClick

protected void _onLinkClick ( e )
Prevent default action on clicking the link in the label
Parameters:
e <Event> The click event

_setIcon

protected Node _setIcon ( value )
Setter applied to the input when updating the icon attribute. Input can be a Node, raw HTMLElement, or a selector string to locate it.
Parameters:
value <Node|HTMLElement|String> The icon element Node or selector
Returns: Node
The Node if found, null otherwise.

_setIconAlwaysVisible

protected Node _setIconAlwaysVisible ( value )
Setter applied to the input when updating the iconAlwaysVisible attribute. Input can be a Node, raw HTMLElement, or a selector string to locate it.
Parameters:
value <Node|HTMLElement|String> The iconAlwaysVisible element Node or selector
Returns: Node
The Node if found, null otherwise.

_setIconClose

protected Node _setIconClose ( value )
Setter applied to the input when updating the iconClose attribute. Input can be a Node, raw HTMLElement, or a selector string to locate it.
Parameters:
value <Node|HTMLElement|String> The iconClose element Node or selector
Returns: Node
The Node if found, null otherwise.

_setIconExpanded

protected Node _setIconExpanded ( value )
Setter applied to the input when updating the iconExpanded attribute. Input can be a Node, raw HTMLElement, or a selector string to locate it.
Parameters:
value <Node|HTMLElement|String> The iconExpanded element Node or selector
Returns: Node
The Node if found, null otherwise.

_setIconsContainer

protected Node _setIconsContainer ( value )
Setter applied to the input when updating the iconsContainer attribute. Input can be a Node, raw HTMLElement, or a selector string to locate it.
Parameters:
value <Node|HTMLElement|String> The iconsContainer element Node or selector
Returns: Node
The Node if found, null otherwise.

_setNodeLabel

protected Node _setNodeLabel ( value )
Setter applied to the input when updating the nodeLabel attribute. Input can be a Node, raw HTMLElement, or a selector string to locate it.
Parameters:
value <Node|HTMLElement|String> The nodeLabel element Node or selector
Returns: Node
The Node if found, null otherwise.

_validateIcon

protected Boolean _validateIcon ( value )
Validator applied to the icon attribute. Setting new value is not allowed if Accordion has been rendered.
Parameters:
value <MIXED> the value for the icon attribute

_validateIconAlwaysVisible

protected Boolean _validateIconAlwaysVisible ( value )
Validator applied to the iconAlwaysVisible attribute. Setting new value is not allowed if Accordion has been rendered.
Parameters:
value <MIXED> the value for the iconAlwaysVisible attribute

_validateIconClose

protected Boolean _validateIconClose ( value )
Validator applied to the iconClose attribute. Setting new value is not allowed if Accordion has been rendered.
Parameters:
value <MIXED> the value for the iconClose attribute

_validateIconExpanded

protected Boolean _validateIconExpanded ( value )
Validator applied to the iconExpanded attribute. Setting new value is not allowed if Accordion has been rendered.
Parameters:
value <MIXED> the value for the iconExpanded attribute

_validateIconsContainer

protected Boolean _validateIconsContainer ( value )
Validator applied to the iconsContainer attribute. Setting new value is not allowed if Accordion has been rendered.
Parameters:
value <MIXED> the value for the iconsContainer attribute

_validateNodeLabel

protected Boolean _validateNodeLabel ( value )
Validator applied to the nodeLabel attribute. Setting new value is not allowed if Accordion has been rendered.
Parameters:
value <MIXED> the value for the nodeLabel attribute

bindUI

protected void bindUI ( )
Configures/Sets up listeners to bind Widget State to UI/DOM

destructor

protected void destructor ( )
Destructor lifecycle implementation for the AccordionItem class.

initializer

protected void initializer ( config )
Initializer lifecycle implementation for the AccordionItem class.
Parameters:
config <Object> Configuration object literal for the AccordionItem

markAsAlwaysVisible

Boolean markAsAlwaysVisible ( alwaysVisible )
Marks the item as always visible by adding class to always visible icon. The icon will be updated only if needed.
Parameters:
alwaysVisible <Boolean> If true, the item should be marked as always visible.
Returns: Boolean
Return true if the icon has been updated, false if there was no need to update

markAsCollapsing

Boolean markAsCollapsing ( collapsing )
Marks the item as collapsing by adding class to expand icon. The method will update icon only if needed.
Parameters:
collapsing <Boolean> Boolean indicating that the item should be marked as collapsing.
Returns: Boolean
Return true if the icon has been updated, false if there was no need to update

markAsExpanded

Boolean markAsExpanded ( expanded )
Marks the item as expanded by adding class to expand icon. The icon will be updated only if needed.
Parameters:
expanded <Boolean> Boolean indicating that item should be marked as expanded.
Returns: Boolean
Return true if the icon has been updated, false if there was no need to update

markAsExpanding

Boolean markAsExpanding ( expanding )
Marks the item as expanding by adding class to expand icon. The method will update icon only if needed.
Parameters:
expanding <Boolean> Boolean indicating that the item should be marked as expanding.
Returns: Boolean
Return true if the icon has been updated, false if there was no need to update

renderUI

protected void renderUI ( )
Creates AccordionItem's header.

resize

void resize ( )
Forces the item to resize as result of direct content manipulation (via 'innerHTML'). This method should be invoked if 'contentHeight' property has been set to 'auto'.

Events

alwaysVisibleChange

alwaysVisibleChange ( event )
Fires when the value for the configuration attribute 'alwaysVisible' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

animationChange

animationChange ( event )
Fires when the value for the configuration attribute 'animation' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

closableChange

closableChange ( event )
Fires when the value for the configuration attribute 'closable' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

contentHeightChange

contentHeightChange ( event )
Fires when the value for the configuration attribute 'contentHeight' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

expandedChange

expandedChange ( event )
Fires when the value for the configuration attribute 'expanded' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

iconAlwaysVisibleChange

iconAlwaysVisibleChange ( event )
Fires when the value for the configuration attribute 'iconAlwaysVisible' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

iconChange

iconChange ( event )
Fires when the value for the configuration attribute 'icon' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

iconCloseChange

iconCloseChange ( event )
Fires when the value for the configuration attribute 'iconClose' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

iconExpandedChange

iconExpandedChange ( event )
Fires when the value for the configuration attribute 'iconExpanded' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

iconsContainerChange

iconsContainerChange ( event )
Fires when the value for the configuration attribute 'iconsContainer' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

labelChange

labelChange ( event )
Fires when the value for the configuration attribute 'label' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

nodeLabelChange

nodeLabelChange ( event )
Fires when the value for the configuration attribute 'nodeLabel' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

stringsChange

stringsChange ( event )
Fires when the value for the configuration attribute 'strings' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

Configuration Attributes

alwaysVisible - Boolean

Get/Set always visible status of the item
Default Value: false

animation - Object

Get/Set the animaton specific settings. By default there are no any settings. If set, they will overwrite Accordion's animation settings
Default Value: {}

closable - Boolean

Boolean indicating that the item can be closed by user. If true, there will be placed close icon, otherwise not
Default Value: false

contentHeight - Object

Describe the method, which will be used when expanding/collapsing the item. The value should be an object with at least one property ("method"):
method
The method can be one of these: "auto", "fixed" and "stretch"
height
Must be set only if method's value is "fixed"
Default Value: auto

expanded - Boolean

Get/Set expanded status of the item
Default Value: false

icon - Node

The Node, representing item's icon
Default Value: null

iconAlwaysVisible - Node

The Node, representing icon always visible
Default Value: null

iconClose - Node

The Node, representing icon close, or null if the item is not closable
Default Value: null

iconExpanded - Node

The Node, representing icon expanded
Default Value: null

iconsContainer - Node

The container of iconAlwaysVisible, iconExpanded and iconClose
Default Value: null

label - String

The label of item
Default Value: " "

nodeLabel - Node

The node, which contains item's label
Default Value: null

strings - Object

Provides client side string localization support.
Default Value: Object English messages


Copyright © 2011 Yahoo! Inc. All rights reserved.