var imageSrc = 'http://webcams.parosweb.com/praxis/fullsize.jpg';
var overlayImageSrc = 'http://webcams.parosweb.com/praxis/hugesize.jpg';

$(function() {

		//overlay
		myOverlay = $('#overlayLink').overlay({
			target:$('div.overlay')[0],
			start:{ top:'center', left:'center', absolute:true },
			finish:{ top:35 },
			speed:100,
			fadeInSpeed:50,
			expose: { color:'#000', opacity: 0.5, loadSpeed:250, closeSpeed:250 }
		});
		
		// image loader
		loadImage = function(){ 
		  $('#counterMsg').html( '' );
		  imageSrcUnique = imageSrc + '?' + Math.random();
			$.cacheImage( imageSrcUnique, {
				load:function(e) {
					$('#counter').html( 'Image update successful' );
					$('#webcam').attr( 'src', imageSrcUnique );
					setTimeout( initCounter, 3000 );
				},
				error:function(e) {
					$("#counter").html( 'Error while loading' );
					setTimeout( initCounter, 20000 );
				}
			});
		};
		
		// counter
		initCounter = function() {
			$('#counterMsg').html( 'Image updated in ' );
			myCounter = $("#counter").counter({
					min:"00",
					sec:"10",
					direction:"down",
					message:"Loading Image ...",
					finish_function:'loadImage()'
			});
		}


		loadOverlayImage = function(){ 
		  overlayImageSrcUnique = overlayImageSrc + '?' + Math.random();
			$.cacheImage( overlayImageSrcUnique, {
				load:function(e) {
					$('#webcamOverlay').attr( 'src', overlayImageSrcUnique );
					setTimeout( loadOverlayImage, 10000 );
				},
				error:function(e) {
					setTimeout( loadOverlayImage, 50000 );
				}
			});
		};

		// start counting when page has loaded
		initCounter();
		setTimeout( loadOverlayImage, 10000 );
});