//function serialize(s)
//{
//    alert(s);
//    serial = $.SortSerialize(s);
//    alert(serial.hash);
//};



//$('div.control-bar .title').ready(
//
//    function(){
//    
//    }
//)


$('div.portlet-container').ready(
    
	function()
	{

		// Controls Drag + Drop
		$('div.portlet-container').Sortable(
			{
				accept: 'box',
				handle: 'div.control-bar',
				tolerance: 'pointer',
				helperclass: 'sort-placeholder',
				opacity: 	0.7,
				onStop:	function () 
				{
				    //alert($(this).attr("boxId"));
				    var serial = $.SortSerialize();
				    
				    var zoneNameParts = this.parentNode.id.split("_");
				    var zone = zoneNameParts.join(":");
				    var zoneItems = $('#' + this.parentNode.id + ' .box');
				    var index = 0;
				    for(var i=0;i< zoneItems.length;i++){
                        if(zoneItems[i].id == this.id){
                            index = i;
                        }
				    }
				    

				    var parentIdParts = this.parentNode.id.split("_");
				    parentIdParts.pop();
				    var newColumnName = parentIdParts.join("_");
				    var newPortletname = newColumnName + "_" + $(this).attr("boxId")
				    $(this).attr("id", newPortletname);
				    
				    var portlet = $get($(this).attr("id"));
				    var newColumn = $get(this.parentNode.id);
				    //newColumn.addControl(portlet);
				    //alert("Move Portlet:"+$(this).attr("boxId") + " " + zone + " " + index);
				    PageMethods.MovePortlet($(this).attr("boxId"), zone, index);					
				}
			}
		);
	}
);