Double tap event in owl carousel

Question

As a Javscript beginner I'm trying to fetch a double tap event in owl carousel:

In onDragEnd function:

var lastTouch = $(this).data('lastTouch') || now + 1;
var timeDelta = now - lastTouch;
if (timeDelta < 300 && 0 < timeDelta) {
    $(this).data('lastTouch',null);
    //do scaling
}else{
    $(this).data('lastTouch',now);
}

What I am trying to achieve is some kind of double tap zoom (via transform:scale?). Has someone already tried to achieve a similar function? I haven't found anything.

Answer 1

This might be a solution for you but without using an event from Owl Carousel 2:

$(function() {
  var last = null;
  $('.owl-carousel').owlCarousel({
    center      : true,
    margin      : 10,
    loop        : true,
    autoWidth   : true, 
    items       : 3
  }).on('touchend', function(e) {
    var now = new Date().getTime();
    last = last || now;
    if (now - last < 300 && now - last > 0) {
      last = null;
      console.log('double tap');
    } else if (last !== now) {
      last = null;
    }
  });
});

Here is a JS Bin: http://jsbin.com/tebazugi/1/edit.