Socket
Socket
Sign inDemoInstall

pointer-event

Package Overview
Dependencies
0
Maintainers
1
Versions
18
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

pointer-event

Event Controller for mouse and touch interfaces


Version published
Maintainers
1
Weekly downloads
412
decreased by-4.85%

Weekly downloads

Readme

Source

PointerEvent

Event Controller for mouse and touch interfaces

Usage

var pointerEvent = new PointerEvent(),

  // startHandlerId which is used for adding/removing to element is returned.
  startHandlerId = pointerEvent.regStartHandler(function(pointerXY) {
    console.log('[START]');
    console.dir(pointerXY); // Object having `clientX` and `clientY`.
    this.options.stopPropagation = false; // Access to current instance via `this`.
    return true; // If it returns `false`, the starting is canceled.
  });

// When `mousedown` or `touchstart` is fired on this element, the registered start-handler is called.
pointerEvent.addStartHandler(document.getElementById('trigger'), startHandlerId);

// When `mousemove` or `touchmove` is fired on this element, this move-handler is called.
// By default, the handler is called via `requestAnimationFrame`. `true` for third argument disables this.
pointerEvent.addMoveHandler(document, function(pointerXY) {
  console.log('[MOVE]');
  console.dir(pointerXY); // Object having `clientX` and `clientY`.
  this.options.stopPropagation = false; // Access to current instance via `this`.
}/*, true */);

// When `mouseup` or `touchend` is fired on this element, this end-handler is called.
pointerEvent.addEndHandler(document, function(pointerXY) {
  console.log('[END]');
  console.dir(pointerXY); // Object having `clientX` and `clientY`.
  this.options.stopPropagation = false; // Access to current instance via `this`.
});

// When `touchcancel` is fired on this element, this cancel-handler is called.
pointerEvent.addCancelHandler(document, function() {
  console.log('[CANCEL]');
  console.log(this.options.stopPropagation); // Access to current instance via `this`.
});

// ============================================================================

document.getElementById('move-button').addEventListener('click', function() {
  // Emulate the `move` that is done when `mousemove` or `touchmove` is fired.
  pointerEvent.move(); // pointerXY can be passed.
}, false);

document.getElementById('end-button').addEventListener('click', function() {
  // Emulate the `end` that is done when `mouseup` or `touchend` is fired.
  pointerEvent.end(); // pointerXY can be passed.
}, false);

document.getElementById('cancel-button').addEventListener('click', function() {
  // Emulate the `cancel` that is done when `touchcancel` is fired.
  pointerEvent.cancel();
}, false);

// ============================================================================

// Remove the added start-handler from this element.
pointerEvent.removeStartHandler(document.getElementById('trigger'), startHandlerId);

// Unregister the registered start-handler.
pointerEvent.unregStartHandler(startHandlerId);

// ============================================================================

// Options:
// preventDefault {boolean} [true] - Call `event.preventDefault()` if it is `true`.
// stopPropagation {boolean} [true] - Call `event.stopPropagation()` if it is `true`.
var pointerEvent = new PointerEvent({stopPropagation: false}); // Don't call that.

// ============================================================================

// addEventListener with specific option.
PointerEvent.addEventListenerWithOptions(target, type, listener, options);

// Emulate `click` event via `touchend` event.
// Default emulator is disabled by `event.preventDefault()`.
// Also, this has to be called before attaching listeners that call `event.preventDefault()` (e.g. `addStartHandler()`).
PointerEvent.initClickEmulator(element, moveTolerance, timeTolerance);
// `Event` object that is passed to listeners has `emulated` property that is `true`.

// Emulate `dblclick` event via `touchend` event.
// Default emulator is disabled by `event.preventDefault()`.
// Also, this has to be called before attaching listeners that call `event.preventDefault()` (e.g. `addStartHandler()`).
PointerEvent.initDblClickEmulator(element, moveTolerance, timeTolerance);
// `Event` object that is passed to listeners has `emulated` property that is `true`.

FAQs

Last updated on 17 Jun 2022

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc