Skip to content

Jcrop plugin for ActiveAdmin, enables cropping on image fields when editing

License

Notifications You must be signed in to change notification settings

yourtallness/active_admin_jcrop

 
 

Repository files navigation

Active Admin Jcrop

Build Status Code Climate Gem Version

Cropping feature for Active Admin

Instalation

Add to your Gemfile:

gem 'activeadmin'
# Because active_admin_jcrop autoload modules by checking plugins you use, it's
# recommended to require it explictly before active_admin_jcrop
# e.g. if you use carrierwave
# gem 'carrierwave', :require => 'carrierwave'
gem 'active_admin_jcrop' #, git: 'git://github.com/Ricardonacif/active_admin_jcrop.git'

Configure your form to use Jcrop:

# RAILS_ROOT/app/admin/post.rb
ActiveAdmin.register Post do

  jcropable
  
  form do |f|                         
    f.inputs "Details" do
      f.input :image, as: :jcropable
    end                      
    f.actions
  end              
  
end

If you use Paperclip, you might need to set an empty original style hash so the processor can work correctly (this is needed in the latest versions of Paperclip, not really sure why:

has_attached_file :attachment, :styles => {:original => {}}
                    

If CarrierWave is used, please invoke :active_admin_crop in your uploader, and include both modules:

class AvatarUploader < CarrierWave::Uploader::Base

  include CarrierWave::MiniMagick
  include ActiveAdminJcrop::AssetEngine::CarrierWave

  version :thumb do
    process :active_admin_crop
    process resize_to_fill: [500,320]
  end

end

Done! Now when there's a image attached, visit the edit page of the resource and click on the button Crop Image to open the crop modal. You don't need to save this resource, cropping will be done via ajax.

jCrop Options

Simple, just pass the options here:

# RAILS_ROOT/app/admin/post.rb
ActiveAdmin.register Post do

  jcropable
  
  form do |f|                         
    f.inputs "Details" do
      f.input :image, as: :jcropable,  jcrop_options: {aspectRatio: 1, showDimensions: true} # showDimensions will display the current crop dimensions in the upper left hand corner
    end                      
    f.actions
  end              
  
end

The default option for setSelect is [0,0,100,100]. For more available setting options, take a look at jCrop Manual.

Localization

Localize the crop feature by adding these entries:

    en:
      active_admin:
        crop:
          open_crop_modal: Crop Image
          save_cropped_image: Save Cropped Image
          cancel: Cancel

Dependencies

  • MRI +1.9.3 (All above 1.8.6 should work)
  • Rails 4.x (didn't tested with 3.2, but it might work)
  • MiniMagick

Supported ORM

  • ActiveRecord
  • Mongoid

Supported Asset Plugin

  • CarrierWave
  • Paperclip

TODO

  • make sure :active_admin_jcrop load after paperclip/carrierwave load
  • automate :active_admin_jcrop for CarrierWave uploader

Contributing

Any help is encouraged. Here are some ways you can contribute:

  • by using it
  • by telling people
  • by reporting bugs or suggesting new features on github issue tracker
  • by fixing bugs or implementing features

Thanks

This gem was based on Rails Admin Jcrop, so I'd like to thank those developers. Also, a special thanks to everyone that contributed to Active Admin and jCrop.

About

Jcrop plugin for ActiveAdmin, enables cropping on image fields when editing

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • Ruby 82.1%
  • HTML 9.0%
  • CoffeeScript 5.6%
  • CSS 2.3%
  • JavaScript 1.0%