Giter VIP home page Giter VIP logo

jquery-rxjs-gestures's Introduction

rx-js-gestures

Unifying mouse and touch event gestures written in RxJS. Uses touch events if your device supports touch events, otherwise falls back to mouse events.

Unifies gesture names under a common API. For example, "touchstart" and "mousedown" map to "downAsObservable".

jQuery plugins:

// These decide what to listen for based on device support:
// An Observable that dispatches normalized `mousedown` or `touchstart` events.
$.fn.downAsObservable  = function(){}
// An Observable that dispatches normalized `mousemove` or `touchmove` events.
$.fn.moveAsObservable  = function(){}
// An Observable that dispatches normalized `mouseup` or `touchend` events.
$.fn.endAsObservable   = function(){}
// An Observable that dispatches normalized `mousedown` or `touchstart` events after an activation time
// and assuming the pointer device didn't move outside the radius defined by `distance` ({x: num, y: num })
// during activation time. Distance defaults to {x: 10, y: 10}.
$.fn.pressAsObservable = function(activation_time, distance){}
// An Observable that dispatches normalized `mousedown` or `touchdown` events that have corresponding
// `mouseup` or `touchend` events dispatched before the timeout_time and assuming the corresponding `end`
// event occurred within the radius defined by `distance` ({x: num, y: num}).
// Distance defaults to {x: 10, y: 10}.
$.fn.tapAsObservable   = function(timeout_time, distance){}
// An Observable that dispatches normalized `mousemove` or `touchmove` events after a press event
// with an optional activation_time and distance.
// Completes when the pointer is released.
$.fn.dragAsObservable  = function(activation_time, distance){}
// An Observable that dispatches the last normalized `mousemove` or `touchmove` event of a registered
// drag target dropped on him.
$.fn.dropAsObservable  = function(){}

Additions to the Rx.Observable prototype:

// Publishes the drag Observable, listening for when it completes.
// On completion, checks the list of drop targets to see if the
// item was dropped on one of them.
rx.registerDrag  = function(target, type, data){}
// Moves the target following the dispatched drag events.
rx.doDragActions = function(target, classnames){}

jquery-rxjs-gestures's People

Contributors

trxcllnt avatar

Stargazers

paling avatar Sunny Gonnabathula avatar Andrew Eberbach avatar Sam Macpherson avatar Claudia Doppioslash avatar Nazeeruddin Ikram avatar Denis Stoyanov avatar Søren Engel avatar John avatar Brad Pillow avatar j-j.eth avatar John Yanarella avatar

Watchers

 avatar paling avatar James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.