$(document).ready(function(){
      	newSiteHtml = '<li><input type="text" class="site_name" name="site_name[]" value="" placeholder="Name" />
  \
      <input type="text" name="site_url[]" class="site_url" value=""  placeholder="URL" />
  \
  <img class="svg action delete_button" src="'+OC.imagePath("core", "actions/delete") +'" title="Remove site" /></li>';
  
  	// Handler functions
  	function addSiteEventHandler(event) {
  		event.preventDefault();
  
  		saveSites();
  	}
  
  	function deleteButtonEventHandler(event) {
  		event.preventDefault();
  
  		$(this).tipsy('hide');
  		$(this).parent().remove();
  
  		saveSites();
  	}
  
  	function saveSites() {
  		var post = $('#external').serialize();
  		$.post( OC.filePath('external','ajax','setsites.php') , post, function(data) {
  			// OC.msg.finishedSaving('#site_name .msg', data);
  		});
  	}
  
  	function showDeleteButton(event) {
  		$(this).find('img.delete_button').fadeIn(100);
  	}
  
  	function hideDeleteButton(event) {
  		$(this).find('img.delete_button').fadeOut(100);
  	}
  
  	// Initialize events
  	$('input[name^=site_]').change(addSiteEventHandler);
  	$('img.delete_button').click(deleteButtonEventHandler);
  	$('img.delete_button').tipsy();
  
  	$('#external li').hover(showDeleteButton, hideDeleteButton);
  
  	$('#add_external_site').click(function(event) {
  		event.preventDefault();
  		$('#external ul').append(newSiteHtml);
  
  		$('input.site_url:last').prev('input.site_name').andSelf().change(addSiteEventHandler);
  		$('img.delete_button').click(deleteButtonEventHandler);
  		$('img.delete_button:last').tipsy();
  		$('#external li:last').hover(showDeleteButton, hideDeleteButton);
  
  	});
  
  });