works need a middle stage

app/controllers/photos_controller.rb

@@ -116,6 +116,7 @@ class PhotosController < ApplicationController
   end
 
   def destroy
+    puts "THIS SHIT IS BANANAS JUST DELETED A PHOTO"
     photo = current_user.posts.where(:id => params[:id]).first
 
     if photo

app/views/photos/_new_photo.haml

@@ -46,10 +46,29 @@
         $('#new_status_message').append("<input type='hidden' value='" + id + "' name='photos[]' />");
         $('#photodropzone').append(
           "<li style='position:relative;'>" +
-            "<img src='" + url +"' data-id='" + id + "' />" +
+            "<img src='" + url +"' data-id='" + id + "' />" + 
+            "<div class='x'> X </div>" +
+            "<div class='circle'></div>" +
           "</li>"
           );
         $('#publisher').find("input[type='submit']").removeAttr('disabled');
+        $('.circle').live('click', function(){
+          var photo = $(this).closest('li');
+
+          $.ajax({url: "photos/" + photo.children('img').attr('data-id'),
+                  type: 'DELETE',
+                  success: function() {
+                            photo.fadeOut(400, function(){
+                              photo.remove()
+                            });
+                            if ( $('#photodropzone').children().index('li')  == -1){
+                              alert("last one")
+                              $("#publisher textarea").removeClass("with_attachments");
+                            }
+
+                          }
+                  });
+        });
        }
 
    });

public/stylesheets/sass/application.sass

@@ -908,7 +908,47 @@ label
     :z-index 3
     :position absolute
     :bottom 0
-    :left 5px
+    li
+      .circle
+        :display none
+        :z-index 1
+        :position absolute
+        :right -7px
+        :top -46px
+        :background
+          :color #333
+
+        :width 20px
+        :max-width 20px
+        :height 20px
+        :max-height 20px
+
+        :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
+
+      .x
+        :display none
+        :z-index 2
+        :position absolute
+        :top -48px
+        :right -5px
+        :font
+          :size xx-small
+          :weight bold
+
+      &:hover
+        :cursor default
+        .circle
+          :display block
+        .x
+          :display block
 
 .field_with_submit
   input[type='text']