dragScroll.js 1.54 KB
angular.module('dragScroll', []).directive('dragScroll', function () {
    return {
        restrict: 'A',
        link: function (scope, elem) {
            var curPos = 0,
                momentum = 0,
                curDown = false,
                timestamp;

            elem = elem[0];

            elem.addEventListener('mousemove', function (e) {
                if (curDown === true) {
                    elem.scrollLeft += momentum = curPos - (curPos = e.pageX);
                }
            });

            elem.addEventListener('mousedown', function (e) {
                curDown = true;
                curPos = e.pageX;
                momentum = 0;

                e.preventDefault();
            });

            elem.addEventListener('mouseup', mouseup);
            elem.addEventListener('mouseleave', mouseup);

            elem.addEventListener('click', function (e) {
                if (momentum) {
                    e.preventDefault();
                }
            });

            function mouseup(e) {
                curDown = false;

                timestamp = Date.now();

                window.requestAnimationFrame && window.requestAnimationFrame(autoScroll);
            }

            function autoScroll() {
                var elapsed = Date.now() - timestamp;
                var delta = momentum * Math.exp(-elapsed / 250);

                elem.scrollLeft += delta;

                if (delta > 1 || delta < -1) {
                    window.requestAnimationFrame(autoScroll);
                }
            }
        },
    };
});