Class: library

componyx.library(selector, baseElement, tagName, scalar, upwards) → {Array.<HTMLElement>}

Search the DOM with the specified selector. Only the selector argument is required for an id search.

Constructor

new library(selector, baseElement, tagName, scalar, upwards) → {Array.<HTMLElement>}

Parameters:

Name	Type	Description
`selector`	Object	1: null: no filter apart from baseElement and tagName. 2: '#id': get single element by id. 3: 'class1 class2': get elements by class name(s), 4: ['class1 class2', callback] get elements by class name(s) and use callback function to filter result. 5: callback function. The callback function accepts two arguments and returns true to include or false to exclude the element from the result array. argument 1: The current element in the iteration. argument 2: A function reference to stop the iteraton when called. (optional)
`baseElement`	HTMLElement	Element from where to start searching or null to start at the document.
`tagName`	String	Name of tags to search or null to search all tags.
`scalar`	Boolean	A value indicating to return a single result which makes the iteration stop after a match (function or class selector only).
`upwards`	Boolean	A value indicating to iterate upwards through the DOM starting at the base element (does not work with class selectors).

Properties:

Name	Type	Description
`document`	HTMLElement	The active document object.
`touch`	Boolean	A value indicating if we are dealing with a touch device.
`event`	Event	This variable will hold the last active HTML event object.
`webSockets`	Array.<WebSocket>	This variable will hold the active WebSocket connections.

Returns:

The element for an id or scalar search otherwise an array of elements (empty array when there is no result).

Type: Array.<HTMLElement>

Classes

Animation
Event
Path

Namespaces

JSON

Members

(static) isArray

Checks if the passed object is an array.

Methods

(static) addClass(element, cssClass)

Adds the specified css class(es) to the element.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.
`cssClass`	String	Name of the css class or classes separated by a space.

(static) addCssSource(src, id, handlers, beforeopt) → {HTMLElement}

Adds a css link tag with the specified source and id to the page

Parameters:

Name Type Attributes Description

src

String

The src of the tag

id

String

The id of the tag

handlers

Object

Properties

Name	Type	Description
`onStart`	Object	The onStart is called when a new tag is added to the page.
`onComplete`	Object	The onComplete is called when an HTTP request has finished.
`onError`	Object	The onError is called when an HTTP request has failed.

before

HTMLElement

The new tag will be placed before this tag if it was not already on the page.

Returns:

The created element.

Type: HTMLElement

(static) addCssTag(text, id, beforeopt) → {HTMLElement}

Adds an inline css style tag with the specified text and id to the page.

Parameters:

Name	Type	Attributes	Description
`text`	String		Css text
`id`	String		Id of the style tag
`before`	HTMLElement	<optional>	The new tag will be placed before this tag when specified.

Returns:

The created element.

Type: HTMLElement

(static) addHTML(html, elementopt, mappingopt, onCompleteopt)

Adds the (X)HTML data to the specified element(s) and loads contained script and CSS resources.

Parameters:

Name	Type	Attributes	Description
`html`	String		The HTML string to add.
`element`	HTMLElement	<optional>	The Element to which the html will be appended.
`mapping`	Object	<optional>	A mapping object where the key refers to the id of the source element and the value refers to the target element or element id.
`onComplete`	function	<optional>	Event callback method which is invoked when the html data is added and the resources are loaded.

(static) addScriptSource(src, id, handlers, asyncopt, deferopt, beforeopt) → {HTMLElement}

Adds a script tag with the specified source and id to the page

Parameters:

Name Type Attributes Description

src

String

The src of the tag

id

String

The id of the tag

handlers

Object

Properties

Name	Type	Description
`onStart`	Object	The onStart is called when a new tag is added to the page.
`onComplete`	Object	The onComplete is called when an HTTP request has finished.
`onError`	Object	The onError is called when an HTTP request has failed.

async

Boolean

A value indicating if the script should be loaded with the async option (false by default).

defer

Boolean

A value indicating if the script should be loaded with the defer option (false by default).

before

HTMLElement

The new tag will be placed before this tag if it was not already on the page.

Returns:

The created element.

Type: HTMLElement

(static) addScriptTag(text, id, beforeopt) → {HTMLElement}

Adds an inline script tag with the specified text and id to the page.

Parameters:

Name	Type	Attributes	Description
`text`	String		Script text
`id`	String		Id of the script tag
`before`	HTMLElement	<optional>	The new tag will be placed before this tag when specified.

Returns:

The created element.

Type: HTMLElement

(static) animate(element, properties, settings) → {componyx.library.Animation}

Animates the element(s) by transitioning the current property values to the specified values. When both elements and properties are passed as array they will be matched on array index, otherwise the element(s) will use the properties object.

Parameters:

Name	Type	Description
`element`	HTMLElement \| Array.<HTMLElement>	Element.
`properties`	Object \| Array.<Object>	Properties. A single property can be specified in two ways. property: value property: [value, settings] Animation settings or a numeric value to specify the duration only.
`settings`	componyx.library.animationSettings \| Number	Animation settings or a numeric value to specify the duration only.

Returns:

The Animation object.

Type: componyx.library.Animation

(static) animateToClass(element, cssClass, classSpecifier, settings) → {componyx.library.Animation}

Animates the element by transitioning the current css class(es) to the specified class(es). When parameters are passed as array, they will be matched on array index.

Parameters:

Name	Type	Description
`element`	HTMLElement \| Array.<HTMLElement>	Element.
`cssClass`	String \| Array.<String>	Class name(s) string. Use space separated names to apply multiple classes on a single element.
`classSpecifier`	Object \| Array.<Object>	The class specifier defines how classes are assigned to the element(s). By default classes are toggled, use classname: 'toggle/add/remove' for the desired behaviour.
`settings`	componyx.library.animationSettings	The settings which configure the animation.

Returns:

The Animation object.

Type: componyx.library.Animation

(static) appendChildren(source, target) → {HTMLElement}

Appends the child nodes from the source element to the target element.

Parameters:

Name	Type	Description
`source`	HTMLElement	The source element.
`target`	HTMLElement	The target element.

Returns:

The target element.

Type: HTMLElement

(static) border(element) → {componyx.library.BorderSizes}

Returns the border sizes of the element in pixels.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.

Returns:

An object describing the border sizes of the element.

Type: componyx.library.BorderSizes

(static) borderAndPadding(element, computeSizeopt) → {componyx.library.BorderPaddingSizes}

Returns the border size, padding size and combined size (width and height of border and padding) in pixels.

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element.
`computeSize`	Boolean	<optional>	A value indicating if the combined size (width and height of border and padding) is computed. When omitted the size is only computed when the element has the default CSS box-sizing value (content-box).

Returns:

An object describing the border & padding size of the element.

Type: componyx.library.BorderPaddingSizes

(static) children(element) → {Array.<HTMLElement>}

Retrieves an array of childnodes that are of type ELEMENT_NODE.

Parameters:

Name	Type	Description
`element`	HTMLElement	The XML or (X)HTML element.

Returns:

Element collection.

Type: Array.<HTMLElement>

(static) clientX(e) → {Number}

Gets the x coordinate of the (mouse)pointer.

Parameters:

Name	Type	Description
`e`	Object	The event.

Returns:

ClientX position.

Type: Number

(static) clientY(e) → {Number}

Gets the y coordinate of the (mouse)pointer.

Parameters:

Name	Type	Description
`e`	Object	The event.

Returns:

ClientY position.

Type: Number

(static) clone(target, sourceopt, deepopt, overwriteopt, extendopt, excludeEmptyopt, excludeFunctionsopt, excludeopt, omitopt, typesopt, typeCheckopt, converteropt, reportopt) → {Object}

Copies properties from the source object (or function) to the target object. Supports deep cloning, conditionally overwriting properties, circular reference protection and excluding specific values or types.

Parameters:

Name	Type	Attributes	Default	Description
`target`	Object \| Object			The target object to which properties will be copied, or a settings object holding all configuration options.
`source`	Object	<optional>		The source object whose properties will be cloned to the target.
`deep`	boolean	<optional>	false	If true, perform a deep copy (recursive cloning).
`overwrite`	number \| boolean	<optional>	false	Specifies how to overwrite existing properties on the target: `0` or `false`: Do not overwrite existing properties. `1` or `true`: Overwrite existing properties. `2`: Overwrite only if the target property is `null` or `undefined`.
`extend`	boolean	<optional>	true	If true, new properties from the source will be added to the target object.
`excludeEmpty`	boolean	<optional>	false	Defines if null, undefined, or empty values should be excluded from the source object: `false`: Include null, undefined, or empty values. `true`: Exclude null, undefined, or empty values. `2`: Exclude when the target is a plain object type (clones value types only).
`excludeFunctions`	boolean	<optional>	false	If true, function properties will not be copied.
`exclude`	Array.<Array>	<optional>		Tracks visited/excluded objects to handle circular references. [0] the object to match, [1] the object to return.
`omit`	Set \| Object	<optional>		A Set or Object specifying keys to omit from the source object.
`types`	Object.<string, function()>	<optional>		An object mapping type names to their constructor functions.
`typeCheck`	string	<optional>	"constructor"	How to determine type names: `"constructor"` (default) or a property name on the source.
`converter`	Object	<optional>		An object mapping source keys to custom converter functions.
`report`	Object	<optional>		An optional object used to report whether any target values were actually changed during cloning. If provided, its `changed` property is set to `true` the moment any property on the target is written.

Returns:

The updated target object after cloning.

Type: Object

Examples

// Traditional usage (positional arguments)
$.clone(target, source, true, 1, true, false, false, [], new Set(), { MyType: MyClass }, {});

// Using a settings object (all parameters are optional and can be selectively provided)
$.clone({
  target: target,
  source: source,
  deep: true,
  overwrite: 1,
  extend: true,
  excludeEmpty: false,
  excludeFunctions: false,
  exclude: [],
  omit: new Set(['password']),
  types: { MyType: MyClass },
  typeCheck: "type"
  converter: { date: (val) => new Date(val) },
  report: { changed: false }
});

(static) commonAncestor(firstNode, secondNode, parentElementopt) → {HTMLElement}

Gets the common ancestor for 2 nodes.

Parameters:

Name	Type	Attributes	Description
`firstNode`	HTMLElement		The first node.
`secondNode`	HTMLElement		The second node.
`parentElement`	HTMLElement	<optional>	Only siblings within the specified parent element are retrieved.

Returns:

The common ancestor element.

Type: HTMLElement

(static) contains(parent, node) → {Boolean}

Checks if the node is a child of the specified parent element.

Parameters:

Name	Type	Description
`parent`	HTMLElement	The parent element.
`node`	Node	The node for which to check if it is a child of the specified parent.

Returns:

A value indicating if the node is a child of the specified parent element.

Type: Boolean

(static) copyComputedStyle(source, target)

Copies the computed style of the source element to the target element.

Parameters:

Name	Type	Description
`source`	HTMLElement	The source element.
`target`	HTMLElement	The target element.

(static) copyEvents(target, source) → {HTMLElement|Object}

Copies the events from the source to the target object.

Parameters:

Name	Type	Description
`target`	HTMLElement \| Object	HTMLElement or object.
`source`	HTMLElement \| Object	HTMLElement or object.

Returns:

The target HTMLElement or object.

Type: HTMLElement | Object

(static) createEvent(eventName) → {Event}

Creates a class instance for binding and handeling events.

Parameters:

Name	Type	Description
`eventName`	String	The name of the event.

Returns:

An object for handeling events.

Type: Event

(static) cssAnimation(element, animationClassopt, triggerElementsopt, callbacks) → {cssAnimationController}

Applies a CSS animation/transition to an element by adding the specified classes and triggers the onComplete callback when the animation/transition ends.

Parameters:

Name Type Attributes Description

element

HTMLElement

The element to animate.

animationClass

String

The CSS class used to trigger the animation/transition.

triggerElements

Array.<HTMLElement>

Array of child elements that are considered valid for triggering the animation/transition start/end events. If ommited only the main element will trigger.

callbacks

Object

An object to configure the event callbacks.

Properties

Name	Type	Description
`onComplete`	function	Callback invoked when the animation/transition completes.
`onStart`	function	Callback invoked when the animation/transition starts.
`isComplete`	function	Callback invoked to check if the animation/transition has completed. The TransitionEnd event might fire multiple times if multiple animations/transitions have been configured on the element (or pseudo elements) in CSS.

Returns:

An object to abort/complete the css animation/transition.

Type: cssAnimationController

(static) defaultView(node) → {Window}

Returns the window object associated with the specified node.

Parameters:

Name	Type	Description
`node`	Node	The node for which to return the associated window object.

Returns:

The window object associated with the specified node or null if specified obj is not of type Node.

Type: Window

(static) defer(fn)

Defers the specified method until the current task stack has finished processing.

Parameters:

Name	Type	Description
`fn`	function	The method to invoke as soon as possible after the current task stack has finished. Use the native bind method to pass in arguments.

(static) draggable(element, settings) → {componyx.library.DraggableController}

Enables the specified element to be draggable.

Parameters:

Name	Type	Description
`element`	HTMLElement	DOM element to make draggable.
`settings`	componyx.library.DraggableSettings	The settings which configure the drag behaviour.

Returns:

An Object to control the draggable behaviour.

Type: componyx.library.DraggableController

(static) each(object, callback, argsopt, startIndexopt, manualFetchingopt, lastopt, reverseopt)

Iterates through the items of the object or array and invokes the handler while passing in the item value, item key/index, the object/array and optional extra arguments.

Parameters:

Name	Type	Attributes	Description
`object`	Object \| Array		An object or array to iterate or a settings object holding the properties to configure the each call.
`callback`	componyx.library.EachCallback		A delegate handler that is invoked for each item.
`args`	Array	<optional>	An array of extra arguments to pass to the handler.
`startIndex`	Number	<optional>	The start position of the iteration when dealing with an Array type.
`manualFetching`	Boolean	<optional>	A value indicating if manual fetching is required. This allows asynchronous code execution while performing an iteration. The fetcher method to manually move the iterator to the next item is passed to the handler as fifth argument.
`last`	function	<optional>	A callback method to invoke when manualFetching is enabled and the last item has been iterated.
`reverse`	Boolean	<optional>	A value indicating if the iteration should move backwards. Reverse iteration is supported for arrays, and for objects only when manualFetching is true.

Examples

// Traditional usage (positional arguments)
$.each(['item-1', 'item-2'], (item, index, array, args) => { },['arg-1'], 0, false, null, false);

// Using a settings object (all parameters are optional and can be selectively provided)
$.each({
  object: ['item-1', 'item-2'],
  handler: (item, index, array, args) => { },
  args: ['arg-1'],
  startIndex: 0,
  manualFetching: false,
  last: null,
  reverse: false
});

(static) element(containeropt, beforeopt, tagopt, contentopt, attrsopt, propsopt) → {HTMLElement}

Creates a new HTMLElement.

Parameters:

Name	Type	Attributes	Default	Description
`container`	HTMLElement \| Object	<optional>		The container element to append the new element to, or a settings object holding the properties to configure element creation.
`before`	HTMLElement	<optional>		The element to insert before (if using positional parameters).
`tag`	String	<optional>	'div'	The tag name for the new element.
`content`	Array.<Node> \| Node \| String \| Array.<String>	<optional>		The content of the new element. String[] is treated as HTML.
`attrs`	Object	<optional>		Attributes to set on the element.
`props`	Object	<optional>		Properties to set on the element.

Returns:

The created element.

Type: HTMLElement

Examples

// Traditional usage (positional arguments)
$.element(container, before, 'div', 'Hello', { id: 'greeting' }, { className: 'text' });

// Using a settings object (all parameters are optional and can be selectively provided)
$.element({
  container: container,
  before: before,
  tagName: 'div',
  content: 'Hello',
  attrs: { id: 'greeting' },
  props: { className: 'text' }
});

(static) encodeHTML(text) → {String}

Encodes an html string

Parameters:

Name	Type	Description
`text`	String	The text to encode

Returns:

An encoded string

Type: String

(static) encodeString(text) → {String}

Encodes a js string

Parameters:

Name	Type	Description
`text`	String	The text to encode

Returns:

An encoded string

Type: String

(static) endsWith(text, suffix, ignoreCase) → {Boolean}

Checks if the text ends with the specified suffix.

Parameters:

Name	Type	Description
`text`	String
`suffix`	String
`ignoreCase`	Boolean	Defines if the comparison should be case-insensitive.

Returns:

Returns true if the text ends with the specified suffix, otherwise false.

Type: Boolean

(static) escapeRegExp(text) → {String}

Escapes a regular expression string to use with the regexp object.

Parameters:

Name	Type	Description
`text`	String	The text to escape.

Returns:

The escaped text.

Type: String

(static) eventRelated(e) → {HTMLElement}

Gets the related element for the current event.

Parameters:

Name	Type	Description
`e`	Object	The event

Returns:

Related element.

Type: HTMLElement

(static) eventSource(e) → {HTMLElement}

Gets the source element for the current event.

Parameters:

Name	Type	Description
`e`	Object	The event.

Returns:

Source element.

Type: HTMLElement

(static) extract(element, toArrayopt) → {DocumentFragment|Array.<HTMLElement>}

Extracts the child nodes from the specified element by appending the nodes to a document fragment or array.

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element containing the child nodes to extract.
`toArray`	Boolean	<optional>	A value indicating if the nodes should be extracted to an array.

Returns:

A document fragment or array containing the extracted child nodes.

Type: DocumentFragment | Array.<HTMLElement>

(static) fadeIn(element, settings) → {componyx.library.Animation}

Displays the element by fading it from transparent to opaque. When parameters are passed as array, they will be matched on array index.

Parameters:

Name	Type	Description
`element`	HTMLElement \| Array.<HTMLElement>	Element.
`settings`	componyx.library.animationSettings	The settings which configure the animation.

Returns:

The Animation object.

Type: componyx.library.Animation

(static) fadeOut(element, settings) → {componyx.library.Animation}

Hides the element by fading it from opaque to transparent. When parameters are passed as array, they will be matched on array index.

Parameters:

Name	Type	Description
`element`	HTMLElement \| Array.<HTMLElement>	Element.
`settings`	componyx.library.animationSettings	The settings which configure the animation.

Returns:

The Animation object.

Type: componyx.library.Animation

(static) fireEvent(element, type, bubblesopt, cancelableopt, propertiesopt)

Fires the HTML event of the specified type on the element

Parameters:

Name	Type	Attributes	Default	Description
`element`	HTMLElement			DOM element
`type`	String			HTMLEvent type
`bubbles`	Boolean	<optional>	false	A value indicating whether the event should bubble up through the event chain or not.
`cancelable`	Boolean	<optional>	false	A value indicating whether the event can be cancelled.
`properties`	Object	<optional>		Properties with which the event object will be extended.

(static) firstChildByTagName(element, name) → {HTMLElement}

Retrieves the first child node by tagname that is of type ELEMENT_NODE.

Parameters:

Name	Type	Description
`element`	HTMLElement	The XML or (X)HTML element.
`name`	String	The name of the tag.

Returns:

The first child element which equals the specified name.

Type: HTMLElement

(static) focusable(element) → {Boolean}

Checks if an element is focusable.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.

Returns:

A value indicating if the element is focusable.

Type: Boolean

(static) format(text, args) → {String}

Replaces each parameter in a specified String with the text equivalent of a corresponding object's value.

Parameters:

Name	Type	Description
`text`	String	Text to which the format will be applied.
`args`	* \| Object	A variable amount of parameters or an object with named keys to be replaced in the text string.

Returns:

The formatted text.

Type: String

(static) formatDate(date, format)

Formats a date value for textual display.

Parameters:

Name	Type	Description
`date`	Date	The Date value.
`format`	String	The Date format as in 'MM-dd-yyyy hh:mm:ss'. Casing for Month and minutes is required, other casings are ignored.

(static) formatNumber(value, leadingZerosopt, trailingZerosopt, precisionopt, roundingopt, decimalSeparatoropt, groupSeparatoropt, digitPadLeftValueopt) → {Number}

Formats a numeric value for textual display.

Parameters:

Name	Type	Attributes	Default	Description
`value`	Number			Numeric value.
`leadingZeros`	Boolean	<optional>		Defines if leading zeros should be displayed.
`trailingZeros`	Boolean	<optional>		Defines if trailing zeros on the decimal side should be displayed.
`precision`	Number	<optional>		Amount of decimal places.
`rounding`	String	<optional>		Type of decimal rounding when rounding is desired (round, floor or ceil).
`decimalSeparator`	String	<optional>	.	The character used as decimal separator.
`groupSeparator`	String	<optional>		The character used as group separator.
`digitPadLeftValue`	String	<optional>		The specified value is used to right-align the digits by padding this value to the left.

Returns:

Formatted numeric value.

Type: Number

(static) fragmentFromHTML(text) → {DocumentFragment}

Converts the HTML text to a document fragment.

Parameters:

Name	Type	Description
`text`	String	The HTML text.

Returns:

A document fragment containing the nodes from the HTML string.

Type: DocumentFragment

(static) getConstructor(obj) → {String}

Returns the name of the object's constructor.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.

Returns:

The constructor name.

Type: String

(static) getCssRule(styleSheet, selector) → {Array.<CSSRule>}

Gets CSS rules from the specified styleSheet.

Parameters:

Name	Type	Description
`styleSheet`	CSSStyleSheet	The styleSheet in which the rule(s) exists.
`selector`	String	The selector text/regex to match rules.

Returns:

The found CSS rule(s).

Type: Array.<CSSRule>

(static) getDateOfWeek(week, year, firstDay) → {Date}

Gets the start date of the week by following the ISO-8601 standard.

Parameters:

Name	Type	Description
`week`	Number	The week number.
`year`	Number	The year.
`firstDay`	Number	Day of the week (0-6). 0:Sunday, 6:Saturday.

Returns:

The start date of the week.

Type: Date

(static) getNodesInRange(nodeNameopt, rangeopt) → {Array.<Node>}

Gets the nodes within the current selection range.

Parameters:

Name	Type	Attributes	Description
`nodeName`	String	<optional>	A single node name or a space separated string with node names to filter the result list.
`range`	Range	<optional>	A selection range from which nodes are retrieved. By default the current selection range is used.

Returns:

A list of nodes (which satisfy the optional filter) within the selection range.

Type: Array.<Node>

(static) getPos(element, parentopt, fixedopt) → {componyx.library.Position}

Gets the absolute page position coordinates of the element.

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element.
`parent`	HTMLElement	<optional>	An element to get the position coordinates of the element, relative to its parent element.
`fixed`	Boolean	<optional>	A value indicating if fixed position values (ignoring scrollbar positions) should be returned.

Returns:

An object wich describes the position values.

Type: componyx.library.Position

(static) getPrototypeOf(obj) → {Object}

Gets the object's prototype.

Parameters:

Name	Type	Description
`obj`	Object	The Object from which the prototype is returned.

Returns:

Returns the object's prototype.

Type: Object

(static) getScrollBarSize() → {componyx.library.Dimensions}

Gets the width and height of a scrollbar.

Returns:

An object describing the width and height sizes.

Type: componyx.library.Dimensions

(static) getScrollPosition() → {componyx.library.ScrollPos}

Returns the scrollLeft and scrollTop positions.

Returns:

An object which describes the scroll values.

Type: componyx.library.ScrollPos

(static) getStyleSheet(id, src) → {Object}

Gets the stylesheet by source url or id. The stylesheet will be matched on id if the id parameter is passed.

Parameters:

Name	Type	Description
`id`	String	Id of the stylesheet.
`src`	String	Src of the stylesheet.

Returns:

Stylesheet object.

Type: Object

(static) getWeekNumber(date, firstDayopt) → {Number}

Gets the ISO-8601 week number (Mon-Sun, first 4 day week) or the alternative variant (Sun-Sat/Sat-Fri, first week has 1st of January) when the first day is specified as Saturday or Sunday.

Parameters:

Name	Type	Attributes	Default	Description
`date`	Date			Date object.
`firstDay`	Number	<optional>	1	Day of the week 0:Sunday, 1:Monday, 6:Saturday.

Returns:

Week number.

Type: Number

(static) getWindowSize() → {componyx.library.Dimensions}

Gets the width and height of the window.

Returns:

An object describing the width and height sizes.

Type: componyx.library.Dimensions

(static) guid() → {String}

Generates a new unique id.

Returns:

The generated id.

Type: String

(static) has(obj, eventType, handler) → {Boolean}

Checks if the event handler is attached to the object for the specified event type.

Parameters:

Name	Type	Description
`obj`	HTMLElement \| Object	HTMLElement or object.
`eventType`	String	Event type.
`handler`	function \| String	The handler or the handler guid returned from the bind method.

Returns:

True if the handler is bound, otherwise false.

Type: Boolean

(static) hasClass(element, cssClass) → {Boolean}

Checks if the element's classname property contains the css class(es).

Parameters:

Name	Type	Description
`element`	HTMLElement	The element to check.
`cssClass`	String	Name of the css class.

Returns:

Returns true if the element's classname contains the cssClass, otherwise false.

Type: Boolean

(static) hexToRgb(hex) → {Array.<Number>}

Converts a hexadecimal color string to a rgb color.

Parameters:

Name	Type	Description
`hex`	String	hex color string.

Returns:

The R,G,B values.

Type: Array.<Number>

(static) hsvToRgb(h, s, v) → {Array.<Number>}

Converts the hsv value to rgb.

Parameters:

Name	Type	Description
`h`	Number	The hue value 0-1.
`s`	Number	The saturation value 0-1.
`v`	Number	The lightness value 0-1.

Returns:

The rgb value.

Type: Array.<Number>

(static) inViewport(element) → {componyx.library.Viewport}

Checks if the specified element is visible within the current viewport (window dimensions with vertical and horizontal scrollbar position).

Parameters:

Name	Type	Description
`element`	HTMLElement	The element to check for.

Returns:

An object describing the element's visibility within the viewport.

Type: componyx.library.Viewport

(static) indexOf(items, comparer, ignoreCase, strictCompare) → {Number}

Searches for a specified value within an array and returns its index (or -1 if not found).

Parameters:

Name	Type	Description
`items`	Array	Array to search.
`comparer`	Object	A value of any type to compare with. A function which accepts the item to compare as argument and returns a boolean value indicating if there was a successful match.
`ignoreCase`	Boolean	Defines if the comparison should be case-insensitive.
`strictCompare`	Boolean	Defines if the comparison should be strict. Compared values only match when they are of the same type (true by default).

Returns:

Index of the found item or -1 if not found.

Type: Number

(static) insertNode(node, selectopt, rangeopt, deleteContentopt)

Inserts the node at the current caret (cursor) position (overriding any selection).

Parameters:

Name	Type	Attributes	Description
`node`	Node		The node to insert.
`select`	Boolean	<optional>	A value indicating if the inserted node must be selected.
`range`	Range	<optional>	A range in which the node will be inserted. By default the current selection range is used.
`deleteContent`	Boolean	<optional>	A value indicating if the content within the range should be removed prior to the insertion of the node.

(static) instantiate(constructor, properties) → {Object}

Creates a new instance by calling the specified constructor and initializes the new object with the specified properties.

Parameters:

Name	Type	Description
`constructor`	function	An object's constructor function.
`properties`	Object	The initialization properties of the new object.

Returns:

The new object instance.

Type: Object

(static) isDOM(obj) → {Boolean}

Checks if the specified object is a DOM object.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.

Returns:

Returns true if the specified object is a DOM object, otherwise false.

Type: Boolean

(static) isDate(obj) → {Boolean}

Checks if the passed object is a date.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.

Returns:

Returns true if the specified object is a Date, otherwise false.

Type: Boolean

(static) isElement(obj) → {Boolean}

Checks if the passed object is an HTML element.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.

Returns:

Returns true if the specified object is an HTMLElement, otherwise false.

Type: Boolean

(static) isEmpty(obj, trim) → {Boolean}

Checks if the passed object/array/string is null or empty.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.
`trim`	Boolean	Removes leading and trailing white space characters, new lines and tabs from the specified string (Defaults to true).

Returns:

Returns true if the specified object is null or empty, otherwise false.

Type: Boolean

(static) isLeapYear(year) → {Boolean}

Returns true if the specified year is a leap year, otherwise false.

Parameters:

Name	Type	Description
`year`	Number	The year.

Returns:

A value indicating if the specified year is a leap year.

Type: Boolean

(static) isPlainObject(obj, strict) → {Boolean}

Checks if the passed object is a plain object.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.
`strict`	Boolean	A value indicating if custom class objects should NOT be considered a plain object.

Returns:

Returns true if the specified object is a plain object, otherwise false.

Type: Boolean

(static) isPrimitive(obj) → {Boolean}

Checks if the passed object is a primative type.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.

Returns:

Returns true if the specified object is a primative type, otherwise false.

Type: Boolean

(static) isXMLElement(obj) → {Boolean}

Checks if the passed object is an XML element.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.

Returns:

Returns true if the specified object is an XMLElement, otherwise false.

Type: Boolean

(static) keepAlive(src, delay) → {function}

Fires an HTTP request to the specified source every x milliseconds to keep the current HTTP session alive

Parameters:

Name	Type	Description
`src`	String	Source location
`delay`	Number	Refresh delay in milliseconds, 300000 milliseconds (5 minutes) by default

Returns:

A method to kill the keep alive

Type: function

(static) load(settings, element, mappingopt) → {componyx.library.XhrWrappedResult}

Loads (X)HTML data through an XML HTTP request and adds the data to the current document with the addHTML method (view addHTML comments for more info).

Parameters:

Name	Type	Attributes	Description
`settings`	componyx.library.xhrSettings		The Settings which configure the xhr request. (view XhrSettings)
`element`	HTMLElement		The Element to which the html will be appended.
`mapping`	Object	<optional>	A mapping object where the key refers to the id of the source element and the value refers to the target element or element id.

Returns:

An object wrapped around the xhr object.

Type: componyx.library.XhrWrappedResult

(static) log(message)

Logs the message in the js console if available.

Parameters:

Name	Type	Description
`message`	String	The message to log.

(static) margin(element) → {componyx.library.MarginSizes}

Returns the margin sizes of the element in pixels.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.

Returns:

An object describing the margin sizes of the element.

Type: componyx.library.MarginSizes

(static) move(list, index, targetIndex, amountopt) → {Number}

Moves array elements from one position to another.

Parameters:

Name	Type	Attributes	Default	Description
`list`	Array			The array.
`index`	Number			The position index of the element to move.
`targetIndex`	Number			The position index where the elements are placed (current index in the array before moving).
`amount`	Number	<optional>	1	The number of elements to be moved.

Returns:

The new index of the moved element(s). The index changes when elements are moved from top to bottom because the array will be re-ordered.

Type: Number

(static) off(obj, eventTypeopt, handleropt)

Removes the attached event handler from the object for the specified type.

Parameters:

Name	Type	Attributes	Description
`obj`	HTMLElement \| Object		HTMLElement or object.
`eventType`	String	<optional>	Event type. Ommit to remove all bounded event handlers.
`handler`	function \| String	<optional>	The handler or the guid of the handler to remove. Ommit to remove all bounded event handlers for the specified event type.

(static) on(obj, eventType, handler, argsopt, contextopt, uniqueopt, fireOnceopt, optionsopt) → {String}

Attaches an event handler to the specified object event(s).

Parameters:

Name	Type	Attributes	Default	Description
`obj`	HTMLElement \| Object \| Object			HTMLElement, object, or settings object.
`eventType`	String			One or more event types separated by a space.
`handler`	function			A method containing executable code.
`args`	Array.<Object>	<optional>		An array of arguments that should be passed to the event handler.
`context`	Object	<optional>		The execution context object on which the handler is applied.
`unique`	Boolean	<optional>	false	If true, only one handler per GUID is allowed.
`fireOnce`	Boolean	<optional>	false	If true, handler is removed after first run.
`options`	Object	<optional>		Native addEventListener options (capture, passive, once).

Returns:

The generated guid of the handler.

Type: String

(static) once(obj, eventType, handler, argsopt, contextopt, uniqueopt) → {String}

Attaches a fire once event handler to the specified object event(s).

Parameters:

Name	Type	Attributes	Default	Description
`obj`	HTMLElement \| Object			HTMLElement or object.
`eventType`	String			One or more event types separated by a space.
`handler`	function			A method containing executable code.
`args`	Array.<Object>	<optional>		An array of arguments that should be passed to the event handler.
`context`	Object	<optional>		The execution context object on which the handler is applied, by default the DOM element/object on which the event is fired.
`unique`	Boolean	<optional>	false	A value indicating if event handlers for a specific object and event-type should exist only once.

Returns:

The generated guid of the handler.

Type: String

(static) padLeft(value, length, textopt) → {String}

Returns a new string that right-aligns the characters in this instance by padding them on the left with a specified Unicode character, for a specified total length.

Parameters:

Name	Type	Attributes	Description
`value`	String		The string value on which the operation is applied.
`length`	Number		The number of characters in the resulting string, equal to the number of original characters plus any additional padding characters.
`text`	String	<optional>	The padding character(s).

Returns:

Left padded text.

Type: String

(static) padRight(value, length, textopt) → {String}

Returns a new string that left-aligns the characters in this instance by padding them on the right with a specified Unicode character, for a specified total length.

Parameters:

Name	Type	Attributes	Description
`value`	String		The string value on which the operation is applied.
`length`	Number		The number of characters in the resulting string, equal to the number of original characters plus any additional padding characters.
`text`	String	<optional>	The padding character(s).

Returns:

Right padded text.

Type: String

(static) padding(element) → {componyx.library.PaddingSizes}

Returns the padding sizes of the element in pixels.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.

Returns:

An object describing the padding sizes of the element.

Type: componyx.library.PaddingSizes

(static) parseDate(value, format) → {Date}

Parses a string value to a workable date object.

Parameters:

Name	Type	Description
`value`	String	Date value as string.
`format`	String	Date format as in 'mm-dd-yyyy hh:mm:ss'.

Returns:

New Date object.

Type: Date

(static) path(items, recursionKey, comparer, scalar) → {Array.<componyx.library.Path>|componyx.library.Path}

Iterates through the items in the array and evaluates each object against the specified comparer function. The iteration is called recursively when the recursionKey is found on an object.

Parameters:

Name	Type	Description
`items`	Array	The root array.
`recursionKey`	String	The object key which points to the child items array. Separate object keys with a dot "." to denote a deeper level.
`comparer`	function	A function which accepts the item to compare as argument and returns a boolean value indicating if there was a successful match.
`scalar`	Boolean	A value indicating to return a single result which makes the iteration stop after a match.

Returns:

An array of Path instances or a single Path instance when the scalar option was provided. The Path object offers methods to navigate in any direction from a specific item within the tree.

Type: Array.<componyx.library.Path> | componyx.library.Path

(static) positionedParent(element) → {HTMLElement}

Returns the first relative, absolute or fixed positioned parent element if there is any.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.

Returns:

A positioned parent element or null when no positioned parent is found.

Type: HTMLElement

(static) prototype(obj, baseObj)

Defines the prototype of an object and keeps the correct constructor.

Parameters:

Name	Type	Description
`obj`	Object	The object to derive from the base object.
`baseObj`	Object	The base object that will become the prototype of the derived object.

(static) ready(handler, args, context)

Adds a handler which fires when the document is ready for manipulation, but before all resources have been loaded.

Parameters:

Name	Type	Description
`handler`	function	A handler.
`args`	Array	An array of arguments that should be passed to the handler.
`context`	Object	The execution context object on which the handler is applied.

(static) registerNamespace(namespace)

Emulates a namespace by creating an object hierarchy for the specified namespace text.

Parameters:

Name	Type	Description
`namespace`	String	Text with '.' separators as namespace.

(static) remove(element) → {Node}

Removes the specified node.

Parameters:

Name	Type	Description
`element`	HTMLElement	The node to remove.

Returns:

A Node object, representing the removed node, or null if the node does not exist.

Type: Node

(static) removeChildren(element)

Removes all the children of the specified element.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element for which the children will be removed.

(static) removeClass(element, cssClass)

Removes the specified css class(es) from the element.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.
`cssClass`	String	Name of the css class or classes separated by a space.

(static) resizable(element, settings) → {componyx.library.ResizableController}

Enables the specified element to be resizable.

Parameters:

Name	Type	Description
`element`	HTMLElement	to make resizable.
`settings`	componyx.library.ResizableSettings	The settings which configure the resize behaviour.

Returns:

An Object to control the resizable behaviour.

Type: componyx.library.ResizableController

(static) reverseText(text) → {String}

Reverses the specified text.

Parameters:

Name	Type	Description
`text`	String	Text to reverse.

Returns:

Reversed text.

Type: String

(static) rgbToHex(red, green, blue) → {String}

Converts the rgb color to a hexadecimal string.

Parameters:

Name	Type	Description
`red`	Number	0-255 numeric value.
`green`	Number	0-255 numeric value.
`blue`	Number	0-255 numeric value.

Returns:

The hex value.

Type: String

(static) rgbToHsv(r, g, b) → {Array.<Number>}

Converts the rgb value to hsv.

Parameters:

Name	Type	Description
`r`	Number	The red value 0-255.
`g`	Number	The green value 0-255.
`b`	Number	The blue value 0-255.

Returns:

The hue saturation value.

Type: Array.<Number>

(static) roundNumber(value, precision, roundingopt) → {Number}

Rounds the number with the specified rounding type and precision.

Parameters:

Name	Type	Attributes	Description
`value`	Number		Numeric value.
`precision`	Number		Amount of decimal places.
`rounding`	String	<optional>	Type of decimal rounding (round (default), floor or ceil).

Returns:

Rounded numeric value.

Type: Number

(static) scrollTo(element, scrollElementopt, typeopt, animationSettingsopt)

Scrolls to the vertical or horizontal position of the specified element.

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element to scroll to.
`scrollElement`	HTMLElement	<optional>	A parent scroll element.
`type`	Number	<optional>	A value indicating if scrolling should be vertical (0), horizontal (1) or vertical & horizontal (2).
`animationSettings`	componyx.library.animationSettings	<optional>	Animation settings for the scroll effect.

(static) scrollableRoot() → {HTMLElement}

Detects and returns the scrollable root element.

Returns:

The scrollable root element.

Type: HTMLElement

(static) selectTextRange(element, start, lengthopt)

Selects a range of characters within the element.

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element.
`start`	Number		Start index of selection.
`length`	Number	<optional>	Selection length.

(static) selectable(settings) → {componyx.library.SelectableController}

Enables the element(s) within a specified zone to be selectable.

Parameters:

Name	Type	Description
`settings`	componyx.library.SelectableSettings	The settings which configure the select behaviour.

Returns:

An Object to control the selectable behaviour.

Type: componyx.library.SelectableController

(static) setCssRule(styleSheet, ruleIndex, selector, style, updateopt) → {Number}

Inserts, updates or removes a CSS rule in the specified styleSheet.

Parameters:

Name	Type	Attributes	Description
`styleSheet`	CSSStyleSheet		The styleSheet in which the rule will be added, updated or removed.
`ruleIndex`	Number		The position index for the rule within the styleSheet. Required if the selector parameter is not specified.
`selector`	String \| RegExp		Specify either the selector text for a new CSS rule or a matching text/regex for finding an existing CSS rule.
`style`	String		The CSS style value or null to remove the rule.
`update`	Boolean	<optional>	A value indicating if the style of the matching rule should be set (default) or updated.

Returns:

The position index of the rule within the styleSheet.

Type: Number

(static) setPos(element, pagePos, keepMarginopt)

Sets the position coordinates of the specified element so that it matches the specified position on the page (NOT relative to a parent element).

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element.
`pagePos`	Object		The horizontal and/or vertical position in pixels specified via the object keys top, right, bottom of left.
`keepMargin`	Boolean	<optional>	Defines if specified element margins must be preserved.

(static) setStyle(element, style)

Sets the style text of an element.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.
`style`	String	Style text.

(static) setText(element, text)

Sets the text or value of a DOM element/node.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element/node.
`text`	String	Text content.

(static) sibling(node, previousopt, nodeTypeopt, parentElementopt, skipEmptyopt) → {Node}

Gets the next or previous sibling of the specified node.

Parameters:

Name	Type	Attributes	Description
`node`	Node		The start node.
`previous`	Boolean	<optional>	A value indicating if the previous node is retrieved instead of the next.
`nodeType`	Number	<optional>	A node type value to retrieve the first sibling occurence of this node type, by default any node type is retrieved.
`parentElement`	HTMLElement	<optional>	Only siblings within the specified parent element are retrieved.
`skipEmpty`	Boolean	<optional>	A value indicating if empty siblings must be skipped.

Returns:

The next or previous sibling node or null if there is none.

Type: Node

(static) size(element, includeMarginopt) → {componyx.library.Dimensions}

Returns the full size of an element, including the border, padding and optional margin sizes.

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element.
`includeMargin`	Boolean	<optional>	A value indicating if element margin sizes must be included.

Returns:

An object describing the width and height sizes.

Type: componyx.library.Dimensions

(static) slide(element, out, effect, direction, fade, onComplete) → {function}

Performs a slide transition effect to reveal an element by creating a clipping mask, applying animation classes, and then removing the mask upon completion.

Parameters:

Name	Type	Default	Description
`element`	HTMLElement		The target element to animate.
`out`	boolean	false	If true, performs a slide/reveal OUT effect; otherwise, performs a slide/reveal IN effect.
`effect`	string	'slide'	The type of effect to use; expected values are "slide" or "reveal".
`direction`	string	'right'	The direction of the animation (e.g., "left", "right", "up", "down").
`fade`	boolean	false	If true, the effect will include a fade transition.
`onComplete`	function		Callback invoked when the transition completes.

Returns:

abort - Function to abort the animation; pass false to abort without firing onComplete.

Type: function

(static) startsWith(text, prefix, ignoreCase) → {Boolean}

Checks if the text strats with the specified prefix.

Parameters:

Name	Type	Description
`text`	String
`prefix`	String
`ignoreCase`	Boolean	Defines if the comparison should be case-insensitive.

Returns:

Returns true if the text staats with the specified prefix, otherwise false.

Type: Boolean

(static) styleValue(element, property, computed) → {String}

Retrieves the current inline or computed value of a style property.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.
`property`	String	Style property name in camelcase (backgroundColor) or separated by hyphens (background-color).
`computed`	Boolean	Defines if only a computed style value should be retrieved.

Returns:

The element style.

Type: String

(static) surround(element, content) → {HTMLElement}

Surrounds the content with the specified element.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element to make parent of the specified content.
`content`	Node \| DocumentFragment	The content node(s) to surround with the specified element.

Returns:

The specified element.

Type: HTMLElement

(static) textSelection(element) → {componyx.library.Toggle}

Creates and returns an object for disabling and enabling text selection for the specified element and underlaying elements.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.

Returns:

An object to control the text selection behaviour.

Type: componyx.library.Toggle

(static) toggleClass(element, cssClass)

Toggles between css class(es) by removing the class if it's already defined on the element and otherwise adding it.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element.
`cssClass`	String	Name of the css class or classes separated by a space.

(static) trim(text) → {String}

Removes leading and trailing white space characters, new lines and tabs from the specified string.

Parameters:

Name	Type	Description
`text`	String	Text to trim.

Returns:

the trimmed text.

Type: String

(static) type(obj) → {String}

Gets the type of the object.

Parameters:

Name	Type	Description
`obj`	Object	The Object to check.

Returns:

Returns the object type as string.

Type: String

(static) unit(value, unit) → {String}

Adds the specified unit or the default 'px' unit to the value if the unit is missing.

Parameters:

Name	Type	Description
`value`	String	Nummeric value.
`unit`	String	Css unit.

Returns:

The value with the specified or default unit.

Type: String

(static) unsurround(element) → {HTMLElement}

Replaces itself for it's child nodes.

Parameters:

Name	Type	Description
`element`	HTMLElement	The element to replace.

Returns:

The replaced element.

Type: HTMLElement

(static) updateStyle(style, text)

Updates the CSS style declaration of an HTMLElement or Stylesheet. Empty style properties are removed.

Parameters:

Name	Type	Description
`style`	CSSStyleDeclaration	The current style.
`text`	String	The style text with which the current style is updated.

(static) visible(element, containeropt) → {Boolean}

Checks if an element is visible.

Parameters:

Name	Type	Attributes	Description
`element`	HTMLElement		The element to check.
`container`	HTMLElement	<optional>	If specified the visibility style on the element's parents within the container are checked.

Returns:

A value indicating if the element is visible.

Type: Boolean

(static) ws(settings) → {WebSocket}

Creates a full-duplex WebSocket TCP connection.

Parameters:

Name	Type	Description
`settings`	componyx.library.wsSettings	The settings which configure the WebSocket (view wsSettings).

Returns:

The WebSocket object.

Type: WebSocket

(static) xhr(settings) → {componyx.library.XhrWrappedResult}

Executes an XMLHTTP (AJAX) request.

Parameters:

Name	Type	Description
`settings`	componyx.library.xhrSettings	The settings which configure the xhr request (view xhrSettings).

Returns:

An object wrapped around the xhr object.

Type: componyx.library.XhrWrappedResult

Type Definitions

BorderPaddingSizes

Type:

Object

Properties:

Name	Type	Description
`width`	number	Total padding and border width.
`height`	number	Total padding and border height.
`borderTop`	number	The width of the top border.
`borderRight`	number	The width of the right border.
`borderBottom`	number	The width of the bottom border.
`borderLeft`	number	The width of the left border.
`paddingTop`	number	The width of the top padding.
`paddingRight`	number	The width of the right padding.
`paddingBottom`	number	The width of the bottom padding.
`paddingLeft`	number	The width of the left padding.

BorderSizes

Type:

Object

Properties:

Name	Type	Description
`borderTop`	number	The width of the top border.
`borderRight`	number	The width of the right border.
`borderBottom`	number	The width of the bottom border.
`borderLeft`	number	The width of the left border.

Dimensions

Type:

Object

Properties:

Name	Type	Description
`width`	number	The width value.
`height`	number	The height value.

DraggableController

Type:

Object

Properties:

Name	Type	Description
`element`	HTMLElement	The specified HTMLElement.
`settings`	Object	The specified settings.
`disabled`	Boolean	A value indicating if the draggable functionality is disabled.
`enable`	function	Enables the specified element to be draggable.
`disable`	function	Disables the specified element to be draggable.
`startDrag`	function	Starts the dragging.
`endDrag`	function	Ends the dragging.

DraggableSettings

Type:

Object

Properties:

Name	Type	Default	Description
`dragHandle`	HTMLElement		The handle which activates dragging.
`dragGhost`	HTMLElement		Visible element when dragging.
`boundaryZone`	HTMLElement		Defines the drag boundaries.
`dropZones`	Array.<HTMLElement> \| function		A static array of drop zone elements or a function that returns a list of drop zone elements where the draggable element is allowed to be dropped.
`dropAcceptMode`	Number \| String		Defines how much overlap is required to accept the dropping. 0: full 1: half 2: touch
`ghostOnly`	Boolean		Defines that only the ghost element must be visible when dragging.
`autoGhostSize`	Boolean		A value indicating if the element size should be applied to the ghost element.
`allowDropOutZone`	Boolean		A value indicating if the draggable element can be dropped outside of a drop zone.
`moveOriginal`	Boolean	true	A value indicating if the original element is moved when a drag ghost is used and the drag operation ends.
`dragX`	Boolean	true	A value indicating if horizontal dragging is allowed.
`dragY`	Boolean	true	A value indicating if vertical dragging is allowed.
`scrollX`	Boolean		A value indicating if the drag element activates horizontal scrolling on the boundary zone when the drag element hits the left or right of the boundary zone.
`scrollY`	Boolean		A value indicating if the drag element activates vertical scrolling on the boundary zone when the drag element hits the top or bottom of the boundary zone.
`minDragX`	Number		Minimum change in pixels before the horizontal dragging starts.
`minDragY`	Number		Minimum change in pixels before the vertcial dragging starts.
`tickX`	Number		Horizontal tick size.
`tickY`	Number		Vertical tick size.
`boundaryOvershootLeft`	Number		Defines how many extra pixels the boundary zone may be exceeded (or limited) on the left side.
`boundaryOvershootRight`	Number		Defines how many extra pixels the boundary zone may be exceeded (or limited) on the right side.
`boundaryOvershootTop`	Number		Defines how many extra pixels the boundary zone may be exceeded (or limited) on the top side.
`boundaryOvershootBottom`	Number		Defines how many extra pixels the boundary zone may be exceeded (or limited) on the bottom side.
`ignoreBoundaryBorders`	Boolean		Defines a value indicating if the borders of the boundary zone are ignored in the boundary calculations.
`ignoreMargins`	Boolean		Defines a value indicating if drag element margins are ignored in the boundary calculations.
`dragClass`	String		CSS class applied to the element when dragging.
`droppableClass`	String		CSS class applied to the element and dropzone when the element is droppable.
`dropClass`	String		CSS class applied to the element and dropzone when the element is dropped.
`cancelDrag`	Boolean		A value indicating if the the drag operation is canceled before it starts. If needed, set this value in the onDragStart event.
`onDragStart`	function		Event callback method.
`onDrag`	function		Event callback method.
`onDragEnd`	function		Event callback method.
`onDroppableEnter`	function		Event callback method.
`onDroppable`	function		Event callback method.
`onDroppableLeave`	function		Event callback method.
`onDrop`	function		Event callback method.

EachCallback(item, index, object, args, next) → {void}

Callback for iteration.

Parameters:

Name	Type	Description
`item`	Object	The current item in the iteration.
`index`	number \| string	The current array index or object key.
`object`	Object \| Array.<Object>	The object that is being iterated.
`args`	Object	The initial arguments that were provided with the 'each' method call.
`next`	function	A callback function to retrieve the next item from the iteration.

Returns:

Type: void

MarginSizes

Type:

Object

Properties:

Name	Type	Description
`top`	number	The width of the top margin.
`right`	number	The width of the right margin.
`bottom`	number	The width of the bottom margin.
`left`	number	The width of the left margin.
`width`	number	The width of the left and right margin.
`height`	number	The width of the top and bottom margin.

PaddingSizes

Type:

Object

Properties:

Name	Type	Description
`paddingTop`	number	The width of the top padding.
`paddingRight`	number	The width of the right padding.
`paddingBottom`	number	The width of the bottom padding.
`paddingLeft`	number	The width of the left padding.

Position

Type:

Object

Properties:

Name	Type	Description
`top`	number	The top position.
`right`	number	The right position.
`bottom`	number	The bottom position.
`left`	number	The left position.

ResizableController

Type:

Object

Properties:

Name	Type	Description
`element`	HTMLElement	The specified HTMLElement.
`settings`	Object	The specified
`disabled`	Boolean	A value indicating if the resizable functionality is disabled.
`enable`	function	Enables the specified element to be resizable.
`disable`	function	Disables the specified element to be resizable.

ResizableSettings

Type:

Object

Properties:

Name	Type	Description
`resizeHandles`	Object	Resize handle object (key, value). key: resize direction s, e or se. value: HTMLElement.
`resizeGhost`	HTMLElement	Visible element when resizing.
`boundaryZone`	HTMLElement	Defines the resize boundaries.
`defaultHandles`	Boolean	Defines if default resize handles are applied.
`ghostOnly`	Boolean	Defines that only the ghost element must be visible when resizing.
`minResizeX`	Number	Minimum change in pixels before the horizontal resizing starts.
`minResizeY`	Number	Minimum change in pixels before the vertcial resizing starts.
`tickX`	Number	Horizontal tick size.
`tickY`	Number	Vertical tick size.
`resizeClass`	String	CSS class applied to the element when resizing.
`onResizeStart`	function	Event callback method.
`onResize`	function	Event callback method.
`onResizeEnd`	function	Event callback method.

ScrollPos

Type:

Object

Properties:

Name	Type	Description
`scrollTop`	number	The scroll top value.
`scrollLeft`	number	The scroll left value.

SelectableController

Type:

Object

Properties:

Name	Type	Description
`element`	HTMLElement	The specified HTMLElement.
`settings`	Object	The specified settings.
`disabled`	Boolean	A value indicating if the selectable functionality is disabled.
`enable`	function	Enables the selectability for all elements in the list of selectable elements.
`disable`	function	Disables the selectability for all elements in the list of selectable elements.
`update`	function	Updates the list of selectable elements and removes event bindings for previous selectable elements.
`deselect`	function	Deselects all selected element(s) from the list of selectable elements. Optional argument: A Boolean value indicating if the select event should fire.
`select`	function	Selects all element(s) from the list of selectable elements. Optional argument: A Boolean value indicating if the select event should fire.
`getSelectable`	function	Returns an array of all selectable elements in the following format: at index [0]: element, at index [1]:bounding client rectangle.
`getSelection`	function	Returns an array of all selected elements.

SelectableSettings

Type:

Object

Properties:

Name	Type	Description
`dragZone`	HTMLElement	Defines the zone from where a drag select can be started.
`selectZone`	HTMLElement	Defines the zone with selectable elements.
`include`	Array.<HTMLElement>	Elements to include (by default all child elements of the selectZone are included).
`exclude`	Array.<HTMLElement>	Elements to exclude. Setting is ignored if elements are explicitly specified with the include setting.
`includeTags`	String	Space separated list of tags to include. Setting is ignored if elements are explicitly specified with the include setting.
`excludeTags`	String	Space separated list of tags to exclude. Setting is ignored if elements are explicitly specified with the include setting.
`liveUpdate`	Boolean	When set to true the onSelect event is fired while dragging otherwise the event is fired when the drag selection ends.
`clearOnOutsideClick`	Boolean	Indicates if the selection should be cleared on a click outside the dragZone.
`toggleDragSelect`	Boolean	Deselects the selected element(s) on a drag select.
`toggleClickSelect`	Boolean	Deselects the selected element(s) on a click select.
`appendDragSelect`	Boolean	Appends the current selection on a drag select.
`appendClickSelect`	Boolean	Appends the current selection on a click select.
`shiftSelect`	Boolean	Defines if shift key selection is enabled.
`ctrlSelect`	Boolean	Defines if ctrl key selection is enabled.
`scrollOffsetX`	Number	Defines the horizontal scroll offset within the dragZone.
`scrollOffsetY`	Number	Defines the vertical scroll offset within the dragZone.
`selectMode`	Number \| String	0: drag_click 1: drag 2: click
`dragSelectionClass`	String	CSS class of the drag selection.
`selectedClass`	String	CSS class applied to the element when selected.
`onDragStart`	function	Event callback method.
`onDrag`	function	Event callback method.
`onDragEnd`	function	Event callback method.
`onSelect`	function	Event callback method.

Toggle

Type:

Object

Properties:

Name	Type	Description
`enable`	function	Enables the functionality.
`disable`	function	Disables the functionality.

Viewport

Type:

Object

Properties:

Name	Type	Description
`top`	Boolean	Defines if the top of the element is visible.
`right`	Boolean	Defines if the right of the element is visible.
`bottom`	Boolean	Defines if the bottom of the element is visible.
`left`	Boolean	Defines if the left of the element is visible.
`visible`	Boolean	Defines if the element is partially visible.
`full`	Boolean	Defines if the element is fully visible.

XhrAbortFunction(stopRepeat) → {void}

A function to abort the active xhr request.

Parameters:

Name	Type	Description
`stopRepeat`	boolean	Stops the repeating xhr call cycle when a repeatInterval was specified in the xhr settings.

Returns:

Type: void

XhrCallback(args) → {void}

Callback for xhr events.

Parameters:

Name Type Description

args

Object

An object used as argument for XHR callbacks.

Properties

Name	Type	Description
`xhr`	XMLHttpRequest	The xhr object.
`settings`	componyx.library.xhrSettings	The settings of the xhr.
`data`	Object	The response data.
`timeout`	boolean	A value indicating if the request timed out.
`event`	ProgressEvent	A progress event (onProgress and onUploadProgress).

Returns:

Type: void

XhrWrappedResult

Type:

Object

Properties:

Name	Type	Description
`xhr`	XMLHttpRequest	The xhr object.
`settings`	Object	The initial settings object.
`abort`	componyx.library.XhrAbortFunction	A method to abort the running xhr request. Different to xhr.abort() in that it will also abort a repeating call specified with settings.repeatInterval.

animationSettings

Global Animation settings.

Type:

Object

Properties:

Name	Type	Description
`duration`	Number	The duration of the animation.
`interval`	Number	The interval of the update function.
`easing`	String	The animation easing setting.
`easeBackOvershoot`	Number	Defines the easeBackOvershoot value for the easeBack method.
`onFrame`	function	A callback method which is called for every frame update.
`onStop`	function	A callback method which is called when the animation is stopped
`onComplete`	function	A callback method which is called when the animation is completed.

cssAnimationController

Handle returned by cssAnimation to control an in-progress CSS animation/transition.

Type:

Object

Properties:

Name	Type	Description
`abort`	function	Function to abort the animation by removing the animation class.
`complete`	function	Function to complete the animation by removing the animation class and firing the onComplete handler.

httpRequestHandlers

Global HTTP(S) request events for the following methods: xhr(), addCssSource() and addScriptSource().

Type:

Object

Properties:

Name	Type	Description
`onStart`	componyx.library.Event	Event which fires before an HTTP request.
`onComplete`	componyx.library.Event	Event which fires after an HTTP request.
`onSuccess`	componyx.library.Event	Event which fires when an HTTP request was successful (status 200).
`onError`	componyx.library.Event	Event which fires when an HTTP request returned an error.
`onAbort`	componyx.library.Event	Event which fires when an HTTP request is aborted.

wsSettings

Global WebSocket settings which apply to all WebSocket connections, unless overridden on the ws method call.

Type:

Object

Properties:

Name	Type	Description
`url`	String	Defines the uniform resource locator.
`binaryType`	String	A value indicating the type of binary data being transmitted by the connection. This should be either "blob" if DOM Blob objects are being used or "arraybuffer" if ArrayBuffer objects are being used.
`data`	String \| JSON	Defines the initial data to send when the WebSocket connection is opened or retrieved from the pool.
`pooling`	Boolean	Defines if only a single WebSocket connection can be opened per client and URL (true by default).
`onOpen`	function	Defines the callback function to call when the WebSocket connection is opened.
`onClose`	function	Defines the callback function to call when the WebSocket connection is closed.
`onMessage`	function	Defines the callback function to call when a message is received.
`onError`	function	Defines the callback function when a WebSocket error occurs.

xhrSettings

Global XMLHttpRequest (AJAX) settings which apply to all xhr requests, unless overridden on the xhr method call.

Type:

Object

Properties:

Name	Type	Description
`xhr`	XMLHttpRequest	Object instance to use for the xhr request.
`url`	String	Defines the uniform resource locator.
`data`	String \| Object \| FormData	Defines the data to send with the request as URL parameters or JSON String/Object.
`responseType`	String	Defines the type of the response.
`method`	String	Defines the HTTP request method (GET or POST). The setting requestMethod is supported for backwards compatibility.
`contentType`	String	Defines the HTTP request content type. The setting requestContentType is supported for backwards compatibility.
`headers`	Object	Defines the HTTP request headers (key value pair). The setting requestHeaders is supported for backwards compatibility.
`jsonResponseDataWrapper`	String	Defines the JSON response data wrapper. e.g. ASP.NET uses d as default data wrapper.
`jsonDeserializer`	function	Defines the custom JSON deserializer method.
`jsonParseWrappedDataString`	Boolean	Defines if the data within the JSON response data wrapper should be parsed again if it is of type String.
`async`	Boolean	Defines if the request is synchronous or asynchronous (default).
`timeout`	Number	Defines the timeout in milliseconds before the request is aborted.
`repeatInterval`	Number	Defines the interval in milliseconds between repeating xhr requests.
`onStart`	componyx.library.XhrCallback	Defines the callback function to call before the request.
`onComplete`	componyx.library.XhrCallback	Defines the callback function to call after the request.
`onSuccess`	componyx.library.XhrCallback	Defines the callback function to call when the request was successful.
`onError`	componyx.library.XhrCallback	the callback function to call when the HTTP request failed. (HTTP status >= 200 and < 300).
`onAbort`	componyx.library.XhrCallback	Defines the callback function to call when the request was aborted.
`onProgress`	componyx.library.XhrCallback	Defines the callback function to call when there is a change in the download progress.
`onUploadProgress`	componyx.library.XhrCallback	Defines the callback function to call when there is a change in the upload progress.
`onUploadError`	componyx.library.XhrCallback	Defines the callback function to call when the upload failed.