$(document).ready(function() {
	var scrollpos = new Array();
		scrollpos['lastfm'] = 1;
		scrollpos['twitter'] = 1;
		scrollpos['flickr'] = 1;
		scrollpos['diigo'] = 1;
	
	var scrollmax = new Array();
		scrollmax['lastfm'] = 0;
		scrollmax['twitter'] = 0;
		scrollmax['flickr'] = 0;
		scrollmax['diigo'] = 0;
	
	function scroll(line, dir) {
		/* get current position */
		var newpos = scrollpos[line];
		
		/* calculate new position */
		if (dir == 'right') {
			newpos = newpos + 3;
		} else if (dir == 'left') {
			newpos = newpos - 3;
		}
		
		if (newpos >= (scrollmax[line] -3)) {
			newpos = scrollmax[line] - 3;
		} else if (newpos <= 0) {
			newpos = 1;
		}
		
		
		var currentoffset = $('#div_'+line+' > div').css('left');
			currentoffset = currentoffset.substr(0, currentoffset.length-2);
		
		var newoffset = (newpos-1)*(-240);
		var deltaoffset = currentoffset-newoffset;
		var i = (scrollpos[line]-1)*(-100);
		
		/* scroll */
		$('.'+line+' > .card').each(function() {
			$(this).delay(i).animate({
				left: '-='+deltaoffset
			}, 500, function() {
				// Animation complete.
			});
			
			i = i + 100;
		});
		
		/* save new position */
		scrollpos[line] = newpos;
		
		
	}
	
	
	$('#left_lastfm').click(function() {
	  scroll('lastfm', 'left');
	});
	$('#right_lastfm').click(function() {
	  scroll('lastfm', 'right');
	});
	
	$('#left_twitter').click(function() {
	  scroll('twitter', 'left');
	});
	$('#right_twitter').click(function() {
	  scroll('twitter', 'right');
	});
	
	$('#left_flickr').click(function() {
	  scroll('flickr', 'left');
	});
	$('#right_flickr').click(function() {
	  scroll('flickr', 'right');
	});
	
	$('#left_diigo').click(function() {
	  scroll('diigo', 'left');
	});
	$('#right_diigo').click(function() {
	  scroll('diigo', 'right');
	});
	
	
	/* selections */
	$('.card').each(function() {
		$(this).hide();
	});
	
	$('.content').show();
	var i = 0;
	
	$('.lastfm > .card').each(function() {
		scrollmax['lastfm'] = scrollmax['lastfm'] + 1;
		
		if (i <= 400) {
			i = i + 100;
		}
		$(this).delay(i).fadeIn(1250);
	});
	
	$('.twitter > .card').each(function() {
		scrollmax['twitter'] = scrollmax['twitter'] + 1;
		
		if (i <= 800) {
			i = i + 100;
		}
		$(this).delay(i).fadeIn(1250);
	});
	
	$('.flickr > .card').each(function() {
		scrollmax['flickr'] = scrollmax['flickr'] + 1;
		
		if (i <= 1200) {
			i = i + 100;
		}
		$(this).delay(i).fadeIn(1250);
	});
	
	$('.diigo > .card').each(function() {
		scrollmax['diigo'] = scrollmax['diigo'] + 1;
		
		if (i <= 1600) {
			i = i + 100;
		}
		$(this).delay(i).fadeIn(1250);
	});
});