jQuery.fn.imageScroller = function(url, settings) {
	settings = jQuery.extend({
		count: 5,
		rows: 1,
		start: 5,
		move: 5,
		prevLinkClass: 'image-scroller-prev',
		nextLinkClass: 'image-scroller-next'
	}, settings);

	var fetch	= function(obj) {
		var opts	= {
			count: (settings.count * settings.rows),
			start: jQuery(obj).find('li').length
		}
		jQuery.getJSON(url, opts, function(json){
			if (json) {
				var i, l;
				var list = jQuery(obj).find('div.mask ul');
				for(i=0, l=json.items.length; i<l; i++) {
					var item	= json.items[i];
					if (item.type && item.type == 'teevote') {
						var s = '';
						s   += '<li id="tee'+item.productID+'" class="'+ (item.mostwanted ? ' most-wanted' : '') + '">';
						s	+= (item.mostwanted ? '<img src="/assets/images/crown.png" alt="Most Wanted" class="crown" />' : '');
						s   += '    <a href="'+item.url+'"><img src="'+item.src+'" alt="'+item.design+'" /></a>';
						s   += '    <div class="action">';
						s   += '        <a href="'+item.editurl+'" class="edit"><img src="/assets/images/profile-overlay-edit.png" width="101" height="41" alt="Edit" /></a>';
						s   += '        <a href="'+item.buyurl+'" class="buy"><img src="/assets/images/profile-overlay-buy.png" width="101" height="39" alt="Buy" /></a>';
						s   += '        <a href="#" class="send-for-votes"><img class="vote" src="/assets/images/profile-overlay-votes.png" width="101" height="39" alt="Send for Votes" /></a>';
						s   += '        <a href="#" class="archive"><img class="archive" src="/assets/images/profile-overlay-archive.png" width="101" height="39" alt="Archive" /></a>';
						s   += '    </div>';
						s   += '    <div class="salesinfo">Sales: '+item.sales+'';
						s   += '    <br />Votes: '+item.votes+'';
						s   += '    <br /><img src="/assets/images/hearts5.png" alt="" /></div>';
						s   += '</li>';
					}else if (item.type && item.type == 'viewall') {
						var s 	= '<li class="hidden'+ (item.mostwanted ? ' most-wanted' : '')+'"><a href="'+item.url+'">';
							s	+= (item.mostwanted ? '<img src="/assets/images/crown.png" alt="Most Wanted" class="crown" />' : '');
							s 	+= '<img src="'+item.src+'" alt="'+item.design+'" /></a>';
							s	+= '<div class="caption">'+item.design+' <br />by '+item.username+'</div></li>';
					}else{
						var s 	= '<li class="hidden'+ (item.mostwanted ? ' most-wanted' : '')+'"><a href="'+item.url+'">';
							s	+= (item.mostwanted ? '<img src="/assets/images/crown.png" alt="Most Wanted" class="crown" />' : '');
							s 	+= '<img src="'+item.src+'" alt="'+item.username+' wearing '+item.design+'" /></a>';
							s	+= '<div class="caption">'+item.username+' <br />wears<br /><strong>'+item.design+'</strong></div></li>';
					}


					list.append(s);
					if(item.backgroundcolor) {
						list.find('li:last').css('background-color',item.backgroundcolor);
					}
				}
				layoutItems(obj);
			}
		});
	}

	var layoutItems = function(obj) {
		var list = jQuery(obj).find('div.mask ul');
		var itemWidth	= list.find('li:first').width() + parseInt(list.find('li:first').css('margin-right').replace('px', ''));
		var itemHeight	= list.find('li:first').height() + parseInt(list.find('li:first').css('margin-bottom').replace('px', ''));

		list.find('li').each(function(i, o) {
			jQuery(o).css({
				position: 'absolute',
				left: (Math.ceil(i/settings.rows) * itemWidth) - (itemWidth * (i%settings.rows)),
				top: (i%settings.rows) * itemHeight
			}).removeClass('hidden');
		});
	}

	return this.each(function(){
		var slider 	= jQuery(this).find('.mask ul');
		var self	= this;

		fetch(self);
		jQuery(this).append('<a href="#" class="'+settings.prevLinkClass+'"><span>Prev</span></a><a href="#" class="'+settings.nextLinkClass+'"><span>Next</span></a>');
		jQuery(this).find('.'+settings.prevLinkClass).click(function(e){
			e.preventDefault();
			var items		= slider.find('li');
			var currentLeft	= parseInt(slider.css('left').replace('px',''));
			var itemWidth	= slider.find('li:first').width() + parseInt(slider.find('li:first').css('margin-right').replace('px', ''));
			var newLeft		= currentLeft + (settings.move * itemWidth);

			if (newLeft <= 0) {
				slider.animate({left: newLeft}, "slow");
			}
		});
		jQuery(this).find('.'+settings.nextLinkClass).click(function(e){
			e.preventDefault();
			var items		= slider.find('li');
			var currentLeft	= parseInt(slider.css('left').replace('px',''));
			var itemWidth	= slider.find('li:first').width() + parseInt(slider.find('li:first').css('margin-right').replace('px', ''));
			var newLeft		= currentLeft - (settings.move * itemWidth);
			//if (newLeft >= (0-(items.length * itemWidth) + (settings.count * itemWidth))) {
			if (newLeft >= (0-(items.length * itemWidth))) {
				slider.animate({left: newLeft}, "slow");

				var offscreenCount 	= (items.length / settings.rows) - ((-newLeft / itemWidth) + settings.count);
				if (offscreenCount <= settings.count) {
					fetch(self);
				}
			}
		});

	});

}