$(function(){
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	$(".drag")
		.bind( "dragstart", function( event ){
			// ref the "dragged" element, make a copy
			var $drag = $( this ), $proxy = $drag.clone();
			// modify the "dragged" source element
			$drag.addClass("outline");
			// insert and return the "proxy" element		
			return $proxy.appendTo( document.body ).addClass("ghost");
			})
		.bind( "drag", function( event ){
			// update the "proxy" element position
			$( event.dragProxy ).css({
				left: event.offsetX, 
				top: event.offsetY
				});
			})
		.bind( "dragend", function( event ){
			// remove the "proxy" element
			$( event.dragProxy ).fadeOut( "normal", function(){
				$( this ).remove();
				});
			// if there is no drop AND the target was previously dropped 
			if ( !event.dropTarget && $(this).parent().is(".drop") ){
				// output details of the action
				//$('#log').append('<div>Removed <b>'+ this.title +'</b> from <b>'+ this.parentNode.title +'</b></div>');
				// put it in it's original <div>
				$('#nodrop').append( this );
				}
			// restore to a normal state
			$( this ).removeClass("outline");	
			
			});
	$('.drop')
		.bind( "dropstart", function( event ){
			// don't drop in itself
			if ( this == event.dragTarget.parentNode ) return false;
			// activate the "drop" target element
			$( this ).addClass("active");
			})
		.bind( "drop", function( event ){
			// if there was a drop, move some data...
			//$( this ).append( event.dragTarget );
			// output details of the action... so in this case add the title to the searchform critiriaAll
			//$(alert(event.dragTarget.title));

			$(document.getElementById("criteriaAll").value = event.dragTarget.title);	
			$(document.getElementById("criteriaView").value = event.dragTarget.title);	
			document.getElementById("dropper").innerHTML ='<br /><br /><img src="reflexstock/img/loader_transparent.gif">'
			document.getElementById("searchFormhome").submit();

			})
		.bind( "dropend", function( event ){
			// deactivate the "drop" target element
			$( this ).removeClass("active");
			});
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
});
