example.html

    <div class="session-perspective-wrapper"
         ng-class="isTba(session.title)"
         ng-activate-preview='activate-preview'>
      <div class="session-keynote"
           ng-activate
           ng-activate-modal="session">
        <img ng-src="{{session.image}}" alt="Profile image of {{session.speaker}}">

ng_activate.js

(function(app) {
  'use strict';

  app.directive('ngActivate', function() {
    return {
      priority: 0,
      link: function(scope, element, attrs) {
        var activate = function() {
          element.triggerHandler('activated');
          scope.$apply(attrs.ngActivate);
        };

        // Handle click events simply
        element.bind('click', activate);

        // Handle tap events
        var moving;
        element.bind('touchstart', function() {
          moving = false;
        });
        element.bind('touchmove', function() {
          moving = true;
        });
        element.bind('touchend', function(e) {
          if (!moving) {
            e.preventDefault();
            activate();
          }
        });
      }
    };
  });

})(angular.module('WebDirectionsApp'));

ng_activate_modal.js

(function (app) {
  'use strict';

  app.directive('ngActivateModal', function($window, Modals, viewportYOffset) {
    return function(scope, element, attrs) {
      element.bind('activated', function() {
        Modals.currentModal = {
          talk: scope[attrs.ngActivateModal],
          type: 'session-detail',
          top: element[0].getBoundingClientRect().top + viewportYOffset()
        };
      });
    };
  });

})(angular.module('WebDirectionsApp'));

ng_activate_preview.js

(function (app) {
  'use strict';

  app.directive('ngActivatePreview', function () {
    return {
      priority: 10,
      link: function (scope, element, attrs) {
        var startPreview = function () {
          element.addClass(attrs.ngActivatePreview);
        }, endPreview = function () {
          element.removeClass(attrs.ngActivatePreview);
        };
        element.bind('mouseover', startPreview);
        element.bind('touchstart', startPreview);

        element.bind('touchmove', endPreview);
        element.bind('touchend', endPreview);
        element.bind('mouseout', endPreview);
      }
    };
  });

})(angular.module('WebDirectionsApp'));