| 
									
										
										
										
											2009-01-14 23:25:32 +00:00
										 |  |  | 		$(function(){ | 
					
						
							| 
									
										
										
										
											2009-01-21 21:37:08 +00:00
										 |  |  | 			var x = ($('#avatar_crop_x').val()) ? $('#avatar_crop_x').val() : 0; | 
					
						
							|  |  |  | 			var y = ($('#avatar_crop_y').val()) ? $('#avatar_crop_y').val() : 0; | 
					
						
							|  |  |  | 			var w = ($('#avatar_crop_w').val()) ? $('#avatar_crop_w').val() : $("#avatar_original img").attr("width"); | 
					
						
							|  |  |  | 			var h = ($('#avatar_crop_h').val()) ? $('#avatar_crop_h').val() : $("#avatar_original img").attr("height"); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2009-01-21 20:33:37 +00:00
										 |  |  | 			jQuery("#avatar_original img").Jcrop({ | 
					
						
							| 
									
										
										
										
											2009-01-14 23:25:32 +00:00
										 |  |  | 				onChange: showPreview, | 
					
						
							| 
									
										
										
										
											2009-01-21 21:37:08 +00:00
										 |  |  |     			setSelect: [ x, y, w, h ], | 
					
						
							| 
									
										
										
										
											2009-01-14 23:25:32 +00:00
										 |  |  | 				onSelect: updateCoords, | 
					
						
							|  |  |  | 				aspectRatio: 1, | 
					
						
							|  |  |  | 				boxWidth: 480, | 
					
						
							|  |  |  | 				boxHeight: 480, | 
					
						
							|  |  |  | 				bgColor: '#000', | 
					
						
							|  |  |  | 				bgOpacity: .4 | 
					
						
							|  |  |  | 			}); | 
					
						
							|  |  |  | 		}); | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 		function showPreview(coords) { | 
					
						
							|  |  |  | 			var rx = 96 / coords.w; | 
					
						
							|  |  |  | 			var ry = 96 / coords.h; | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2009-01-21 20:33:37 +00:00
										 |  |  | 			var img_width = $("#avatar_original img").attr("width"); | 
					
						
							|  |  |  | 			var img_height = $("#avatar_original img").attr("height"); | 
					
						
							| 
									
										
										
										
											2009-01-14 23:25:32 +00:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2009-01-21 20:33:37 +00:00
										 |  |  | 			$('#avatar_preview img').css({ | 
					
						
							| 
									
										
										
										
											2009-01-14 23:25:32 +00:00
										 |  |  | 				width: Math.round(rx *img_width) + 'px', | 
					
						
							|  |  |  | 				height: Math.round(ry * img_height) + 'px', | 
					
						
							|  |  |  | 				marginLeft: '-' + Math.round(rx * coords.x) + 'px', | 
					
						
							|  |  |  | 				marginTop: '-' + Math.round(ry * coords.y) + 'px' | 
					
						
							|  |  |  | 			}); | 
					
						
							|  |  |  | 		}; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 		function updateCoords(c) { | 
					
						
							| 
									
										
										
										
											2009-01-21 20:33:37 +00:00
										 |  |  | 			$('#avatar_crop_x').val(c.x); | 
					
						
							|  |  |  | 			$('#avatar_crop_y').val(c.y); | 
					
						
							|  |  |  | 			$('#avatar_crop_w').val(c.w); | 
					
						
							|  |  |  | 			$('#avatar_crop_h').val(c.h); | 
					
						
							| 
									
										
										
										
											2009-01-14 23:25:32 +00:00
										 |  |  | 		}; |