Simple Touch Library 1.0.1

by moob

HTML

<div id="test">
<strong id="testEvent">
    Touch me baby...
</strong>
<div id="testData">

</div>
</div>

CSS

html, body {
    margin:0;
}
#test {
    width: 100%;
    min-width:100%;
    max-width:100%;
    max-height:100%;
    height:200px;
    padding:20px;
    background-color:#ccc;
    overflow:hidden;
}
#testEvent, #testData {pointer-events:none;}
#test strong {font-family:sans-serif}
#test em {color:#fff; font-style:normal; font-size:1.2em; text-decoration:none; text-shadow:0px 0px 3px black;}

JavaScript

/* Simple Touch Library 1.0.1 */
(function ($) {
    
   var ePos = function(e){
       var oe = (e.originalEvent && e.originalEvent.touches) ? e.originalEvent.touches[0] : e;
       return {x:oe.pageX, y:oe.pageY};
   };
    
    $.fn.touchListener = function (options) {
        var settings = $.extend({
            swipeSpeedThreshold: 0.6, //drag speed in px per ms before it can be considered a swipe
            swipeDistanceThreshold: 100, //distance stroked in px before it can be considered a swipe
            strokeDistanceThreshold: 4, //minimum distance moved before it can be considered a stroke (so that minor wobbles are not taken as strokes)
            complete: null //function callback on complete
        }, options);
        
        return this.each(function () {
            var el = $(this),
                touchstarted = false,
                ori={x:0,y:0},
                pos={x:0,y:0},
                deg=-1,
                dir='',
                startTime = 0,
                endTime = 0,
                split = 0,
                dur = 0,
                spd = 0,
                directionDistance = 0,                    
                dist={x:0,y:0,dd:directionDistance},
                touchdata = {state:'listening',
                             origin:ori,
                             position:pos,
                             distance:dist,
                             degrees:deg,
                             direction:dir,
                             duration:dur,
                             speed:spd
                            };

            
            
            el.on('touchstart mousedown', function(e){
                touchstarted=true;
                pos = ePos(e);
                ori = pos,
                startTime = new Date().getTime();
                touchdata = {
                    state:'touchstart',
                    origin:ori,
                    position:pos,
                    distance:dist,
           ...