Drag and drop added

app/controllers/images_controller.rb

@@ -70,6 +70,7 @@ def show
       format.html
       format.json { render json: @image.map(&:fup_json) }
     end
+    @image.order(:position)
   end
 
   def update
@@ -98,6 +99,12 @@ def update
     render text: 'success'
   end
 
+  def sort
+    params[:warpable].each_with_index do |id, index|
+      @warpable.where(id: id).update_all(position: index+1)
+    end
+  end
+
   def destroy
     @warpable = Warpable.find params[:id]
     if logged_in? && current_user.can_delete?(@warpable)

app/views/images/_index.html.erb

@@ -3,7 +3,7 @@
   <p id="no-images">No images uploaded. </p>
   <%end%>
 <table class="warpables-all table table-striped">
-  <tbody>
+  <tbody data-url = "<%= sort_images_path %>">
     <% @map.warpables.each do |warpable| %>
       <tr id="warpable-<%= warpable.id %>">
         <td class="warpable">
@@ -70,3 +70,14 @@
     <% end %>
   </tbody>
 </table>
+<script>
+  $('tbody').sortable({
+   update: function(e,ui){
+      $.ajax({
+        url: $(this).data("url"),
+        type: "PUT",
+        data: $(this).sortable('serialize'),
+      })
+    }
+  });
+</script>

config/routes.rb

@@ -127,6 +127,14 @@
 
   # You can have the root of your site routed with 'root'
   # just remember to delete public/index.html.
+
+  resources :images do
+    collection do
+      put :sort
+    end
+  end
+
+
   root :to => 'maps#index'
 
   # RESTful API