Last change: October 4, 2019

Current version: 1.5.4

The module response to a DOM event, ie a click or hover, and sends the event data to the callback function.

syntax

webanizr.collect('domEvent', parameters, callback)

parameters

The callApi module the following parameters:

type__event (required)

The type of event what should trigger the module. The following options are supported:

• anyclick (alias of auxclick)
• auxclick
• blur
• bodyscroll
• click
• contextmenu
• copy
• cut
• dblclick
• dragend
• dragleave
• dragover
• dragstart
• drop
• error
• focus
• fullscreenchange (app function)
• hover (alias of mouseover)
• keydown
• keypress
• keyup
• load
• mousedown
• mouseenter
• mouseleave
• mousemove
• mouseout
• mouseup
• mouseover
• offline (app function)
• online (app function)
• paste
• press (mousedown + touch press)
• release (mouseup + touch release)
• resize (app function)
• scroll (app function)
• touchend
• touchmove
• touchstart
• select
• wheel

query__selector (required for non app functions)

The query selector that points to the elements where the module should attach listeners for events to. Examples:

• #myelement (single element with id myelement)
• .myclass (all elements with the class myclass)
• #myelement p (all paragraphs in myelemen)

id__event (optional)

Setting an id on an event prevents it from being assigned multiple times to the same node. The value of this parameter should only consists of letters and numbers. It also is needed if you want to remove this event.

id__debounce (optional)

If the id__debounce is set, it waits for 500 miliseconds before it triggers the event. If the event is triggered before the 500 miliseconds are over, the counter resets and the module waits another 500 miliseconds. This helps triggering the event to many times, i.e. with the keyup in a textfield when someone is typing. The id__debounce should have an unique value for each assigned event.

event__remove (optional)

If set to true, the event will be removed instead of added. It requires the same parameters used when adding the event, including the type__event and id__event.

callback

This callback function is called when the DOM event is fired. The data of the event is send to the callback function. The data contains the following attriutes:

• pressed__altKey : true if the ALT key was pressed when the event was fired
• pressed__ctrlKey : true if the CTRL key was pressen when the event was fired
• pressed__shiftKey : true if the Shif key was pressed when the event was fired
• source__event : the source element that triggered the event
• target__event : the element that was targeted by the event
• timestamp__event : the timestamp on which the event occured
• type__event : the type of event (ie. click or mouseover)

demo

https://cdn.cpmodules.webanizr.com/demo/dom-events/index.html

 

Changelog

• October 4, 2019: 1.5.4 - scroll now attaches to elements instead of the document
• September 18, 2019: 1.5.1 - solved problems with multiple callbacks when added mulitple different listeners
• September 16, 2019: 1.5.0 - listener__event works properly for 'dragover' and 'dragend'.