JSPM

dom-mousemove-dispatcher

1.0.1
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 72961
  • Score
    100M100P100Q170504F
  • License MIT

Fire a mousemove on the DOM

Package Exports

  • dom-mousemove-dispatcher

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (dom-mousemove-dispatcher) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Install

npm install --save dom-mousemove-dispatcher

Use rollup, browserify, or some other compiler to use this library.

Example

import mouseMoveDispatcher from 'dom-mousemove-dispatcher';

const dispatcher = mouseMoveDispatcher(window);

let div = document.querySelector('div')

div.addEventListener('mousemove', (e)=>{
    //This event might have been dispatched by the dispatcher.
    console.log(
        'mouse moving dispatched = ',e.dispatched,
        ' event =', e,
        ' data =', e.data
    );
});

div.addEventListener('mousemove', (e)=>{
    if(e.data === 'myEvent'){
        //The event was dispatched from this listener.
        //To prevent infinite recursion don't refire until the next turn in the event loop.
        e.stopPropagation();
        return;
    }
    //Re-dispatch this event.
    dispatcher.dispatch(div, e, 'myEvent');
});

//Dispatch an event with a clientX property.
setTimeout(()=>dispatcher.dispatch(div, {clientX: 500}), 1000);

The Event Object

The event object you get from firing a mousemove with dom-mousemove-dispatcher has additional properties set on it. These are:

  • event.dispatched = "mousemove"
  • event.data = Your data

mouseMoveDispatcher(object) -> dispatcher

Create a mousemove dispatcher that uses object to set the default properties on move.

object can be anything that can have mousemove set through it's addEventListener method (window, body, p, div, ...).

dispatcher.dispatch(element, eventProps, data|undefined) -> cancelled

Dispatch a mousemove event.

element is the DOM element you wish to fire the mousemove on.

eventProps are the properties you want to add to the event.

The optional data parameter is an arbitrary javascript value that will be set on a data property on the mousemove event object.

dispatcher.destroy() -> undefined

Cleanup the dispatcher object events, and properties.

About

dom-mousemove-dispatcher is a ponyfill for mousemove event dispatch that is optimized for quick firing of mousemove.

Please report any bugs you find.