- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我已经成功实现了 jcrop 和回形针,通过转到另一个页面(即 crop.html.erb
)来裁剪图像。但我希望能够在当前页面上进行所有裁剪,在弹出的 div/对话框中上传图像。因此,我需要以某种方式将 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 或类似的东西上,还是我离题太远了?
顺便说一句,我并不是简单地一次上传一张图像,所以我不能让它转到裁剪页面然后再回来。我使用页面上弹出 div 中的 uploadify 一次性上传所有文件,然后希望能够单击图像旁边的裁剪链接。
最佳答案
您需要进行与此类似的更改:
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
map.resources :photos, :member => {:crop => :get}
<%= link_to "Crop", crop_photo_path(@photo) %>
关于javascript - Rails jcrop + 回形针,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1915879/
这里是 Ruby 初学者!我正在尝试在 ruby 上创建一个 Soundcloud 克隆。当我尝试上传音频文件时出现错误: 1 个错误禁止保存这首歌: 音频中的内容与所报告的内容不同 Contro
这是我配置附件的方式: has_attached_file :image, {styles: { small: "64x64", med: "100x100", large: "200x200" },
最近我正在调整我的 rails 应用程序以在 JRuby 上运行。 我遇到的问题之一是 Paperclip。 Paperclip 使用 Cocaine 来运行命令行工具,如 ImageMagick,它
我是 RoR 回形针 gem 的新手,我一直在尝试有关多张图像上传的一些示例,并希望了解有关这个伟大 gem 的一些信息。 在一个例子中,我有一个相册模型,它允许用户上传多张图片。我注意到图像存储在
有没有人有多个附件的 Rails 3 示例,可以在多部分表单上进行验证?我一直试图让它永远工作(并且找到了我能找到的所有博客文章和消息,但没有一个涵盖这种情况,而且文档根本没有帮助)。 第一个问题
当用户在我的应用程序中编辑某些内容时,即使他们没有更改图像,他们也被迫通过回形针重新上传图像。不这样做会导致错误,因为我validate_presence_of :image。这很烦人。 如果用户根本
我正在使用回形针在我的 Rails 应用程序中上传和显示图像。 '') %> 上面的代码显示图像的缩略图。 我想让缩略图成为一个链接,以便当用户点击它时,会显示一个显示原始图像的弹出窗口。 我尝
我希望用户能够保存最多 5 个文件(任何少于这个都很好),所以这是我的新操作(place_photos 是回形针附件,Place :has_many PlacePhoto): def new @p
我正在一个需要接受文件上传的项目。文件上传后,我要进行一些处理-从文件中提取信息。我最终计划在后台工作人员中运行此程序,但当前正在内联运行。 我尝试过同时使用after_create和after_sa
我正在使用回形针来处理我的文件上传,并且在一种情况下我不希望该文件是强制性的。但是,我确实想确保它存在时是特定的文件类型。 我有这个: class TestModel ['audio/mp3', '
我正在使用 Paperclip 4.1.1用于图片上传。我存储三种尺寸,原始尺寸、中等尺寸和缩略图尺寸。当我尝试显示原始图像时,其中一些图像向左旋转,并且随机发生,因为其他一些图像显示正确。中等大小和
我已经成功实现了 jcrop 和回形针,通过转到另一个页面(即 crop.html.erb)来裁剪图像。但我希望能够在当前页面上进行所有裁剪,在弹出的 div/对话框中上传图像。因此,我需要以某种方式
如果我将两个具有相似文件名的文件保存到同一目录中,一个文件将覆盖另一个文件。如何使下面的方式工作,比方说,目录中已经有 picture.jpg,如果我将另一个 picture.jpg 上传到同一目录,
我发现这个教程 (http://www.coffeepowered.net/2009/02/15/graceful-degredation-using-gravatar-as-a-fallback-a
我有一个主题模型,其中包含许多 Assets 。 Assets 使用 Paperclip 并将其文件内容存储在我的 Amazon AWS-S3 系统中。我也在使用 deep_clone,因为我的客户能
当我尝试在回形针-ffmpeg 中上传 .mov 视频时,会出现错误 Video content type is invalid in paperclip-ffmpeg 我的代码是 has_attac
所以,我正在使用 Paperclip 和 AWS-S3,这很棒。而且效果很好。不过,只有一个问题:我需要上传非常大的文件。如超过 50 兆字节。就这样,nginx 死了。那么显然Paperclip在进
我正在尝试查找有关如何设置Paperclip以使用fog.io和fog.io以使用Rackspace Cloud File的文档,但是我找不到任何好的引用文献(而且我认为自己是一位出色的Google语
当我尝试在 Ruby on Rails 上传照片时使用 Paperclip在我的本地机器上,它运行良好。 当我尝试在带有 Apache 和 CentOS 的 Linux(Phusion Passeng
除了动态文件大小限制之外,还有 validates_attachment_size 吗?这是一个例子: class Document get_current_file_size_limit p
我是一名优秀的程序员,十分优秀!