Make cropping work

4 files changed, 24 insertions, 2 deletions

diff --git a/app/controllers/user_controller.rb b/app/controllers/user_controller.rb
index a07701208..e2998333c 100644
--- a/app/controllers/user_controller.rb
+++ b/app/controllers/user_controller.rb
@@ -375,8 +375,12 @@ class UserController < ApplicationController
             render :template => 'user/set_crop_profile_photo.rhtml'
             return
         elsif !params[:submitted_crop_profile_photo].nil?
-            # change user's photo
+            # crop the draft photo according to jquery parameters and set it as the users photo
+            draft_profile_photo = ProfilePhoto.find(params[:draft_profile_photo_id])
+            @profile_photo = ProfilePhoto.new(:data => draft_profile_photo.data, :draft => false, 
+                :x => params[:x], :y => params[:y], :w => params[:w], :h => params[:h])
             @user.set_profile_photo(@profile_photo)
+            draft_profile_photo.destroy
             flash[:notice] = "Thank you for updating your profile photo"
             redirect_to user_url(@user)
         else
diff --git a/app/models/profile_photo.rb b/app/models/profile_photo.rb
index 041b5aa57..26fa34f05 100644
--- a/app/models/profile_photo.rb
+++ b/app/models/profile_photo.rb
@@ -30,6 +30,8 @@ class ProfilePhoto < ActiveRecord::Base
 
     # deliberately don't strip_attributes, so keeps raw photo properly
     
+    attr_accessor :x, :y, :w, :h
+    
     # convert binary data blob into ImageMagick image when assigned
     attr_accessor :image
     def after_initialize
@@ -68,6 +70,11 @@ class ProfilePhoto < ActiveRecord::Base
         end
         # draft images are before the user has cropped them
         if !self.draft && (image.columns != WIDTH || image.rows != HEIGHT)
+            # do any exact cropping (taken from Jcrop interface)
+            if self.w && self.h 
+                image.crop!(self.x.to_i, self.y.to_i, self.w.to_i, self.h.to_i)
+            end
+            # do any further cropping
             image.resize_to_fill!(WIDTH, HEIGHT)
             altered = true
         end
diff --git a/app/views/user/set_crop_profile_photo.rhtml b/app/views/user/set_crop_profile_photo.rhtml
index a616cec00..503d1fbab 100644
--- a/app/views/user/set_crop_profile_photo.rhtml
+++ b/app/views/user/set_crop_profile_photo.rhtml
@@ -25,13 +25,19 @@
     </tr>
     </table>
 
+    <input type="hidden" id="x" name="x" >
+    <input type="hidden" id="y" name="y" >
+    <input type="hidden" id="w" name="w" >
+    <input type="hidden" id="h" name="h" >
+
+    <%= hidden_field_tag 'draft_profile_photo_id', @draft_profile_photo.id %>
 
     <p><strong>Privacy note:</strong> Your photo will be shown in public on the Internet, 
     wherever you do something on WhatDoTheyKnow.
 
     <p>
         <%= hidden_field_tag 'submitted_crop_profile_photo', 1 %>
-        <%= submit_tag "Set my profile photo" %>
+        <%= submit_tag "Done &gt;&gt;" %>
     </p>
 
 <% end %>
diff --git a/public/javascripts/profile_photo.js b/public/javascripts/profile_photo.js
index 82a34caa3..6d637b439 100644
--- a/public/javascripts/profile_photo.js
+++ b/public/javascripts/profile_photo.js
@@ -39,6 +39,11 @@ function showPreview(coords)
             marginLeft: '-' + Math.round(rx * coords.x) + 'px',
             marginTop: '-' + Math.round(ry * coords.y) + 'px'
         });
+
+        $('#x').val(coords.x);
+        $('#y').val(coords.y);
+        $('#w').val(coords.w);
+        $('#h').val(coords.h);
     }
 }