added left/right arrow events to the lightbox; lightbox only on stream element images for now

app/views/services/finder.html.haml

@@ -3,8 +3,6 @@
 -#   the COPYRIGHT file.
 
 - content_for :head do
-  = include_javascripts :aspects
-
   = include_javascripts :finder
 
 #aspect_edit_pane.larger.friend_finder

app/views/shared/_stream_element.html.haml

@@ -26,7 +26,7 @@
             = link_to(how_long_ago(post), post_path(post))
 
       - if post.activity_streams?
-        = link_to image_tag(post.image_url), post.object_url
+        = link_to image_tag(post.image_url, 'data-small-photo' => post.image_url), post.object_url, :class => "stream-photo-link"
       - else
         = render 'status_messages/status_message', :post => post, :photos => post.photos
 

app/views/status_messages/_status_message.haml

@@ -5,14 +5,14 @@
 
 - if photos.size > 0
   .photo_attachments
-    = link_to (image_tag photos.first.url(:scaled_full), :class => "stream-photo", 'data-small-photo' => photos.first.url(:thumb_medium), 'data-full-photo' => photos.first.url), photo_path(photos.first), :class => "big_stream_photo"
+    = link_to (image_tag photos.first.url(:scaled_full), :class => "stream-photo", 'data-small-photo' => photos.first.url(:thumb_medium), 'data-full-photo' => photos.first.url), photo_path(photos.first), :class => "stream-photo-link big_stream_photo"
     - if photos.size > 1
       - if photos.size >= 8
         - for photo in photos[1..8]
-          = link_to (image_tag photo.url(:thumb_small), :class => 'stream-photo thumb_small', 'data-small-photo' => photo.url(:thumb_medium), 'data-full-photo' => photo.url), photo_path(photo)
+          = link_to (image_tag photo.url(:thumb_small), :class => 'stream-photo thumb_small', 'data-small-photo' => photo.url(:thumb_medium), 'data-full-photo' => photo.url), photo_path(photo), :class => 'stream-photo-link'
       - else
         - for photo in photos[1..photos.size]
-          = link_to (image_tag photo.url(:thumb_small), :class => 'stream-photo thumb_small', 'data-small-photo' => photo.url(:thumb_medium), 'data-full-photo' => photo.url), photo_path(photo)
+          = link_to (image_tag photo.url(:thumb_small), :class => 'stream-photo thumb_small', 'data-small-photo' => photo.url(:thumb_medium), 'data-full-photo' => photo.url), photo_path(photo), :class => 'stream-photo-link'
 
 %p{:class => direction_for(post.text)}
   = markdownify(post.text, :youtube_maps => post[:youtube_titles])

public/javascripts/widgets/lightbox.js

@@ -25,26 +25,58 @@ jQuery.fn.center = (function() {
         lightbox: $("#lightbox"),
         imageset: $("#lightbox-imageset"),
         backdrop: $("#lightbox-backdrop"),
+        closelink: $("#lightbox-close-link"),
         image: $("#lightbox-image"),
-        stream: $("#main_stream"),
+        stream: $(".stream_container"),
         body: $(document.body),
         window: $(window)
       });
       
-      self.stream.delegate("a", "click", self.lightboxImageClicked);
+      self.stream.delegate("a.stream-photo-link", "click", self.lightboxImageClicked);
       self.imageset.delegate("img", "click", self.imagesetImageClicked);
 
       self.window.resize(function() {
         self.lightbox.css("max-height", (self.window.height() - 100) + "px");
       }).trigger("resize");
 
+      self.closelink.click(self.resetLightbox);
+
       self.body.keydown(function(evt) {
-        if(evt.keyCode == 27){
+
+        var imageThumb = self.imageset.find("img.selected");
+
+        switch(evt.keyCode) {
+        case 27:
           self.resetLightbox();
+          break;
+        case 37:
+          //left
+          self.selectImage(self.prevImage(imageThumb));
+          break;
+        case 39:
+          //right
+          self.selectImage(self.nextImage(imageThumb));
+          break;
         }
       });
     };
 
+    this.nextImage = function(thumb){
+      var next = thumb.next();
+      if (next.length == 0) {
+        next = self.imageset.find("img").first();
+      }
+      return(next);
+    };
+
+    this.prevImage = function(thumb){
+      var prev = thumb.prev();
+      if (prev.length == 0) {
+        prev = self.imageset.find("img").last();
+      }
+      return(prev);
+    };
+
     this.lightboxImageClicked = function(evt) {
       evt.preventDefault();
       
@@ -76,6 +108,7 @@ jQuery.fn.center = (function() {
     this.imagesetImageClicked = function(evt) { 
       evt.preventDefault();
      
+
       self.selectImage($(this));
     };