var crop = false;
function onCropComplete(crop) {
	$('coord_x').set('value', crop.left);
	$('coord_y').set('value', crop.top);
	$('coord_width').set('value', crop.width);
	$('coord_height').set('value', crop.height);
}

function resizeLayout() {
//	$('layout').setStyle('height', ($('loadedImage').getSize().y ? $('loadedImage').getSize().y.toInt() : $('loadedImage').get('height').toInt()) + 240);	
} 

window.addEvent('domready', function() {
	if($('loadedImage')) {
		var myImage = new Asset.image($('loadedImage').get('src'), {'onload': function() {			
			createArea($('loadedImage'));
			resizeLayout();
		}});
	}
});

var r = 0;
function rotate(val) {
	r += val;
	$('cropWrapper_loadedImage').dispose();
	var Req = new Request.JSON({
		url: '/app/ajax/ajax.php',
		method: 'post',
		onSuccess: function(response) {
						$('rotated').set('value', 1);
						var myImage = new Asset.image(response.src, {'onload': function() {
							response.id = 'loadedImage';
							new Element('img', response).replaces($('loadedImage'));
							$('loadedPictureContainer').setStyle('width', response.width);
							createArea($('loadedImage'));
							resizeLayout();
						}}) 
				}
		}).send('a=rotate&deg='+(90*r)+'&pid='+$('pid').value);
}

function createArea (image, coordsArray) {
	if(!image.src) return true;
	image = $(image.id);
	if($('cropWrapper_' + image.get('id'))) {
		$('cropWrapper_' + image.get('id')).dispose();
		image.show();
		if(crop) crop = false;
		if(cropArea) cropArea = false;
	}	
	var options = {'maskColor':	'white', 'showHandles': true, 'imageId': image.get('id')};
	var c_x = 0;
	var width = image.getSize().x ? image.getSize().x.toInt() : image.get('width').toInt();
	var height = image.getSize().y ? image.getSize().y.toInt() : image.get('height').toInt();
	var cropArea = new MooCrop(image.get('id'), options);
	if(!coordsArray) {
		var coordsArray = {'top': 0, 'left': c_x, 'width': width - 20, 'height': height - 20};
	}
	cropArea.setCoords(coordsArray);
	onCropComplete(coordsArray);
	cropArea.addEvent('onComplete', function (imgsrc, crop, bound, handle) {
		onCropComplete(crop, this.options.imageId == 'loadedBgImage');
	});
}