var jsonVisitorBrowser = {

	d: new Date,
	
	doChange: function() {

		var distance = parseInt($('#visitor-distance').val());
		jsonVisitorBrowser.update(distance);

		return;	
	},

	init: function(distance) {
	
		jsonVisitorBrowser.update(distance);
	},
	
	update: function(distance) {

		$('#visitor-browser-user-icon-box').empty();	

		$.get(
			'/a/visitors.api/' + jsonVisitorBrowser.d.getTime(),
			{ 'of':curBlogsterProfile.username,'distance':(3600*24*distance) },
			function(json) {
				
				var a,iter;
				var html = '';
				
	
				if(json.visitors.length) {
					for(a in json.visitors) {
						json.visitors[a].username = json.visitors[a].username.replace(/-/g,'‑');
						html += '<div style="display:none;" class="user-icon"><a href="' + json.visitors[a].profileURL + '"><img src="' + json.visitors[a].avatarURL + '" /></a><br />' +
							'<a href="' + json.visitors[a].profileURL + '">' + json.visitors[a].username + '</a><br />' + json.visitors[a].timeAgo +
							'</div>';
					}
				} else {
					html = '<blockquote><em>This <b>blog</b> page hasn\'t been visited by other members in the last <b>' + ((distance == 1)?('24 hours'):(distance  + ' days')) + '</b>. <em><a href="http://www.blogster.com/explore/profiles">Invite friends</a> to get more visitors.</em></blockquote>';				
				}

				iter = 1;				
				$('#visitor-browser-user-icon-box')
					.html(html)
					.children('div.user-icon')
					.each(function() {
						var element = this;
						setTimeout(function() {
							$(element).fadeIn('fast');					
						},(iter * 20));
						++iter;			
					});
				
				jsonVisitorBrowser.loadingHide();
			
				return;
			}, 'json'		
		);

	},
	
	loadingShow: function() {
		$('#visitor-browser-loading').fadeIn('fast');
		return;
	},
	
	loadingHide: function() {
		$('#visitor-browser-loading').fadeOut('fast');
		return;
	}

};

$(document).ready(function() {
	setTimeout(function(){ jsonVisitorBrowser.init(parseInt($('#visitor-distance').val())); },750);
	return;
});