$(document).ready(function(){
	$('a[id^="add-to-favourites"]').bind('click', function(e){
		e.preventDefault();
		$.post($(this).attr('href'),{},refreshFavourites,'json');
		$('a[id^="add-to-favourites"]').hide();
		$('a[id^="remove-from-favourites"]').show();
	});
	$('a[id^="remove-from-favourites"]').bind('click',function(e){
		e.preventDefault();
		$.post($(this).attr('href'),{},refreshFavourites,'json');
		$('a[id^="remove-from-favourites"]').hide();
		$('a[id^="add-to-favourites"]').show()
	});
	$('a[id^="favourites"]').bind('click',function(e){
	    e.preventDefault();
	    $.post($(this).attr('href'),function(foo){},'json');
        $(this).hide();
        var id = $(this).attr('id');        
        if (id.search('remove') > -1){
            var slug = id.replace('favourites-list-remove-','');
            id = id.replace('remove','add');
            $('#'+slug).removeClass('is-fan');
        }else{
            var slug = id.replace('favourites-list-add-','');
            id = id.replace('add','remove');     
            $('#'+slug).addClass('is-fan');   
        }
        $('#'+id).show();
    })
});


function refreshFavourites(data){
	// Clear Fans
	if (data.error){
		alert(data.error);
		return
	}
	$('#fans').html('');
	
	// Update the latest fan
	$('li.latest-fan > div').html('');
	if(data.latest.username){
	    $('li.latest-fan > div').append($('<a />').html(data.latest.username));
    }else{
        $('li.latest-fan').remove();
    }
	
	// Update list of fans
	$.each(data.users,function(i, d){
		var img = $('<img />').attr('src',d.avatar).attr('height','50').
						attr('width','50').attr('class','thumb-small');
		
		var img_link = $('<a />').append(img);
		
		var div = $('<div />');
		
		var h4_username = $('<h4 />');
		var link_username = $('<a />').html(d.username);
		var p_from = $('<p />').html('Chap from '+d.location);
		
		h4_username.append(link_username);
		div.append(h4_username);
		div.append(p_from);
		
		var li = $('<li />').append(img_link).append(div);		
		
		$('#fans').append(li);
		
	});
}
