var EditedAttachment = Class.create({
	initialize: function(original, medium, edited)
	{
		this.original = original;
		this.edited = edited;
		
		
		this.id = original.id;
		this.page = original.page_id;
				
		this.width = original.width;
		this.height = original.height;
		
		
		this.mWidth = medium.width;
		this.mHeight = medium.height;
		
		this.rX = this.width/this.mWidth;
		this.rY = this.height/this.mHeight;
		
		this.widthE = $("edited_width");
		this.heightE = $("edited_height");
		
		this.x1E = $("edited_x1");
		this.y1E = $("edited_y1");
		this.x2E = $("edited_x2");
		this.y2E = $("edited_y2");

		var umthis = this;
		
		this.coords = {
			x1: Math.floor(umthis.x1E.value/umthis.rX),
			y1: Math.floor(umthis.y1E.value/umthis.rY),
			x2: Math.floor(umthis.x2E.value/umthis.rX),
			y2: Math.floor(umthis.y2E.value/umthis.rY)
		},
		
		this.croppers = $H();
		
		Event.observe($("image"), "load", function () {
		
		umthis.imageLoaded();
		
		});
	},
	
	
	imageLoaded: function()
	{
		var umthis = this;
		 
				Presets.keys().each(function(key) {
					var preset = Presets.get(key);
					var options = {
						onEndCrop: function(c,d) { umthis.cropped(c, d)},
						onloadCoords: umthis.coords,
						displayOnInit: true
					}

					preset.options.keys().each(function (pkey){
							options[pkey] = preset.options.get(pkey)
					});

					if (preset.options.get("ratioDim"))
					{
						var rd = preset.options.get("ratioDim");
						options["minWidth"] = Math.floor(rd.x/umthis.rX);
						options["minHeight"] = Math.floor(rd.y/umthis.rY);
					}

					umthis.croppers.set(key, new Cropper.Img("image", options));
					umthis.croppers.get(key).remove();
				});

				this.cropper = null;

				this.presetE = $("preset");
				new Form.Element.EventObserver(this.presetE, function () { umthis.changePreset() });

				umthis.changePreset();
		
	},

	
	cropped: function(coords, dimensions)
	{
		this.x2E.value = Math.floor(this.rX*coords.x2);
		this.y2E.value = Math.floor(this.rY*coords.y2);
		this.x1E.value = Math.floor(this.rX*coords.x1);
		this.y1E.value = Math.floor(this.rY*coords.y1);
		
		if (this.preset)
		{
			this.preset.cropped(coords, dimensions, this);
		}
	},
	
	changePreset: function()
	{
		var id = this.presetE.value;
		var preset = Presets.get(id);
		
		this.croppers.values().each(function(cropper) {
			cropper.remove();
		});
		
		this.cropper = this.croppers.get(id);
		this.cropper.reset();
		this.preset = preset;
	},
	
	round: function()
	{
		if (this.roundE.checked)
		{
			this.cropper.remove();
			this.roundCropper.reset();
		}
		else
		{
			this.roundCropper.remove();
			this.cropper.reset();
		}
	}
});

var Presets = $H({
	regular: {
		options: $H(),
		cropped: function (c, d, a)
		{
			a.widthE.value = Math.floor(d.width*a.rX);
			a.heightE.value = Math.floor(d.height*a.rY);
		}
	},
	polaroid: {
		options: $H(),
		cropped: function (c, d, a)
		{
			a.widthE.value = Math.floor(d.width*a.rX);
			a.heightE.value = Math.floor(d.height*a.rY);
		}
	},
	mini: {
		options: $H({ratioDim: { x: 142, y: 74 }}),
		cropped: function (c, d, a)
		{
			a.widthE.value = 142;
			a.heightE.value = 74;
		}
	},
	primary: {
		options: $H({ ratioDim: { x: 447, y: 150 }}),
		cropped: function (c, d, a)
		{
			a.widthE.value = 447;
			a.heightE.value = 150;
		}
	},
	secondary: {
		options: $H({ ratioDim: { x: 250, y: 100 }}),
		cropped: function (c, d, a)
		{
			a.widthE.value = 250;
			a.heightE.value = 100;
		}
	}
});

function sample()
{
	new Ajax.Request("/pages/" + editedAttachment.page + "/attachments/sample",
	{
		parameters: $("edited-form").serialize(),
		method: 'put',
		onFailure: unsample
	});
}

function resample(path)
{
	$("sample").src = path;
	new Effect.Fade("sample-loader");
	$("sample-huh").hide();
}

function unsample()
{
	new Effect.Fade("sample-loader");
	$("sample-huh").show();
}