// Constants
var MIN_ROTATION = 20;
var MIN_SCALE = .3;
var MIN_SWIPE_DISTANCE = 50;

var rotation, scale, recognized, translationX, translationY;

// Set up gesture recognition on the gesture surface
var surface = document.querySelector('.gestureSurface');

// Initialise MSGesture
var msGesture = new MSGesture();
msGesture.target = surface;

// Add event listerens
surface.addEventListener('MSPointerDown', function(event) {
  msGesture.addPointer(event.pointerId);
});
surface.addEventListener('MSGestureStart', resetGesture);
surface.addEventListener('MSGestureChange', detectGesture);

function resetGesture(event) {
  rotation = 0;
  scale = 1;
  recognized = false;
  translationX = translationY = 0;
}

function detectGesture(event) {
  // Disable the built-in inertia provided by dynamic gesture recognition
  if (event.detail == event.MSGESTURE_FLAG_INERTIA) {
    return;
  }

  // Update total values
  rotation += event.rotation * 180 / Math.PI;
  scale *= event.scale;
  translationX += event.translationX;
  translationY += event.translationY;

  if (!recognized) {

    if (Math.abs(translationX) > MIN_SWIPE_DISTANCE) {
      // Horizontal swipe
      recognized = true;
      console.log('Horizontal swipe: ', translationX < 0 ? 'left' : 'right');
    } else if (Math.abs(translationY) > MIN_SWIPE_DISTANCE) {
      // Vertical swipe
      recognized = true;
      console.log('Vertical swipe: ', translationY < 0 ? 'up' : 'down');
    }

    if (Math.abs(rotation) >= MIN_ROTATION) {
      // Rotation
      recognized = true;
      console.log('Rotate: ', rotation < 0 ? 'left' : 'right');
    } else if (Math.abs(scale - 1) > MIN_SCALE) {
      // Pinch/Stretch
      recognized = true;
      console.log('Scale: ', scale > 1 ? 'stretch' : 'pinch');
    }
  }
}