Panzoom implementation for Mobilot station content images

panzoom.js

// NOTE - panzoom from: https://github.com/timmywil/jquery.panzoom

var scope = this;
var doubleTapTime = 600; // ms

$('#div_content .pictureZoomBox img.picture')
.panzoom(
{
    startTransform : 'scale(1)',
    increment      : 0.4,
    minScale       : 1,
    maxScale       : 3,
    contain        : 'invert',
    disablePan     : true,


    onPan : function ()
    {
        // console.log('onPan');
        
        var matrix = $(this).panzoom('getTransform');
        var disablePan = matrix == 'matrix(1, 0, 0, 1, 0, 0)';
        
        $(this).panzoom('option', 'disablePan', disablePan);
        
        scope.firstTap = false;
    },

    onZoom : function ()
    {
        // console.log('onZoom');
        
        var matrix = $(this).panzoom('getTransform');
        var disablePan = matrix == 'matrix(1, 0, 0, 1, 0, 0)';
        
        $(this).panzoom('option', 'disablePan', disablePan);
        
        scope.firstTap = false;
    },

    onEnd  : function ()
    {
        // console.log('onEnd');

        if ( ! $(this).panzoom('isPanning') )
        {
            var currentMoment = Date.now();

            if ( scope.firstTap )
            {
                scope.eventTapMillis     = currentMoment;
                scope.eventTapValidUntil = scope.eventTapMillis + doubleTapTime;
            }
            else if ( currentMoment <= scope.eventTapValidUntil )
            {
                $(this).panzoom('reset');

                var panzoomScope = $(this);
                var pzTimer = setTimeout(function ()
                {
                    panzoomScope.panzoom('option', 'disablePan', true);
                }, 200);
            }

            scope.firstTap = ! scope.firstTap;
        }
    }
});