function saveLayout() { 
  var leftColumn=Sortable.wddxSerialize('content_column_l');
  var rightColumn=Sortable.wddxSerialize('content_column_r');
  new Ajax.Request('layout_handler.cfm?update=true', {
      method:'post', 
      parameters:'leftColumn='+leftColumn+'&rightColumn='+rightColumn        
      });
};

  
function previewTaglet() {
  var tagletID=$("taglets_to_add_ID").value;
  $("taglet_preview").innerHTML="Loading ... ";
  $("taglet_preview").className='';
  if (tagletID != 0) {
    var myAjax = new Ajax.Request('layout_handler.cfm', 
              { 
              method:'post', 
              parameters:'taglet='+encodeURIComponent(tagletID), 
              asynchronous:'false',
              onSuccess:showTagletPreview,
              onFailure:showFailure
              }
            );
  }
}  


function showTagletPreview(t) {
  var tagletID=$("taglets_to_add_ID").value;
  var optionID=tagletID + '_option';
  var tagletTitle=$(optionID).innerHTML;
  var taglet_content='';
  var taglet_nodes = t.responseXML.documentElement.getElementsByTagName('result')[0].childNodes;
  for(i = 0; i < taglet_nodes.length; i++)
  {
    thisNode = taglet_nodes[i];
    if (thisNode.nodeType == 3) {
      taglet_content=taglet_content+thisNode.data;
    }
  }
  
  $("taglet_preview").innerHTML="<div class=\"preview_options\"> <a href=\'#\' id=\'insert_left\' onclick=\'insertTaglet(\"left\");return false;\'>Add to Left Column</a> <a href=\'#\' id=\'insert_right\' onclick=\'insertTaglet(\"right\");return false;\'>Add to Right Column</a> <a href=\"#\" id=\'cancel_taglet\' onclick=\"closePreview();\">Cancel</a></div><div id=\"new_taglet_content\"></div>";
  $("new_taglet_content").innerHTML= "\<div id='" + tagletID + "' class='draggable' title='" + tagletTitle + "' \>" + taglet_content + "\</div\>";
}


function showFailure() {
  $("taglet_preview").innerHTML="\<a href='#' onclick='closePreview();'\>Cancel\</a\> \<p\>There was an error loading this content\</p\>";
}


function closePreview() {
  $("taglet_preview").innerHTML='';
  $("taglet_preview").className='hidden';
  }
  function insertTaglet(column) {
    if (column == 'left') {
      new Insertion.Top($("content_column_l"), $("new_taglet_content").innerHTML);
      Sortable.create( 'content_column_l', {
        tag: 'div', 
        only:'draggable', 
        overlap: 'vertical',
        scroll: window,
        constraint: false, 
        handle: 'taglet_heading',  
        dropOnEmpty:true,
        containment:["content_column_l","content_column_r" ],
        onUpdate:saveLayout
      });
      Sortable.create( 'content_column_r', {
        tag: 'div', 
        only:'draggable', 
        overlap: 'vertical',
        scroll: window,
        constraint: false,
        handle: 'taglet_heading',   
        dropOnEmpty:true,
        containment:["content_column_l","content_column_r" ],
        onUpdate:saveLayout
      });
    }
    else if (column == 'right') {
      new Insertion.Top($("content_column_r"), $("new_taglet_content").innerHTML);
      Sortable.create( 'content_column_r', {
        tag: 'div', 
        only:'draggable', 
        overlap: 'vertical',
        scroll: window,
        constraint: false,
        handle: 'taglet_heading',   
        dropOnEmpty:true,
        containment:["content_column_l","content_column_r" ],
        onUpdate:saveLayout
      });
      Sortable.create( 'content_column_l', {
        tag: 'div', 
        only:'draggable', 
        overlap: 'vertical',
        scroll: window,
        constraint: false, 
        handle: 'taglet_heading',  
        dropOnEmpty:true,
        containment:["content_column_l","content_column_r" ],
        onUpdate:saveLayout
      });
    }
    var optionID=$("taglets_to_add_ID").value + '_option';
    var optionToRemove = $(optionID);
    optionToRemove.parentNode.removeChild(optionToRemove); 
    saveLayout();
    closePreview();
  }
  
  
function removeTaglet(tagletID) {
  var elementID = 'taglet_'+tagletID;
  var elementToRemove = $(elementID);
  var newOption = document.createElement('option');
  newOption.text = $(elementID).title;
  newOption.id = elementID + '_option';
  newOption.value = elementID;
  var tagletSelect = document.getElementById('taglets_to_add_ID');
  // Add this taglet back into the select (currently last option - would be better if it was reloaded in a consistent order)
  try {
    tagletSelect.add(newOption, null); // standards compliant; doesn't work in IE
  }
  catch(ex) {
    tagletSelect.add(newOption); // IE only
  }
  // remove the div from the page
  elementToRemove.parentNode.removeChild(elementToRemove);
  saveLayout();
}


function showTagletOptions(tagletID) {
  var elementID = 'taglet_'+tagletID+'_options';
  $(elementID).style.visibility='visible';
}


function hideTagletOptions(tagletID) {
  var elementID = 'taglet_'+tagletID+'_options';
  $(elementID).style.visibility='hidden';
}

function changeCountrySelect() {
	var countryID= $('ff_country').options[ $('ff_country').selectedIndex ].value;
	var myAjax = new Ajax.Request('/ajax/non_session/get_city_list_scriptaculous.cfm?propertyType=all&countryID='+encodeURIComponent(countryID), 
	{ 
	  method:'post',
	  asynchronous:'false',
	  onSuccess:updateCitySelect
	  }
	);
}

function updateCitySelect(r,j) {
	var options = '';
	var data = eval(r.responseText);
	$('ff_city').options.length = 0;
	for (var i = 0; i < data.length; i++) {
		var opt = new Option(data[i].txt.unescapeHTML(), data[i].val);
		document.all ? $('ff_city').add(opt) : $('ff_city').add(opt,null);
	}
}

function makeValidDate() {
	day = document.theForm.selDay.options[ document.theForm.selDay.selectedIndex ].value;
	month = document.theForm.selMonth.options[ document.theForm.selMonth.selectedIndex ].value;
	year = month.substring(3,7);
	month = month.substring(0,2);
	maxDay = 31;
	if ( month == 4 || month == 6 || month == 9 || month == 11 ) {
		maxDay = 30;
	} else if ( month == 2 ) {
		if ( year%100 != 0 && year%4 == 0 ) {
			maxDay = 29;
		} else {
			maxDay = 28;
		}
	}
	document.theForm.selDay.selectedIndex = Math.min(day, maxDay) - 1;
}