-
Notifications
You must be signed in to change notification settings - Fork 53
Aviary Phoenix Online Image Editor Integration
Fleximage provides some hooks to allow users to edit images in Phoenix, the online image editor by Aviary.
The approach of fleximage will work best with a RESTful controller, dedicated to managing a single Fleximage model. Let’s say a class named Photo
.
Before you play with Aviary in development, you have change the way you get to your local app server. The Aviary API works by passing a URL to an image to edit. If that URL starts with http://localhost:3000
then Aviary will have no clue how to get your image. So you need to use an address that allows Aviary to pull image data from your development machine.
In order to test on your local app server during development you need to use a real IP address. Start by going to your external IP (http://whatismyip.com/) and see if that works. For example:
http://1.22.333.123:3000/If that doesn’t work, you may need to edit your router settings to route port 3000 to a local IP on your network that is your development machine. Once you get the site accessible on this external IP address, you can test Aviary integration.
In production when the site is live on it’s own domain, this is not a concern at all and should just work.
Get an API key here: http://aviary.com/apidocs
Then simply create a new initializer in your app and set it.
#config/initializers/aviary_api_key.rb
Fleximage::AviaryController.api_key = 'myApiKeyHere'
All the interaction with Aviary is handled in the controller. To make things simple, there is a controller class method editable_in_aviary
which enables a controller with a few hooks that can talk to the Avairy API. You want to pass in the Fleximage enabled class that you will be editing images for.
#photos_controller.rb
class PhotosController < ApplicationController
editable_in_aviary Photo
# plus the standard restful controller actions...
end
Fleximage adds a helper named link_to_edit_in_aviary
Clicking a link created by this helper will open the Phoenix editor in a new window with the master image for this record ready for editing. When the user saves the image, Aviary posts the image back to your application where your controller saves it with the corresponding record.
#photos/show.html.erb
<%= link_to_edit_in_aviary 'Edit Photo', @photo %>
That’s all there is to it. Support right now is young and rigid, so patches to make this a bit more flexible sure are welcome.