Hola a todos :
Quiero poner una opción a mi web que me permita seleccionar una imagen y despues de forma visual seleccionar un cuadro que será el recorte de mi imagen final (cropping). Sé que en google hay muchos ejemplos y cada uno de su padre y madre pero quería saber vuestra experiencia si alguien ha utilizado esta tecnica para saber por cual libreria js o ejemplo se ha decantado.
A mi me gusta este ejemplo http://www.w3bees.com/2013/08/image-upload-and-crop-with-jquery-and.html que es muy sencillo (pesa poco el js y el codigo fuente) y cumple las espectativas de lo que indico. El problema según he leido los comentarios es que no funciona con navegadores antiguos porque usa html5 y que lo que tendría que hacer es modificar el codigo fuente para subir la imagen al servidor y alli aplicar el recorte.
Algun consejo?
Gracias!!
Creo que voy a eliminar el codigo
// prepare HTML5 FileReader
var oFReader = new FileReader();
oFReader.readAsDataURL(document.getElementById("uploadImage").files[0]);
de forma sea compatible en todos los navegadores (html5 no soportados). Lo que haré es subir la imagen a un directorio temporal de mi servidor, luego muestro la imagen en pantalla, selecciono la zona de recorte (crop), subo la imagen esta vez en el directorio donde corresponda y por ultimo borro la imagen que puse en el directorio temporal.
No obstante esperare algún consejo de alguien que se haya tocado ya con este problema. :)
Aca podes ver una lista de navegadores que soportan FileReader()
http://caniuse.com/#feat=filereader
Si, tenes que subir la imagen al servidor, mostrarla, recortarla(utiliza un plugin llamado imgAreaSelect), subir la imagen recortada y borrar la imagen temporal.
Gracias!! :)