Implementare plugin JCrop e upload Ajax/Jquery

marcopietro

Implementare plugin JCrop e upload Ajax/Jquery

Buonasera a tutti
volevo chiedervi se qualcuno ha mai implementato uno script del genere:

all'interno di un form (quindi con immissione del nome dell'immagine) vorrei inserire un upload multiplo (Ajax/Jquery) con l'impiego del plugin JCrop per ritagliare l'immagine.

Avete dei suggerimenti o dei buoni script ?
Ne ho visti a decine (9lessons, GT Forum, ecc...) ma tutti complessi per essere integrati con le caratteristiche che vi ho elencato sopra...

Grazie

claudioweb

Ciao, a parte la differenza php/asp questo tutorial credo potrà aiutarti
http://www.mikesdotnetting.com/Article/95/Upload-and-Crop-Images-with-jQuery-JCrop-and-ASP.NET

marcopietro

Ciao
grazie della risposta.
Ho trovato uno script eccezionale:

trentrichardson/UberUploadCropper su github.

Ho un dubbio:
come vedete dal codice che mi metto sotto io faccio l'upload, ritaglio l'immagine, premo DONE e poi ho l'immagine ritagliata sottostante.
Il mio obiettivo è inserire il link dell'immagine/i (deve funzionare per + immagini) or ora ritagliata in una pagina che creo da un semplice form php.. in poche parole aggiungere una function dopo OnComplete..come potrei fare ?


	<script type="text/javascript">
			$(function() {
				
				$('#UploadImages').uberuploadcropper({
					//---------------------------------------------------
					// uploadify options..
					//---------------------------------------------------
					//'debug'		: true,
					'action'	: 'upload.php',
					'params'	: {},
					'allowedExtensions': ['jpg','jpeg','png','gif'],
					//'sizeLimit'	: 0,
					//'multiple'	: true,
					//---------------------------------------------------
					//now the cropper options..
					//---------------------------------------------------
					'aspectRatio': 1, 
					'allowSelect': false,			//can reselect
					'allowResize' : true,			//can resize selection
					'setSelect': [ 0, 0, 200, 200 ],	//these are the dimensions of the crop box x1,y1,x2,y2
					'minSize': [ 200, 200 ],			//if you want to be able to resize, use these
					'maxSize': [ 500, 500 ],
					//---------------------------------------------------
					//now the uber options..
					//---------------------------------------------------
					'folder': 'uploads/',			// only used in uber, not passed to server
					'cropAction': 'crop.php',		// server side request to crop image
					'onComplete': function(imgs,data){ 
						var $PhotoPrevs = $('#PhotoPrevs');

						for(var i=0,l=imgs.length; i<l; i++){
							$PhotoPrevs.append('<img src="uploads/'+ imgs*.filename +'?d='+ (new Date()).getTime() +'" />');
						}
					}
				});
				
			});
		</script>
	</head>

	<body>
		<div id="wrapper">
			<h1>UberUploadCropper</h1>
			<p>Advanced Example which demonstrates the uploading a large image, scaling a smaller copy to fit the browser, crop, and resize the original full size image.  This method maintains better image quality.</p>
			
			<div id="UploadImages">
				<noscript>Please enable javascript to upload and crop images.</noscript>
			</div>

			<div id="PhotoPrevs">
				<!-- The cropped images will be populated here -->
			</div>
		</div>
	</body>