title: How do I use event handlers in photoswipe using the jquery-mobile interface
body: <p>I'm trying to do some image manipulation stuff depending on arbitrary data i've assocaied with my gallery.</p>
  
  <pre><code>  gallery.html('');
      $.each(data.photos, function(key, photo) {
  
          var item = "&lt;li&gt;&lt;a href='http://stage.domain.com/assets/img/user/"+photo.full+"'&gt;&lt;img src='http://stage.domain.com/assets/img/user/"+photo.med+"'/&gt;&lt;/a&gt;&lt;/li&gt;";
  
          gallery.append(item);
      });
      gallery.trigger('create');
  
      var options = {
  
  
          enableMouseWheel: false , 
          enableKeyboard: false ,
          captionAndToolbarAutoHideDelay:0,
          jQueryMobile:true
  
      }
  
      var swipe = $(".gallery a").photoSwipe(options);
  
      // onDisplayImage
      swipe.addEventHandler(PhotoSwipe.EventTypes.onDisplayImage, function(e){
          console.log('onDisplayImage{');
          console.log('onDisplayImage - e.action = ' + e.action);
          console.log('onDisplayImage - e.index = ' + e.index);
          console.log(swipe.getCurrentImage());
          console.log('onDisplayImage}');
      });
  </code></pre>
  
  <p>But the ondisplayimage event is never fired beacuse PhotoSwipe is not defined</p>
  
  <pre><code> 06-14 04:28:45.496: D/CordovaLog(31662): Uncaught ReferenceError: PhotoSwipe is not defined
  </code></pre>
  
  <p>The examples <a href="https://github.com/codecomputerlove/PhotoSwipe/blob/master/src/examples/07-custom-toolbar.html" rel="nofollow">https://github.com/codecomputerlove/PhotoSwipe/blob/master/src/examples/07-custom-toolbar.html</a> don't use the jquery implementation which is what I need. So basically how do I hook into the event handlers with jquery mobile. </p>