(function(){
	jQuery.fn.snapshooter = function(settings) {
		settings = $.extend({
			display: 'display',
			width: 400,
			height: 300,
			interval: 5,
			buffer: 0
		}, settings);

		var snapwindow = $(this);

		snapwindow.css({
			position: 'relative',
			width: settings.width + 'px',
			height: settings.height + 'px'
		});

		var oldSnap = $('<div></div>').css({ 
			position: 'absolute', 
			top: 0, 
			left: 0,
			width: settings.width + 'px',
			height: settings.height + 'px'
		});
		
		oldSnap.appendTo(snapwindow);

		var lastImage = null;
		var preloader = new Image();
		
		preloader.snapElements = [snapwindow, oldSnap];

		preloader.onload = function() {
			this.snapElements[0].css({  
				background: '#000 url(' + lastImage + ') 0 0 no-repeat'			
			});
			this.snapElements[1].fadeOut('fast');
		}

		var getImage = function() {
			$.post(settings.url, { 
				display: settings.display,
				buffer: settings.buffer
			}, function(data) {
				if (data.image != lastImage) {
					if (lastImage != null)
						oldSnap.css({ background: 'transparent url(' + lastImage + ') 0 0 no-repeat' }).show();
					
					lastImage = data.image;
					preloader.src = lastImage;
				}
			}, 'json');
		}
		getImage();
		setInterval(getImage, settings.interval * 1000);
	}
})();