document.observe(
        	'dom:loaded',
        	widgetInit
        	);
			
function serializeDash()
{
	var output = "";
	
	output += Sortable.serialize($('leftcolumn')) + '&';
	output += Sortable.serialize($('middlecolumn')) + '&';
	output += Sortable.serialize($('rightcolumn'));
	
	return output;
}

function toggleEmpty(columns)
{
	$A(columns).each(
		function(singlecolumn)
		{
			if($(singlecolumn).down('.draggable'))
			{
				$(singlecolumn).down('.dragBox').hide();
			}
			else
			{
				$(singlecolumn).down('.dragBox').show();
			}
			
		});
}

function widgetInit(){
				var sortablessmall = document.getElementsByClassName('dash-col-small');
				toggleEmpty(sortablessmall);
				$A(sortablessmall).each(function (sortablecolsmall)
				{
				      Sortable.create(sortablecolsmall, {
				      containment: $A(sortablessmall), 
				      constraint: false,
				      tag: 'div',
				      only: 'draggable',
				      dropOnEmpty: true,
				      handle: 'handle',
				      hoverclass: 'hover_col',
				      onUpdate: function(param){ 
				      			new Ajax.Request('/widget/update/', {method: 'post', postBody: serializeDash()});
				      			toggleEmpty(sortablessmall);
				      		}
				      });
				});
				
				var sortableswide = document.getElementsByClassName('dash-col-wide');
				 
				$A(sortableswide).each(function (sortablecolwide)
				{
				      Sortable.create(sortablecolwide, {
				      containment: $A(sortableswide), 
				      constraint: false,
				      tag: 'div',
				      only: 'draggable',
				      dropOnEmpty: true,
				      handle: 'handle',
				      hoverclass: 'hover_col',
				      onUpdate: function(param){ 
				      			new Ajax.Request('/widget/update/', {method: 'post', postBody: serializeDash()});
				      		}
				      });
				});
			}