Rails carrierwave + jcrop + bootstrap

问题

I'm using Rails 4 with gems mini_magick, carrierwave, jcrop-rails-v2 and bootstrap-sass. I have a picture upload that crops the image after save it but i need to crop it before save on a bootstrap modal. Found this tutorial: http://mark.stratmann.me/content_items/image-cropping-with-rails-3-2-carrierwave-bootstrap-modals-jcrop but I'm new on Rails and it seems to complex and I don't know how to merge this things with my code. Other thing that i need to do and don't know how, is keep the original file after crop.

My files:

users_controller.rb:

class UsersController < ApplicationController
  def index
    @users = User.all
  end

  def show
    @user = User.find(params[:id])
  end

  def new
    @user = User.new
  end

  def create
    @user = User.new(user_params)
    if @user.save
      if params[:user][:avatar].present?
        render :crop
      else
        redirect_to @user, notice: "Successfully created user."
      end
    else
      render :new
    end
  end

  def edit
    @user = User.find(params[:id])
  end

  def update
    @user = User.find(params[:id])
    if @user.update_attributes(user_params)
      if params[:user][:avatar].present?
        render :crop
      else
        redirect_to @user, notice: "Successfully updated user."
      end
    else
      render :new
    end
  end

  def destroy
    @user = User.find(params[:id])
    @user.destroy
    redirect_to users_url, notice: "Successfully destroyed user."
  end

  private

  def user_params
    params.require(:user).permit(:name, :avatar, :crop_x, :crop_y, :crop_w, :crop_h)
  end

end

user.rb

class User < ActiveRecord::Base
  mount_uploader :avatar, AvatarUploader
  after_update :crop_avatar

  attr_accessor :crop_x, :crop_y, :crop_w, :crop_h

  def crop_avatar
    if crop_x.present?
      mini_magick = MiniMagick::Image.open(self.avatar.large.path)
      crop_params = "#{crop_w}x#{crop_h}+#{crop_x}+#{crop_y}"
      mini_magick.crop(crop_params)
      mini_magick.write(self.avatar.path)
      avatar.recreate_versions!
    end
  end

end

avatar_uploader.rb:

class AvatarUploader < CarrierWave::Uploader::Base
  include CarrierWave::MiniMagick

  storage :file

  def store_dir
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end

  version :large do
    resize_to_limit(600, 600)
  end

  version :thumb do
    process :crop
    resize_to_fill(100, 100)
  end

  def crop
    if model.crop_x.present?
      resize_to_limit(600, 600)
      manipulate! do |img|
        x = model.crop_x.to_i
        y = model.crop_y.to_i
        w = model.crop_w.to_i
        h = model.crop_h.to_i
        img.crop "#{model.crop_x}x#{model.crop_y}+#{model.crop_w}+#{model.crop_h}"
        img
      end
    end
  end
end

users.js.coffee:

jQuery ->
  new AvatarCropper()

class AvatarCropper
  constructor: ->
    $('#cropbox').Jcrop
      aspectRatio: 1
      setSelect: [0, 0, 600, 600]
      onSelect: @update
      onChange: @update

 update: (coords) =>
   $('#user_crop_x').val(coords.x)
   $('#user_crop_y').val(coords.y)
   $('#user_crop_w').val(coords.w)
   $('#user_crop_h').val(coords.h)
   @updatePreview(coords)

  updatePreview: (coords) =>
      $('#preview').css
              width: Math.round(100/coords.w * $('#cropbox').width()) + 'px'
              height: Math.round(100/coords.h * $('#cropbox').height()) + 'px'
              marginLeft: '-' + Math.round(100/coords.w * coords.x) + 'px'
              marginTop: '-' + Math.round(100/coords.h * coords.y) + 'px'

I've based it on rails cast #182. Thank you.

来源：https://stackoverflow.com/questions/21027034/rails-carrierwave-jcrop-bootstrap