Contents

Crop your image:


<% my_file_name = File.basename(@logo.logo.queued_for_write[:original].path) %>
<div style="width:100px;height:100px;overflow:hidden;margin-left:5px;"> 
		<%= image_tag "tmp/#{my_file_name}",:id=>"preview" %>
</div>
<div id="precropDiv">
	<%= image_tag "tmp/#{my_file_name}",:id=>"cropImage" %>
</div>

<% precrop_dimensions = @logo.image_dimensions(my_file_name) %>

<% content_for :javascript do %>
        jQuery('#cropImage').Jcrop({
            bgColor:     'clear',
            bgOpacity:   .6,
            setSelect:   [ 0, 0, 200, 200 ],
            aspectRatio: 1 ,
            onChange: update_crop,
            onSelect: update_crop
        });

function update_crop(coords) {
  var rx = 100/coords.w;
  var ry = 100/coords.h;
  $('#preview').css({
    width: Math.round(rx * <%= precrop_dimensions[:width] %>) + 'px',
    height: Math.round(ry * <%= precrop_dimensions[:height] %>) + 'px',
    marginLeft: '-' + Math.round(rx * coords.x) + 'px',
    marginTop: '-' + Math.round(ry * coords.y) + 'px'
  });
  var ratio = <%= precrop_dimensions[:width] %> / <%= precrop_dimensions[:height] %>;
  $("#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));
}
<% end %>

<%= form_for :logo, @logo,:url => logos_path, :html => { :multipart => true } do |f| %>

  <% for attribute in [:crop_x, :crop_y, :crop_w, :crop_h] %>
    <%= f.text_field attribute, :id => attribute %>
  <% end %>
  <p><%= f.submit "Crop" %></p>
<% end %>

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
social_stream-0.4.0	app/views/logos/_precrop.html.erb