$(document).ready( function() {
	// This line was in the old code, looked like it might be useful, not sure if its still needed
	$('.pod').addClass('pod-javascript-enabled');
	// Line ends
		
	// Initialise the draggable items, refer to the relevant function below the $(document).ready() block
	ck_initialise_draggable("#PodContainer .cell .pod");

	// Initialise the droppable items, this can just be done here, only needs doing once.
	$("#PodContainer .cell").droppable({
		accept: '.pod',
		hoverClass: 'hover',			
		drop: function(event, ui) {
			// Place the item into this droppable element 
			var previous_parent = ui.draggable.parent('.cell');

			// Clone the droppable element, delete the original and wipe out the style attribute
			var cloned_draggable = $(ui.draggable).clone();

			$('.pod', previous_parent).remove();
			// Workaround for an IE bug, can't delete the element here, if we do we get JS errors
			 
			

			$(cloned_draggable).removeAttr('style');
						
			// Make the cloned item draggable again, then append it into the current droppable item. 
			ck_initialise_draggable(cloned_draggable);
			
			
			var cloned_element_id = $(cloned_draggable).attr('id');
			var my_tooltip = $("#"+cloned_element_id+"-tooltip");
			
			$(cloned_draggable).bind('mouseover.tooltip', function(){
				my_tooltip.css({opacity:1, display:"none"}).fadeIn(400); // opacity was originally 0.8
			}).bind('mousemove.tooltip', function(kmouse){
				my_tooltip.css({left:kmouse.pageX+10, top:kmouse.pageY+5});
			}).bind('mouseout.tooltip', function(){
				my_tooltip.fadeOut(400);
			}).bind('mousedown.tooltip', function(){
				my_tooltip.fadeOut(400);
			});		

			
			$(this).append(cloned_draggable);
			
			// Disable dropping on this item, and re-enable it on the previous item.
			$(previous_parent).droppable('enable');
			$(this).droppable('disable');	
			
			ck_save_settings();
		                        $('.pod', previous_parent).remove();
                        $('.pod', previous_parent).remove();
}
	});
	
	// For some reason, we cannot use the create event of the droppable items for this as it never runs.
	$("#PodContainer .cell").each(function() {
		// Deactivate this droppable if it has any draggable items in it (the count should only ever be 1 or 0, but I am not going to rely on that)
		if($('.module-content', this).size() > 0 ) {
			$(this).droppable('disable');
		}		
	});
});

// This needs to be done in a function for later use as we apparently cannot clone or
// detach a draggable item with its events attached without spawning hundreds of errors.
function ck_initialise_draggable(target_elements) {
  $(target_elements).draggable({
    revert: 'invalid',
    opacity: 0.8,
    containment: 'document',
    zIndex: 8000,
    appendTo: 'div#body',
    helper: 'clone',	
    start: function(event, ui) {
      // Disable the tool tip while dragging
      $('.tool-tip', this).unbind('.tooltip');	
      $(this).css('display', 'none');			
    },
    stop: function(event, ui) {
      $(this).css('display', 'block');
    }
  });
}


// Function for saving the updated settings
function ck_save_settings() {
	var item_list = new Object();
	items_to_save = $("#PodContainer .cell div.pod").toArray();	
	
	for(var i in items_to_save) {
		current_item = items_to_save[i];
		
		cell_id = $(current_item).parent('.cell').attr('id');
		pod_id = $(current_item).attr('id');
		item_list[cell_id] = pod_id;
		
	}	

    jsonString = $.toJSON(item_list);
	jsonString = jsonString.replace(/ /g, "");	

	$.cookie('wicked_pods_arrangement', jsonString,{
        expires: 99,
        path: '/'
    });    
}