рельсы jcrop + скрепка - PullRequest
       9

рельсы jcrop + скрепка

1 голос
/ 16 декабря 2009

Я успешно применил jcrop и paperclip для обрезки изображений, перейдя на другую страницу (т.е. crop.html.erb). Но я хочу иметь возможность делать все обрезки на моей текущей странице, где я загружаю изображение (изображения) во всплывающем окне div / dialog. Так или иначе, мне нужно загрузить страницу crop.html.erb во всплывающее окно div при нажатии. Вот код на странице обрезки

    <% content_for :javascript do %>
    <%= stylesheet_link_tag "jquery.Jcrop" %>
    <%= javascript_include_tag "jquery.Jcrop.min" %>

<% end %>

<script type="text/javascript" charset="utf-8">

$(function() {
  $('#cropbox').Jcrop({
    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 * <%= @photo.photo_geometry(:biggest).width %>) + 'px',
    height: Math.round(ry * <%= @photo.photo_geometry(:biggest).height %>) + 'px',
    marginLeft: '-' + Math.round(rx * coords.x) + 'px',
    marginTop: '-' + Math.round(ry * coords.y) + 'px'
  });
  var ratio = <%= @photo.photo_geometry(:original).width %> / <%= @photo.photo_geometry(:biggest).width %>;
  $("#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));
}

</script>


 <%= image_tag @photo.photo.url(:biggest), :id => "cropbox" %>

 <h4>Preview:</h4>
    <div style="width:100px; height:100px; overflow:hidden">
      <%= image_tag @photo.photo.url(:biggest), :id => "preview" %>
    </div>


 <% form_for @photo do |f| %>
  <% for attribute in [:crop_x, :crop_y, :crop_w, :crop_h] %>
    <%= f.hidden_field attribute, :id => attribute %>
  <% end %>
  <p><%= f.submit "Crop" %></p>
<% end %>

Могу ли я просто добавить его в div или что-то в этом роде, или я уже далеко?

Между прочим, я не просто загружаю одно изображение за раз, поэтому я не могу заставить его перейти на страницу обрезки, а затем вернуться. Я загружаю все файлы одновременно, используя uploadify во всплывающем элементе div на странице, а затем хочу щелкнуть ссылку обрезки рядом с изображением.

1 Ответ

1 голос
/ 18 февраля 2010

Вам необходимо внести изменения, подобные этим:

в photos_controller.rb

def create
  @photo = Photo.new(params[:photo])
  if @photo.save
    flash[:notice] = "Successfully created photo."
    redirect_to @photo
  end
end

def update
  @photo = Photo.find(params[:id])
  if @photo.update_attributes(params[:photo])
      flash[:notice] = "Successfully updated photo."
      redirect_to @photo
  end
end

def crop
  @photo = Photo.find(params[:id])
end

в route.rb

map.resources :photos, :member => {:crop => :get}

на фотографиях / show.html.erb

<%= link_to "Crop", crop_photo_path(@photo) %>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...