
	Window.onDomReady(function()
	{
		var options = {
			onStart: function()
			{
				// do not try to memorize the start coordinates of every handle here, becuase this will somethimes get the location of the handle when is is already being dragged.
				// it will also rememorize the location when rightclicking. So rightclicking while dragging will stick the handle on the rightclicked location.
				this.reverseFx = this.handle.effect('opacity', {
					duration: 250
				}).custom(0.8, 1);
			},
			onComplete: function()
			{
				this.handle.effects({
					duration: 250
				}).custom({
					'left':	[parseInt(this.handle.getStyle('left')), parseInt(this.handle.getProperty('startLeft'))],
					'top':	[parseInt(this.handle.getStyle('top')), parseInt(this.handle.getProperty('startTop'))]
				}).chain(function()
				{
					this.reverseFx.start(.8)
				}.bind(this) );
			}
		};

		$$('.dragable').each(function(el)
		{
			el.makeDraggable(options);
			el.setProperty('startLeft', el.getStyle('left'));
			el.setProperty('startTop', el.getStyle('top'));
		});
	});
