fixed top right buttons on album page, etc. also, made the image loader simpler.

app/views/albums/show.html.haml

@@ -5,8 +5,10 @@
   = @album.name 
 
   -if current_user.owns? @album
-    .button.right#add_photo_button
-      = link_to 'Add Photos', '#'
+    .right#add_photo_button
+      #add_photo_loader
+        = image_tag 'ajax-loader.gif'
+      = link_to 'Add Photos', '#', :class => 'button'
 
     #add_photo_pane.contextual_pane
       = render "photos/new_photo", :photo => @photo, :album => @album
@@ -27,5 +29,5 @@
     = link_to "⇧ albums", albums_path
 
   -if current_user.owns? @album
-    .button.right
-      = link_to 'Edit Album', edit_album_path(@album)
+    .right
+      = link_to 'Edit Album', edit_album_path(@album), :class => 'button'

app/views/photos/_new_photo.haml

@@ -8,10 +8,10 @@
         return confirm("You are about to upload " + total + " photos. Are you sure?");
       },
       setName: function(text) {
-        $("#progress_report_name").text(text);
+        //$("#progress_report_name").text(text);
       },
       setStatus: function(text) {
-        $("#progress_report_status").text(text);
+        //$("#progress_report_status").text(text);
       },
       setProgress: function(val) {
         //$("#progress_report_bar").css('width', Math.ceil(val*100)+"%");
@@ -20,11 +20,16 @@
         //alert(response);
       },
       onFinish: function(event, total){
-        $("#progress_report").delay(600).slideUp(200);
-        $("#add_photo_box").delay(600).fadeOut(200);
+        //$("#progress_report").delay(600).slideUp(200);
+        //$("#add_photo_pane").delay(600).fadeOut(200);
+        $("#add_photo_button .button").html( "Add Photos" );
+        $("#add_photo_loader").fadeOut(0);
       },
       onStart: function(event, total){
-        $("#progress_report").slideDown(600);
+        $("#add_photo_pane").fadeOut(400);
+        $("#add_photo_button .button").html( "Uploading Photos" );
+        //$("#add_photo_button").prepend( "<img alt='Loader' src='/images/loader.gif'/>" );
+        $("#add_photo_loader").fadeIn(400);
         return true;
       }
     });

app/views/shared/_group_nav.haml

@@ -8,8 +8,8 @@
     #add_group_pane.contextual_pane
       = render "groups/new_group"
 
-  - if @group
-    #friend_pictures
+  #friend_pictures
+    - if @group
       - for friend in @group.people
         = person_image_link(friend)
 

public/stylesheets/application.css

@@ -70,7 +70,6 @@ header {
   color: #555555;
   background-color: #2b2726;
   background-color: black;
-  background-color: white;
   border-bottom: 3px solid #333333;
   padding: 6px 0;
     padding-top: 0; }
@@ -381,9 +380,15 @@ h1.big_text {
   border-bottom: 1px solid #666666;
   text-align: center; }
 
+.big_text .right {
+  top: -8px; }
+
+#content_bottom .right {
+  top: -5px; }
+
 .right {
-  float: right;
-  margin-top: 6px; }
+  display: inline;
+  float: right; }
 
 .back {
   position: absolute;
@@ -459,3 +464,9 @@ h1.big_text {
   #group #friend_pictures img {
     display: none;
     height: 40px; }
+
+#add_photo_loader {
+  position: absolute;
+  display: none;
+  left: -25px;
+  top: 4px; }

public/stylesheets/sass/application.sass

@@ -75,7 +75,6 @@ header
   :background
     :color #2B2726
     :color #000
-    :color #fff
   :border
     :bottom 3px solid #333
   :padding 6px 0
@@ -473,10 +472,16 @@ h1.big_text
   :text
     :align center
 
+.big_text
+  .right
+    :top -8px
+#content_bottom
+  .right
+    :top -5px
+
 .right
+  :display inline
   :float right
-  :margin
-    :top 6px
 
 .back
   :position absolute
@@ -575,3 +580,9 @@ h1.big_text
     img
       :display none
       :height 40px
+
+#add_photo_loader
+  :position absolute
+  :display none
+  :left -25px
+  :top 4px