Commit 696138cd

mo k <m@mokhan.ca>
2011-12-29 07:15:59
add jcrop css and tidy up the crop page a bit.
1 parent f7e16c4
Changed files (5)
app/assets/stylesheets/home.css
app/assets/stylesheets/jquery.Jcrop.css
@@ -0,0 +1,35 @@
+/* Fixes issue here http://code.google.com/p/jcrop/issues/detail?id=1 */
+.jcrop-holder { text-align: left; }
+
+.jcrop-vline, .jcrop-hline
+{
+	font-size: 0px;
+	position: absolute;
+	background: white url('Jcrop.gif') top left repeat;
+}
+.jcrop-vline { height: 100%; width: 1px !important; }
+.jcrop-hline { width: 100%; height: 1px !important; }
+.jcrop-vline.right { right: 0px; }
+.jcrop-hline.bottom { bottom: 0px; }
+.jcrop-handle {
+	font-size: 1px;
+	width: 7px !important;
+	height: 7px !important;
+	border: 1px #eee solid;
+	background-color: #333;
+}
+
+.jcrop-tracker { width: 100%; height: 100%; }
+
+.custom .jcrop-vline,
+.custom .jcrop-hline
+{
+	background: yellow;
+}
+.custom .jcrop-handle
+{
+	border-color: black;
+	background-color: #C7BB00;
+	-moz-border-radius: 3px;
+	-webkit-border-radius: 3px;
+}
app/uploaders/image_uploader.rb
@@ -32,9 +32,7 @@ class ImageUploader < CarrierWave::Uploader::Base
   end
 
   version :thumb do
-    # process :manualcrop
     process :resize_to_fill => [210, 150]
-    # process :resize_to_fit => [210, 150]
   end
 
   def manualcrop
app/views/creations/crop.html.erb
@@ -12,7 +12,7 @@ $(function() {
   $('#cropbox').Jcrop({
     onChange: update_crop,
     onSelect: update_crop,
-    setSelect: [0, 0, 660, 460],
+    setSelect: [100, 100, 210, 150],
     aspectRatio: 1.4
   });
   }catch(e){
@@ -33,49 +33,47 @@ function update_crop(coords) {
     marginTop: '-' + Math.round(ry * coords.y) + 'px'
   });
 
-  var ratio = 660 / coords.w ;
-  <%# $("#crop_x").val(Math.round(coords.x * ratio));%>
-  <%# $("#crop_y").val(Math.round(coords.y * ratio));%>
-  <%# $("#crop_w").val(Math.round(coords.w * ratio));%>
-  <%# $("#crop_h").val(Math.round(coords.h * ratio));%>
   $("#crop_x").val(coords.x);
   $("#crop_y").val(coords.y);
   $("#crop_w").val(coords.w);
   $("#crop_h").val(coords.h);
-
-  $('#x').text(coords.x);
-  $('#y').text(coords.y);
-  $('#w').text(coords.w);
-  $('#h').text(coords.h);
-  $("#p_ratio").text(ratio);
-  $("#p_x").text($('#crop_x').val());
-  $("#p_y").text($('#crop_y').val());
-  $("#p_w").text($('#crop_w').val());
-  $("#p_h").text($('#crop_h').val());
 }
 </script>
 <% end %>
 
-<%= image_tag @creation.image_url, :id => "cropbox" %>
-
-<h3>Preview</h3>
-<div class="preview">
-    <%= image_tag @creation.image_url, :id => "preview" %>
+<div class="row">
+  <div class="page-header">
+    <h1> <%= @creation.name %> <small> submitted by <%= link_to @creation.user.name, profile_path(@creation.user) %> </small> </h1>
+    <% @creation.categories.each do |category| %>
+      <span class="label notice"><a href="/categories/<%= category.slug %>"><%= category.name %></a></span>
+    <% end %> 
+  </div>
 </div>
-<p id="x"></p>
-<p id="y"></p>
-<p id="w"></p>
-<p id="h"></p>
-<hr />
-<p id="p_ratio"></p>
-<p id="p_x"></p>
-<p id="p_y"></p>
-<p id="p_w"></p>
-<p id="p_h"></p>
-
-<%= form_for @creation, :url => creations_crop_update_path(@creation) do |f| %>
-    <% for attribute in [:crop_x, :crop_y, :crop_h, :crop_w] %>
-        <%= f.hidden_field attribute, :id => attribute %>
+<div class="row">
+    <div class="span12">
+      <%= image_tag @creation.image_url, :id => "cropbox" %>
+    </div>
+    <div class="span4">
+      <h3>Preview</h3>
+      <div class="preview">
+          <%= image_tag @creation.image_url, :id => "preview" %>
+      </div>
+    </div>
+</div>
+<div class="row">
+  <div class="span16">
+    <h2>Next</h2>
+    <%= form_for @creation, :url => creations_crop_update_path(@creation) do |f| %>
+        <% for attribute in [:crop_x, :crop_y, :crop_h, :crop_w] %>
+            <%= f.hidden_field attribute, :id => attribute %>
+        <% end %>
+        <div class="well">
+          <%= f.submit "Publish", :class => "btn large primary" %>
+          <%# <a class="btn large primary" href="#">Publish</a>%>
+          <a class="btn large" href="<%= url_for creation_path(@creation) %>">Skip</a>
+        </div>
     <% end %>
-    <p><%= f.submit "Crop" %></p>
-<% end %>
+  </div>
+</div>
+
+
app/views/shared/_paging.html.erb
@@ -1,5 +1,5 @@
 <div class="row">
-  <div class="span6"> &nbsp;</div>
-  <div class="span5"> <p> <%= paginate @creations %> </p> </div>
-  <div class="span5">&nbsp;</div>
+  <div class="span3"> &nbsp;</div>
+  <div class="span10"> <p> <%= paginate @creations %> </p> </div>
+  <div class="span3">&nbsp;</div>
 </div>