Geek Answers Handbook

Django cropping application with cropping tool

I need a client-side cropping application, I mean, using a cropping tool like the Jcrop jquery plugin.

I found these tools:

But the last two depend on the administrator, and the first two seem very related to their own ImageFields and models, any good solution?

We are working on a large application with many functions and it is very difficult to change the logic

+7
source share
1 answer

I think that this is what you probably will be best off writing, as it depends on how your data and models are laid out, regardless of whether you want to keep the crop (and where) if you want to keep the originals and etc. Even if you have a large application, you will probably spend more time trying to bend another code to do what you need in your situation.

(This code is very rude - I just lay out the steps really)

If you have a model with an image field, you can add a second image field to store the cropped image:

class MyModel(models.Model): image = models.ImageField(...) image_crop = models.ImageField(...)

and a form with an additional field for storing jcrop coordinates, which will be filled in the form on the client side (the field will be hidden). The form in which you save the coordinates in the field is up to you, but the idea may be to use a json dictionary (json.js on the client side and simplejson on the server side), something like:

 { 'x1' : '145', 'y1' : '200' ... }

the form:

 class MyModelForm(form.ModelForm): """ Hide a field to hold the coordinates chosen by the user """ crop_coords = forms.CharField(attrs={'style':'display:none'}) class Meta: model = MyModel

a view that handles all this:

 def some_view(request): form = request.POST if form.is_valid(): crop_coords = form.cleaned_data['crop_coords'] # decode the coords using simpleson (or however you passed them) ... # create a cropped image original_image = form.cleaned_data['image'] cropped_image = cropper(original_image.path, crop_coords) ... # save it back to the db - http://stackoverflow.com/questions/1308386/programmatically-saving-image-to-django-imagefield ...

and a function for creating a cropped image using PIL:

 # Look here: http://djangosnippets.org/snippets/224/ def cropper(original_image_path, crop_coords): """ Open original, create and return a new cropped image ...
+16
source

More articles:


All Articles