ms dg improved styling, fixed delete

app/controllers/photos_controller.rb

@@ -5,8 +5,7 @@
 class PhotosController < ApplicationController
   before_filter :authenticate_user!
 
-  respond_to :html
-  respond_to :json, :only => :show
+  respond_to :html, :json
 
   def index
     @post_type = :photos
@@ -124,18 +123,21 @@ class PhotosController < ApplicationController
 
     if photo
       photo.destroy
-      flash[:notice] = I18n.t 'photos.destroy.notice'
 
-
-      if photo.status_message_id
-        respond_with photo, :location => photo.status_message
-      else
-        respond_with photo, :location => person_photos_path(current_user.person)
+      respond_to do |format|
+        format.json{ render :nothing => true, :status => 204 }
+        format.html do
+          flash[:notice] = I18n.t 'photos.destroy.notice'
+          if photo.status_message_id
+            respond_with photo, :location => photo.status_message
+          else
+            respond_with photo, :location => person_photos_path(current_user.person)
+          end
+        end
       end
     else
       respond_with photo, :location => person_photos_path(current_user.person)
     end
-
   end
 
   def show

app/views/photos/_new_photo.haml

@@ -17,8 +17,6 @@
        sizeLimit: 4194304,
 
        onProgress: function(id, fileName, loaded, total){
-        var progress = Math.round(loaded / total * 100 );
-         $('#fileInfo').text(fileName + ' ' + progress + '%');
        },
 
        messages: {
@@ -30,38 +28,39 @@
        onSubmit: function(id, fileName){
         $('#file-upload').addClass("loading");
         $('#publisher').find("input[type='submit']").attr('disabled','disabled');
-        $("div.mention_helper").fadeTo(100, 0, function() {
-          $("#publisher .options_and_submit, #fileInfo").fadeIn(50);
-        });
 
         $("#publisher textarea").addClass("with_attachments");
-        $("#publisher_spinner").fadeIn(100);
         $('#photodropzone').append(
           "<li class='publisher_photo loading' style='position:relative;'>" +
             "<img src='/images/ajax-loader2.gif' />" +
           "</li>"
           );
-
        },
 
        onComplete: function(id, fileName, responseJSON) {
         $('#fileInfo').text(fileName + ' completed');
-        var id = responseJSON.data.photo.id;
-        var url = responseJSON.data.photo.thumb_small;
+        var id = responseJSON.data.photo.id,
+            url = responseJSON.data.photo.url,
+            currentPlaceholder = $('li.loading').first();
 
         $("#publisher textarea").addClass("with_attachments");
-
         $('#new_status_message').append("<input type='hidden' value='" + id + "' name='photos[]' />");
-        $('li.loading').first().replaceWith(
-          "<li class='publisher_photo' style='position:relative;'>" +
-            "<img  src='" + url +"' data-id='" + id + "' />" +
-            "<div class='x'> X </div>" +
-            "<div class='circle'></div>" +
-          "</li>"
-          );
-        $('#publisher').find("input[type='submit']").removeAttr('disabled');
-        $("#publisher textarea").css('paddingBottom', $("#photodropzone").height() + 10);
-        $('.x').live('click', function(){
+
+        // replace image placeholders
+        var img = currentPlaceholder.find('img');
+        img.attr('src', url);
+        img.attr('data-id', id);
+        currentPlaceholder.removeClass('loading');
+        currentPlaceholder.append("<div class='x'>X</div>" +
+            "<div class='circle'></div>");
+        ////
+
+        var publisher = $('#publisher'),
+            textarea = publisher.find('textarea');
+
+        publisher.find("input[type='submit']").removeAttr('disabled');
+
+        $('.x').bind('click', function(){
           var photo = $(this).closest('.publisher_photo');
           photo.addClass("dim");
           $.ajax({url: "photos/" + photo.children('img').attr('data-id'),
@@ -69,24 +68,18 @@
                   success: function() {
                             photo.fadeOut(400, function(){
                               photo.remove();
-                              $("#publisher textarea").css('paddingBottom', $("#photodropzone").height() + 10);
+                              textarea.css('paddingBottom', $("#photodropzone").height() + 10);
                               if ( $('.publisher_photo').length  == 0){
-                                $("#publisher textarea").removeClass("with_attachments");
-                                $("#publisher textarea").css('paddingBottom', '');
+                                textarea.removeClass("with_attachments");
+                                textarea.css('paddingBottom', '');
                               }
                             });
                           }
                   });
         });
-
        },
 
        onAllComplete: function(completed_files){
-        $('#fileInfo').delay(1800).fadeOut(200, function() {
-          $("div.mention_helper").fadeTo(100, 100);
-        });
-        $("#publisher_spinner").fadeOut(100);
-        $('#file-upload').removeClass("loading");
        }
 
    });

app/views/shared/_publisher.html.haml

@@ -45,8 +45,6 @@
 
 
         .right
-          #fileInfo
-          = image_tag 'ajax-loader.gif', :class => 'hidden', :id => "publisher_spinner"
           = status.submit t('.share'), :disable_with => t('.posting'), :class => 'button'
 
         .public_toggle

public/stylesheets/sass/application.sass

@@ -872,16 +872,6 @@ label
     :position relative
     :top 0
 
-    ul
-      :padding 0
-      >li
-        :display inline
-        :margin-right 2px
-        img
-          :-webkit-border-radius 5px
-          :-moz-border-radius 5px
-          :border-radius 5px
-
   input[type='text'],
   textarea
     :width 435px
@@ -1014,17 +1004,19 @@ label
     :bottom 0
     :width 435px
     :left 5px
+    :padding 0
+
     li
+      :display inline-block
       :margin-right 4px
       img
-        :height 50px
         :width 50px
       .circle
         :display none
         :z-index 1
         :position absolute
         :right -7px
-        :top -47px
+        :top -5px
         :background
           :color #333
 
@@ -1035,19 +1027,15 @@ label
 
         :border 1px solid #fff
 
-        :-webkit-border-radius 10px
-        :-moz-border-radius 10px
-        :border-radius 10px
-
-        :-webkit-box-shadow 0 1px 3px #000
-        :-moz-box-shadow 0 1px 3px #000
-        :box-shadow 0 1px 3px #000
+        :-webkit-border-radius 20px
+        :-moz-border-radius 20px
+        :border-radius 20px
 
       .x
         :display none
         :z-index 2
         :position absolute
-        :top -45px
+        :top -3px
         :right -1px
         :font
           :size small