$.fn.draggableXYE = function(options) {
    var defaultOptions = {
        distance: 5,
        dynamic: false
    };
    options = $.extend(defaultOptions, options);
    
    // ADDED: Store startPosition for reverting
    var startPosition = this.position();

    // ADDED: Function to apply easing to passed element
    function AnimateElement(element, newpos) {
		if(newpos.left > ($('.scrollbar').width()-$('#scrollerBtn').width())){
			newpos.left = $('.scrollbar').width() - $('#scrollerBtn').width();
		}
        $(element).stop().animate({
            left: newpos.left
        }, 200, 'easeOutCirc');
		
		var ratio = $(element).position().left/$('.scrollbar').width();
		if(($(element).position().left + $(element).width()) >= $('.scrollbar').width()-5) {
			ratio = 1;
		}
		if($(element).position().left <= 70) {
			ratio = 0;
		}
		$('.scroller').stop().animate({
            left: -1*ratio*($('.scroller').width()-$('.content').width())
        }, 200, 'easeOutCirc');
    }

    this.draggable({
        distance: options.distance,
        // ADDED: Helper function to create invisible helper
		scroll: false,
		axis: "x", 
		containment: ".scrollbar",
		cursorAt: { cursor: "pointer", top: 10, left: 58 },
        helper: function(){
            return $('<div></div>').css('opacity',0);
        },
        start: function(event, ui) {
            ui.helper.data('draggableXY.originalPosition', ui.position || {
                top: 0,
                left: 0
            });
            ui.helper.data('draggableXY.newDrag', true);
        },
        drag: function(event, ui) {
            var originalPosition = ui.helper.data('draggableXY.originalPosition');
            var deltaX = Math.abs(originalPosition.left - ui.position.left);
            var deltaY = Math.abs(originalPosition.top - ui.position.top);

            var newDrag = options.dynamic || ui.helper.data('draggableXY.newDrag');
            ui.helper.data('draggableXY.newDrag', false);

            var xMax = newDrag ? Math.max(deltaX, deltaY) === deltaX : ui.helper.data('draggableXY.xMax');
            ui.helper.data('draggableXY.xMax', xMax);

            var newPosition = ui.position;
            if (xMax) {
                newPosition.top = originalPosition.top;
            }
            if (!xMax) {
                newPosition.left = originalPosition.left;
            }
            
            // ADDED: Animate original object with easing to new position
            AnimateElement(this, newPosition);

            return newPosition;
        },
        // ADDED: Stop event to support reverting
        stop: function() {
            if (options.revert) {
                AnimateElement(this, startPosition);
            }
        }
    });
};

$(document).ready(function(){
	$('#scrollerBtn').draggableXYE({
		revert: false,
		dynamic: true
	});
});