Using web-based image editors with Django apps
Intergrating FotoFlexer, Picnik and Pixlr web based image editors with Django applications
- API configuration - callback urls
- Attaching JS library
- Adding editor calls on selected images
Picnikpicnik.com is another web based image editor. It has extensive API, but it requires registration and API Key. Editor has many options, including saving the image on your computer. To save the image on our website we have to use the Export button, which may not be so obvious: It works like FotoFlexer. We open the editor with data passed in the URL (GET), and on export it will redirect to the callback url with a temporary url in GET variables. It also can POST the file on the callback url. Here is simple GET example:
- We create a URL to the editor like so:
- Such link will open up the editor. On "export" it will redirect to the callback URL with temporary image url under "file" variable.
- Saving image is like for FotoFlexer:
pixlrpixlr.com offers two editors - Pixlr Editor which is Photoshop-like and Pixlr Express, which is much simpler and easier to use. We have the API and examples.
- Download helper JS library and add it to the web page.
- Using the JS function from the library we build the URL that will open the editor. We set image url, editor type and callback urls for save and cancel ("exit") actions:
- service variable defines which editor to use - "express" or the advanced "editor"
- On save we get the temporary image url in the GET variables: