var jsonFriendBrowser = {

	page: null,
	pageCount: null,
	pageDirection: 1,
	occupied: false,

	init: function() {
	
		jsonFriendBrowser.page = 1;
		jsonFriendBrowser.update();	
	
		return;
	},
	
	update: function() {

		var d = new Date;
		jsonFriendBrowser.loadingShow();

		$.get(
			'/a/friends.api/' + d.getTime(),
			{ 'of':curBlogsterProfile.username,
				'num': 100,
				'page': jsonFriendBrowser.page },
			function(json) {
				var a;
				var html = '';
				
				for(a in json.friends) {
					//if($('#friend-icon-' + json.friends[a].id).get(0)) continue;
					
					html += '<div id="friend-icon-' + json.friends[a].id + '" class="user-icon" style="display:none;width: 74px;height:88px;">'+
						'<a href="' + json.friends[a].profileURL + '"><img style="width: 66px;height:66px;" src="' + json.friends[a].avatarURL + '" /></a><br />' +
						'<a href="' + json.friends[a].profileURL + '">' + json.friends[a].username + '</a>' +
						((json.owner)?('<div class="options"><img src="/style/blogster/gfx/action/delete-24.png" class="magic" onclick="javascript:jsonFriendBrowser.deleteFriend(\'' + json.friends[a].id + '\');" /></div>'):('')) +
						'</div>';
				}

                jsonFriendBrowser.pageCount = Math.ceil(json.total / 100);
                
				$('.profile-friends-browser-remote').html(
                    '<img class="friends-browser-remote-prev" style="'+((jsonFriendBrowser.page > 1)?('cursor:pointer;'):(''))+'" src="/style/blogster/gfx/' + ((jsonFriendBrowser.page > 1)?('arrow-back'):('arrow-back-off')) + '.png" />' +
                    'page ' + jsonFriendBrowser.page + ' of ' + jsonFriendBrowser.pageCount +
                    '<img class="friends-browser-remote-next" style="'+((jsonFriendBrowser.page < jsonFriendBrowser.pageCount)?('cursor:pointer;'):(''))+'"src="/style/blogster/gfx/' + ((jsonFriendBrowser.page < jsonFriendBrowser.pageCount)?('arrow'):('arrow-off')) + '.png" />'
                );

                $('div.profile-friends-browser-remote img.friends-browser-remote-prev').click(jsonFriendBrowser.prev);
                $('div.profile-friends-browser-remote img.friends-browser-remote-next').click(jsonFriendBrowser.next);

				
				$('div#friend-user-icon-box').empty();
				$('div#friend-user-icon-box').append(html);
				
				var iter = 1;
				$('div#friend-user-icon-box div.user-icon:hidden').each(function() {
					$(this).show();
					++iter;
				});
				
				$('div#friend-user-icon-box div.user-icon img.magic').mouseover(imageHoverMagic).mouseout(imageHoverMagic);
				
				jsonFriendBrowser.loadingHide();

			}, 'json'		
		);

	},
	
	loadingHide: function() {
		$('div#friend-browser-loading').fadeOut();
		return;
	},

	loadingShow: function() {
		$('div#friend-browser-loading').fadeIn();
		return;
	},
	
	iconHideIsFinal: function(callb) {
		var next = $('div#friend-user-icon-box div.user-icon:visible:first').get(0);
		if(!next) { setTimeout(callb,100); }	
		return;
	},
	
	iconShowIsFinal: function(callb) {
		var next = $('div#friend-user-icon-box div.user-icon:hidden:first').get(0);
		if(!next) { setTimeout(callb,100); }
		return; 
	},
	
	deleteFriend: function(id) {

		if(confirm('Are you sure you wish to delete this friend?')) {
		$.post(
			'/app/api-internal/friend-delete.api',
			{ 'id':id },
			function(json) {
				$('div#friend-user-icon-box #friend-icon-' + id).fadeOut();
				return;			
			},'json'		
		);
		}

		return;
	},

    prev: function() {
        if(jsonFriendBrowser.occupied || jsonFriendBrowser.page <= 1) return;

        jsonFriendBrowser.occupied = false;
        //jsonFriendBrowser.hideReply();
        --jsonFriendBrowser.page;
        jsonFriendBrowser.pageDirection = 0;
        jsonFriendBrowser.update();

        return;
    },

    next: function() {
        if(jsonFriendBrowser.occupied || !jsonFriendBrowser.pageCount || jsonFriendBrowser.page >= jsonFriendBrowser.pageCount) return;

        jsonFriendBrowser.occupied = false;
        //jsonFriendBrowser.hideReply();
        ++jsonFriendBrowser.page;
        jsonFriendBrowser.pageDirection = 1;
        jsonFriendBrowser.update();

        return;
    }


};

$(document).ready(function() {
	setTimeout(jsonFriendBrowser.init,1000);
});