Hi there,
So, I have this photo site. When the users upload photos, they are
generally in a zip file. So the site unzips the photos and then
generates 5 versions of each one: small_thumb, large_thumb, small,
medium, and large. After it finishes that, it will forward the user
onto a page where they can edit the pictures’ title, caption and
orientation (20 pictures per page). This page uses Ajax so when you
select a photo to edit, it simply gives you the tools right within
that photo’s own div. This means each photo has it’s own save button.
Once you save, that div refreshes with the updated values (including
the new orientation of the image).
I haven’t implemented the orientation part yet, but I’m running into a
problem in my head:
Ideally I want a rotate right image and a rotate left image. When the
user clicks them I will simply rotate the image with javascript and
keep track of the clicks, all on the client-side. Then when they
save, it will process the orientation change and rotate all 6 versions
of the image (original, two thumbs, 3 smaller versions). I think that
will be fast than just rotating the original and regenerating the
other 5. Anyway: how do you rotate an image with javascript? I’ve
searched for “javascript rotate image” and “javascript image
orientation” on google, but it’s not turning up much of anything. I
don’t see anything built-in to the visual_effect part of RoR either.
Any suggestions? I want this to be as cross-browser as possible.
If anyone has a better solution to my situation, I’m up for suggestions.
Thanks, Ryan