Class ImgLoadGroup
- extends Base
A group for images. A group can have one time limit and a series of triggers. Thus the images belonging to this group must share these constraints.
Properties
Boolean tracking whether the window scroll and window resize triggers have been set if this is a fold group.
DOM elements having the class name that is associated with this group.
Elements are stored during the _foldCheck function and reused later during any subsequent _foldCheck calls - gives a slight performance improvement when the page fold is repeatedly checked.
Keep the CSS class name in a member variable for ease and speed.
_imgObjs
- private Object
Collection of images (Y.ImgLoadImgObj objects) registered with this group, keyed by DOM id.
The maximum pixel height of the document that has been made visible.
During fold checks, if the user scrolls up then there's no need to check for newly exposed images.
_timeout
- private Object
Timeout object to keep a handle on the time limit.
Collection of triggers for this group.
Keeps track of each trigger's event handle, as returned from Y.on.
Properties inherited from Base:
Methods
private
void
_clearTriggers
(
)
Clears the timeout and all triggers associated with the group.
private
void
_fetchByClass
(
)
Finds all elements in the DOM with the class name specified in the group. Removes the class from the element in order to let the style definitions trigger the image fetching.
private
void
_foldCheck
(
)
Checks the position of each image in the group. If any part of the image is within the specified distance (foldDistance) of the client viewport, the image is fetched immediately.
private
Function
_getFetchTimeout
(
)
Returns the group's fetch method, with the proper closure, for use with setTimeout.
- Returns:
Function
- group's
fetch method
private
void
_init
(
)
Initialize all private members needed for the group.
private
void
_onloadTasks
(
)
Performs necessary setup at domready time.
Initiates time limit for group; executes the fold check for the images.
private
void
_setFoldTriggers
(
)
Sets the window scroll and window resize triggers for any group that is fold-conditional (i.e., has a fold distance set).
void
addCustomTrigger
(
name
,
obj
)
Adds a custom event trigger to the group.
- Parameters:
-
name
<String>
The name of the event
-
obj
<Object>
The object on which to attach the event. obj is optional - by default the event is attached to the Y instance
Chainable: This method is chainable.
void
addTrigger
(
obj
,
type
)
Adds a trigger to the group. Arguments are passed to Y.on.
- Parameters:
-
obj
<Object>
The DOM object to attach the trigger event to
-
type
<String>
The event type
Chainable: This method is chainable.
void
fetch
(
)
Displays the images in the group.
This method is called when a trigger fires or the time limit expires; it shouldn't be called externally, but is not private in the rare event that it needs to be called immediately.
Object
registerImage
(
*
)
Registers an image with the group.
Arguments are passed through to a Y.ImgLoadImgObj constructor; see that class' attribute documentation for detailed information. "domId" is a required attribute.
- Parameters:
-
*
<Object>
A configuration object literal with attribute name/value pairs (passed through to a Y.ImgLoadImgObj constructor)
- Returns:
Object
Y.ImgLoadImgObj that was registered
Methods inherited from EventTarget:
_getType,
_parseType,
addTarget,
after,
before,
bubble,
detach,
detachAll,
fire,
getEvent,
on,
publish,
removeTarget,
subscribe,
unsubscribe,
unsubscribeAll
Methods inherited from Attribute:
_addAttrs,
_addLazyAttr,
_defAttrChangeFn,
_fireAttrChange,
_getAttr,
_getAttrInitVal,
_getAttrs,
_getStateVal,
_isLazyAttr,
_normAttrVals,
_protectAttrs,
_set,
_setAttr,
_setAttrs,
_setAttrVal,
_setStateVal,
addAttr,
addAttrs,
attrAdded,
get,
getAttrs,
modifyAttr,
removeAttr,
reset,
set,
setAttrs
Methods inherited from Base:
_aggregateAttrs,
_defDestroyFn,
_defInitFn,
_destroyHierarchy,
_filterAttrCfs,
_getAttrCfgs,
_getClasses,
_initHierarchy,
_initHierarchyData,
destroy,
init,
toString
Events
classNameChange
(
event
)
Fires when the value for the configuration attribute 'className' 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
foldDistanceChange
(
event
)
Fires when the value for the configuration attribute 'foldDistance' 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
nameChange
(
event
)
Fires when the value for the configuration attribute 'name' 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
timeLimitChange
(
event
)
Fires when the value for the configuration attribute 'timeLimit' 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
Events inherited from Base:
Configuration Attributes
Class name that will identify images belonging to the group. This class name will be removed from each element in order to fetch images.
This class should have, in its CSS style definition, "background:none !important;".
Distance below the fold for which images are loaded. Images are not loaded until they are at most this distance away from (or above) the fold.
This check is performed at page load (domready) and after any window scroll or window resize event (until all images are loaded).
name
- String
Name for the group. Only used to identify the group in logging statements.
Time limit, in seconds, after which images are fetched regardless of trigger events.
Configuration attributes inherited from Base: