Odo Pointer

An abstraction for pointer, mouse, and touch events.

Support

IE9+

Dependencies

Odo Device, Odo Helpers, Tiny Emitter

Odo Pointer also expects Object.assign from ES6 to be available.

X Axis

The pointer class normalizes [single] pointer, mouse, and touch events to a single event with augmented data.

let horizontal = new OdoPointer(document.getElementById('field-x'), {
  axis: OdoPointer.Axis.X,
});

There are 3 different events which you can listen for, START, MOVE, and END. OdoPointer inherits from TinyEmitter which adds the following methods: on, once,off, and emit.

horizontal.on(OdoPointer.EventType.END, function (evt) {
  console.log(evt); // PointerEvent...
});

You can also call evt.preventDefault() on the START event to prevent Odo Pointer from adding drag handlers (basically ignoring the event). Calling preventDefault in the END event will tell Odo Pointer to call preventDefault on the native touch/mouse/pointer end event.

Y Axis

Using the Y axis will block scrolling on touch devices. Use wisely!

let vertical = new OdoPointer(document.getElementById('field-y'), {
  axis: OdoPointer.Axis.Y,
});

Both Axis

Using both axis in the pointer will block scrolling on touch devices. Be careful!

The default axis is both.

let both = new OdoPointer(document.getElementById('field-xy'));