tap点击逻辑

零时文件

require.config({
    paths: {
        zepto: 'zepto.min'
    }
});
define(['zepto'], function ($) {
    var d = {
        SWIPE_DISTANCE: 20, //移动30px之后才认为swipe事件
        SWIPE_TIME: 500, //
        positions: [],
        getId: function (ele) {
            return $(ele).attr('id')
        },
        getTouchPos: function (e) {
            var touches = e.touches;
            if (touches && touches[0]) {
                return {
                    x: touches[0].clientX,
                    y: touches[0].clientY
                };
            }
            return {x: e.clientX, y: e.clientY};
        },
        //计算两点之间距离
        getDist: function (p1, p2) {
            if (!p1 || !p2) return 0;
            return Math.sqrt((p1.x - p2.x) * (p1.x - p2.x) + (p1.y - p2.y) * (p1.y - p2.y));
        },
        //计算两点之间所成角度
        getAngle: function (p1, p2) {
            var r = Math.atan2(p2.y - p1.y, p2.x - p1.x);
            var a = r * 180 / Math.PI;
            return a;
        },
        //获取swipe的方向
        getSwipeDirection: function (p2, p1) {
            var dx = p2.x - p1.x;
            var dy = -p2.y + p1.y;
            console.log('p2.y', p2.y, 'p1.y', p1.y);
            console.log(dx, dy);
            var angle = Math.atan2(dy, dx) * 180 / Math.PI;
            if (angle < 45 && angle > -45) {
                return "right";
            }
            if (angle >= 45 && angle < 135) {
                return "top";
            }
            if (angle >= 135 || angle < -135) return "left";
            if (angle >= -135 && angle <= -45) return "bottom";
        },
        touchStart: function (e) {
            //console.dir(e);
            //console.log($(this).parent('li').attr('id'));
            //console.log(app.pos)
            var id = d.getId($(this));
            d.positions[id] = {
                point_start: d.getTouchPos(e),
                time_start: Date.now()
            };
            //console.log(d.positions)
            //
            //console.log(d.positions['1'])
            //app.pos.push()
        },
        touchMove: function (e) {
            //console.dir(e)
            var id = d.getId($(this));
            d.positions[id]["point_end"] = d.getTouchPos(e)
            //console.dir(d.positions['1']['point_end'])
            //e.preventDefault();
        },
        touchEnd: function (e) {
            var id = d.getId($(this));
            //console.dir(e);
            d.positions[id]["time_end"] = Date.now();
            console.log(d.getDist(d.positions[id]['point_start'], d.positions[id]['point_end']))
            if (d.getDist(d.positions[id]['point_start'], d.positions[id]['point_end']) > d.SWIPE_DISTANCE) {
                //&&  d.positions[id]['time_end'] - d.positions[id]['time_start'] > d.SWIPE_TIME) {
                var dir = d.getSwipeDirection(d.positions[id]['point_end'], d.positions[id]['point_start']);
                console.log(dir);
            } else if (d.positions[id]['time_end'] - d.positions[id]['time_start'] < d.SWIPE_TIME) {
                console.log('click')
                location.href='https://www.baidu.com';
            } else {
                console.log('click long time')
            }
            console.log(d.positions[id]);
        },
        init: function () {
            var self = this;
            //var p = self.pos;
            $('li').bind('touchstart', self.touchStart);
            $('li').bind('touchmove', self.touchMove);
            $('li').bind('touchend', self.touchEnd);
        }
    }
    return d;
    //console.log($("div"))
});