3 files changed, 28 insertions, 2 deletions
diff --git a/app/models/profile_photo.rb b/app/models/profile_photo.rb
index 108e34110..041b5aa57 100644
--- a/app/models/profile_photo.rb
+++ b/app/models/profile_photo.rb
@@ -24,6 +24,8 @@ class ProfilePhoto < ActiveRecord::Base
     WIDTH = 96
     HEIGHT = 96
 
+    MAX_DRAFT = 500 # keep even pre-cropped images reasonably small
+
     belongs_to :user
 
     # deliberately don't strip_attributes, so keeps raw photo properly
@@ -69,6 +71,10 @@ class ProfilePhoto < ActiveRecord::Base
             image.resize_to_fill!(WIDTH, HEIGHT)
             altered = true
         end
+        if self.draft && (image.columns > MAX_DRAFT || image.rows > MAX_DRAFT)
+            image.resize_to_fit!(MAX_DRAFT, MAX_DRAFT)
+            altered = true
+        end
         if altered
             write_attribute(:data, self.image.to_blob)
         end
diff --git a/app/views/layouts/default.rhtml b/app/views/layouts/default.rhtml
index 0db75380f..9a9f2009e 100644
--- a/app/views/layouts/default.rhtml
+++ b/app/views/layouts/default.rhtml
@@ -1,9 +1,15 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 <html lang="en-gb">
     <head>
-        <!-- <%= javascript_include_tag :defaults %> -->
         <script type="text/javascript" src="/jslib/spell/spellChecker.js"></script>
 
+        <% if @profile_photo_javascript %>
+            <script type="text/javascript" src="/javascripts/jquery.js"></script>
+            <script type="text/javascript" src="/javascripts/jquery.Jcrop.js"></script>
+            <script type="text/javascript" src="/javascripts/profile_photo.js"></script>
+            <link rel="stylesheet" href="/stylesheets/jquery.Jcrop.css" type="text/css" >
+        <% end %>
+
         <title>
         <% if @title %>
             <%=@title%> - WhatDoTheyKnow
diff --git a/app/views/user/set_crop_profile_photo.rhtml b/app/views/user/set_crop_profile_photo.rhtml
index d96b6812e..a616cec00 100644
--- a/app/views/user/set_crop_profile_photo.rhtml
+++ b/app/views/user/set_crop_profile_photo.rhtml
@@ -1,4 +1,5 @@
 <% @title = "Change profile photo" %>
+<% @profile_photo_javascript = true %>
 
 <% raise "internal error" if not @user %>
 
@@ -10,7 +11,20 @@
 
 <% form_tag 'set_profile_photo', :id => 'set_crop_profile_photo_form', :multipart => true do %>
 
-    <img src="<%= get_draft_profile_photo_url(:id => @draft_profile_photo.id) %>">
+    <table>
+    <tr>
+    <td>
+    <img src="<%= get_draft_profile_photo_url(:id => @draft_profile_photo.id) %>" id="profile_photo_cropbox">
+    </td>
+    <td>
+    <div style="width:96px;height:96px;overflow:hidden;">
+        <img src="<%= get_draft_profile_photo_url(:id => @draft_profile_photo.id) %>" id="profile_photo_preview" />
+    </div>
+    
+    </td>
+    </tr>
+    </table>
+
 
     <p><strong>Privacy note:</strong> Your photo will be shown in public on the Internet, 
     wherever you do something on WhatDoTheyKnow.