Utils.dom
namespace
Methods
<static> cssNot(name, value) → {QuerySelectors}
Gets the CSS :not
selector for the given comma-separated list of attributes with the specified value (if any).
Parameters
Name | Type | Description |
---|---|---|
name | string | Comma separated list of attributes. |
value | string | The value to match. |
Returns
QuerySelectors ‐ The query selectors.
<static> getAttribute(element, name) → {string}
Gets the first non-null value for the given comma-separated list of element attributes.
Parameters
Name | Type | Description |
---|---|---|
element | Element | The target element. |
name | string | Comma separated list of attributes. |
Returns
string ‐ The attribute value.
<static> getShadowRoot(node) → {ShadowRoot|boolean}
Return the ShadowRoot node containing the given element, or false if not in a shadow DOM.
Parameters
Name | Type | Description |
---|---|---|
node | Node | The node element. |
Returns
ShadowRoot | boolean ‐ The ShadowRoot or false.
<static> queryAttribute(name, value, appendValue) → {string}
Gets CSS query for matching the given value in a list of specified attributes.
Parameters
Name | Type | Description |
---|---|---|
name | string | Comma separated list of attribute names. |
value | string | The value to match. |
appendValue | QuerySelectors | Additional CSS query to append |
Returns
string ‐ The query string.
<static> setAttribute(element, name, value)
Sets the value of the given comma-separated list of attributes.
Parameters
Name | Type | Description |
---|---|---|
element | Element | The target element. |
name | string | Comma separated list of attributes. |
value | object | string | The value to set. |
Type Definitions
ActiveRefreshCallback(data, refreshMs, forceActive)
The callback for setting data and delay of next refresh request.
Parameters
Name | Type | Argument | Description |
---|---|---|---|
data | object | optional | Data to be passed to next refresh call |
refreshMs | number | optional | Delay in milliseconds before the next refresh call |
forceActive | boolean | undefined | optional | Ignore visibility, schedule anyway |
ActiveRefreshHandler($view, $element, data, nextCallback, attributeName)
The Active-Refresh function that will be called for each refresh request.
This
- {HTMLElement}
Parameters
Name | Type | Argument | Description |
---|---|---|---|
$view | ZxQuery | The component's view | |
$element | ZxQuery | The target element as ZxQuery object | |
data | object | Custom data that ca be passed from call to call | |
nextCallback | ActiveRefreshCallback | Callback for scheduling the next refresh call | |
attributeName | string | optional | Source attribute name if it's a '@' handler |
BindingAdapterCallback($element, fieldName, $view, refreshCallback)
Binding adapter callback.
Parameters
Name | Type | Argument | Description |
---|---|---|---|
$element | ZxQuery | The view's element bound to the data model's fieldName | |
fieldName | string | The element's bound field name | |
$view | ZxQuery | The view | |
refreshCallback | BindingAdapterRefreshCallback | optional | Refresh loop callback |
BindingAdapterRefreshCallback(refreshMs)
Binding adapter refresh callback
Parameters
Name | Type | Argument | Description |
---|---|---|---|
refreshMs | number | optional | Milliseconds to wait before refresh (default: 500ms) |
BundleItem
Bundle item object.
Properties
Name | Type | Description |
---|---|---|
view | Element | |
css | string | |
controller | ContextControllerHandler |
ComponentCache
Component cache object.
Properties
Name | Type | Description |
---|---|---|
componentId | string | The id of the cached component. |
view | Element | The view element. |
css | string | The CSS style text. |
css_applied | boolean | Whether the CSS style has been applied to the view or not. |
controller | ContextControllerHandler | The controller handler function. |
using | string | The url/path if this is a resource loaded with zuix.using(..) method. |
ContextControllerCreateCallback()
Function that gets called after loading, when the component is actually created and ready.
ContextControllerDisposeCallback()
Function called when the component is about to be disposed.
ContextControllerHandler(cp)
This function is called after the component is loaded and it is used to initialize its controller.
This
Parameters
Name | Type | Description |
---|---|---|
cp | ContextController | The component controller object |
ContextControllerInitCallback()
Function that gets called after loading and before the component is created.
ContextControllerUpdateCallback(target, key, value, path, old)
Function called when the data model of the component is updated
Parameters
Name | Type | Description |
---|---|---|
target | Object | The target object. |
key | string | The name of the property. |
value | Object | The value of the property. |
path | string | The full property path (dotted notation). |
old | Object | The target object before the update. |
Returns
‐ undefined
ContextErrorCallback(error, ctx)
Callback function triggered if an error occurs when loading a component.
This
Parameters
Name | Type | Description |
---|---|---|
error | Object | |
ctx | ComponentContext | The component context object (same as this ). |
ContextLoadedCallback(ctx)
Callback function triggered when a component is created, after all of its dependencies have been loaded.
This
Parameters
Name | Type | Description |
---|---|---|
ctx | ComponentContext | The component context (same as this ). |
ContextOptions
This object can be supplied when loading a component. It can be either passed as argument for the zuix.load(...) / zuix.loadComponent(...)
methods, in the javascript code, or with the z-options
attribute in the HTML code of the component's host element.
Properties
Name | Type | Description |
---|---|---|
contextId | Object | undefined | The context id. HTML attribute equivalent: z-context. If not specified it will be randomly generated. HTML attribute equivalent: z-context. |
container | Element | undefined | The container element. |
model | JSON | undefined | The data model. HTML attribute equivalent: z-model. |
view | Element | undefined | The view element. |
controller | ContextControllerHandler | undefined | The controller handler. |
controllerMembers | Object | Additional methods/properties to add to the context controller. |
on | Object.<string, EventCallback> | Object.<string, string> | undefined | The map of event handlers for standard and component's events. An event can also be simply routed to another component's event by specifying the mapped event name string. HTML attribute equivalent: z-on. |
behavior | Object.<string, EventCallback> | Object.<string, string> | undefined | The map of event handlers for behaviors. An event can also be simply routed to another component's event by specifying the mapped event name string. HTML attribute equivalent: z-behavior. |
css | HTMLStyleElement | string | boolean | undefined | Custom stylesheet to apply to the component's view. |
encapsulation | boolean | undefined | Whether to use style encapsulation or not (default: false). |
resetCss | boolean | undefined | Whether to reset view style to prevent inheriting from parent containers (default: false). |
cext | string | undefined | When loading content of the view, appends the specified extension instead of .html. |
html | boolean | string | undefined | It can be set to false , to disable HTML template loading, or it can be set to a string containing the inline HTML template code. |
lazyLoad | boolean | undefined | Enables or disables lazy-loading (default: false). HTML attribute equivalent: z-lazy. |
priority | number | undefined | Loading priority (default: 0). HTML attribute equivalent: z-priority. |
fetchOptions | Object | undefined | Options to be used when fetching this component resources. |
using | string | undefined | Comma separated contexts' id list of components used in this context. A variable with camel-case converted name for each referenced context, will be available in the local scripting scope. |
loaded | ContextLoadedCallback | undefined | The loaded callback, triggered once the component is successfully loaded. |
ready | ContextReadyCallback | undefined | The ready callback, triggered once all component's dependencies have been loaded. |
error | ContextErrorCallback | undefined | The error callback, triggered when an error occurs. |
ContextReadyCallback(ctx)
Callback function triggered when a component has been successfully loaded.
This
Parameters
Name | Type | Description |
---|---|---|
ctx | ComponentContext | The component context (same as this ). |
ElementPosition
The ElementPosition
object returned by the position()
method.
Properties
Name | Type | Description |
---|---|---|
x | number | X coordinate of the element in the viewport |
y | number | Y coordinate of the element in the viewport |
frame | Position | Position of the element relative to the viewport |
event | string | Current state change event description (enter, exit, scroll, off-scroll) |
visible | boolean | Boolean value indicating whether the element is visible in the viewport |
ElementsIterationCallback(count, item, $item)
Callback function used with the each(..)
method.
This
- {ZxQuery}
Parameters
Name | Type | Description |
---|---|---|
count | number | Iteration count. |
item | Element | Current element. |
$item | ZxQuery | ZxQuery wrapped element (same as 'this'). |
EventCallback(event, data, $el)
Callback function triggered when an event registered with the on
method occurs.
This
- {ZxQuery}
Parameters
Name | Type | Description |
---|---|---|
event | string | Event name |
data | Object | Event data |
$el | ZxQuery | ZxQuery wrapped element that sourced the event (same as this ) |
IterationCallback(k, item)
The IterationCallback
function.
This
- {object}
Parameters
Name | Type | Description |
---|---|---|
k | number | object | Iteration count / item key. |
item | object | Current element (same as this ). |
LoggerMonitorCallback(ctx, level)
Callback function for monitoring all log messages.
This
- {object}
Parameters
Name | Type | Description |
---|---|---|
ctx | Object | |
level | string | |
...args | Array.<Object> |
PlayFxCallback($element, classQueue)
Callback function used with the each(..)
method.
This
- {ZxQuery}
Parameters
Name | Type | Description |
---|---|---|
$element | ZxQuery | Target element (same as 'this'). |
classQueue | Array.<string> | Transition/animation class queue left to play, null if the animation ended. |
PlayFxConfig
Configuration object for playFx
, playTransition
, playAnimation
utility methods.
Properties
Name | Type | Argument | Description |
---|---|---|---|
type | 'transition' | 'animation' | The type of effect to play. | |
target | Element | ZxQuery | Target element. | |
classes | Array.<string> | string | List of transition or animation classes to play. | |
options | object | optional | Transition/animation options ('delay', 'duration', etc..). |
holdState | boolean | optional | Hold last transition/animation class. |
onStep | PlayFxCallback | optional | Since class list can contain more than just two classes, this callback will be called after each pair of transition/animation ended. |
onEnd | PlayFxCallback | optional | Called when all transitions/animations ended. |
Position
Relative position.
Properties
Name | Type | Description |
---|---|---|
dx | number | |
dy | number |
ResourceUsingCallback(resourcePath, hashIdOrContext)
Callback in response to a zuix.using
request.
Parameters
Name | Type | Description |
---|---|---|
resourcePath | string | |
hashIdOrContext | string | object |
ZxQueryHttpBeforeSendCallback(xhr)
The ZxQueryHttpBeforeSendCallback
function.
This
- {undefined}
Parameters
Name | Type | Description |
---|---|---|
xhr | XMLHttpRequest |
ZxQueryHttpErrorCallback(xhr, statusText, statusCode)
The ZxQueryHttpErrorCallback
function.
This
- {undefined}
Parameters
Name | Type | Description |
---|---|---|
xhr | XMLHttpRequest | |
statusText | string | |
statusCode | number |
ZxQueryHttpOptions
zuix.$.http options object.
Properties
Name | Type | Description |
---|---|---|
url | string | |
beforeSend | ZxQueryHttpBeforeSendCallback | undefined | |
success | ZxQueryHttpSuccessCallback | undefined | |
error | ZxQueryHttpErrorCallback | undefined | |
then | ZxQueryHttpThenCallback | undefined |
ZxQueryHttpSuccessCallback(responseText)
The ZxQueryHttpSuccessCallback
function.
This
- {undefined}
Parameters
Name | Type | Description |
---|---|---|
responseText | string |
ZxQueryHttpThenCallback(xhr)
The ZxQueryHttpThenCallback
function.
This
- {undefined}
Parameters
Name | Type | Description |
---|---|---|
xhr | XMLHttpRequest |