title: Get pan direction on panend hammer.js and restrict directions
body: <p>I am using a <strong><a href="http://hammerjs.github.io/" rel="nofollow">hammer.js</a></strong> library with its <a href="http://hammerjs.github.io/jquery-plugin/" rel="nofollow">jQuery plugin</a>. I started using it as suggested by documentation, so something like this to initiate it on <code>.game-card-mobile</code> divs</p>
  
  <pre><code>/* Create Hammer object for swipable game cards */
  var $gameCard = $('.game-card-mobile');
  var $gameCardTouch = $gameCard.hammer();
  
  $gameCardTouch.on("panright press panleft", function(ev) {
      console.log(ev.type);
  }); 
  </code></pre>
  
  <p>This allows me to restrict available actions to pan/swipe element to the right, left and press on it, however during one event, lets say <code>panright</code> I would get many entries printed out in console although only one pan was performed. So I then changed initiation to this:</p>
  
  <pre><code>$gameCardTouch.on("panend", function(ev) {
      console.log(ev.type);
  });
  </code></pre>
  
  <p>Now it listens to <code>panend</code> action which occur at the end of the action, thus is only returning one printout in console, however it is always <code>panend</code> now, thus I lost restriction to only 3 previous actions and am unable to detect what specific action was performed.</p>
  
  <p>Is there a way to combine these so I would get a print out of <code>panright</code> if users swiped right, <code>panleft</code> if swiped left and press, all just one time once they finish that action?</p>