var totalImages;
	var c = 0;
	var interval;	
	var isPlaying = false

	$(document).ready(function(){
		$('#movieShow .images').css({position: 'relative'});
		$('#movieShow .images').append('<p style="position:absolute;left: 200px; top:100px;">Loading ... 0%</p>');

		/*$('#movieShow .images img').load(function(){			
			c++;
			var ip = parseInt((c/totalImages)*100);						
			$('#movieShow .images p').text('Loading ... ' + ip + '%');			
			console.log(totalImages);
			if(c == totalImages){				
				$('#movieShow .images p').remove();
				$('#movieShow .images img').eq(0).show();
				interval = setInterval(startAnimation, 100);
				isPlaying = true;
			}
		});*/
		
		//append images
		for(var i =1; i <= 36; i++){
			var img = '<img width="420" src="java_images/' + i + '.jpg" />'
			$('#movieShow .images').append(img);
			c++;
			(function(a,c1){
				$(img).load(function(){
					var ip = parseInt((c1/36)*100);						
					$('#movieShow .images p').text('Loading ... ' + ip + '%');								
					if(c1 == 36){				
						$('#movieShow .images p').remove();
						$('#movieShow .images img').eq(0).show();
						interval = setInterval(startAnimation, 100);
						isPlaying = true;
					}
				});
			})(i,c);			
			//console.log('h');
		}
		$('#movieShow .images img').css({display: 'block', position: 'absolute', left: '0px', top: '0px'});
		$('#movieShow .images img').hide();
		//totalImages = $('#movieShow .images img').size();
			

		$('.playBtn').click(function(){		
			if(isPlaying){
				//$(this).text('Play');
				clearInterval(interval);
				isPlaying = false;
			}
			else {
				//$(this).text('Pause');
				interval = setInterval('startAnimation()', 100);
				isPlaying = true;
			}
			return false;
		});
		
		$('.rightBtn').click(function(){
			rightClick();
			return false;
		});
		$('.leftBtn').click(function(){
			leftClick();
			return false;
		});
		
		var agent = navigator.userAgent.toLowerCase();
		if(agent.indexOf('iphone') != -1 || agent.indexOf('ipad') != -1){	
			var oldX = 0;
			$('#movieShow').bind('touchstart',function(e){		
					//console.log(e.originalEvent.touches[0].pageX);
					//e.preventDefault();
					//if(e.touches.length == 1){
						var touch = e.originalEvent.touches[0];
						oldX = touch.pageX;
					//}					
				});
			$('#movieShow').bind('touchmove',function(e){					
					e.preventDefault();	
					//console.log(e.originalEvent.touches[0].pageX);
					//if(e.touches.length == 1){
						e.preventDefault();
						var touch = e.originalEvent.touches[0];
						if((touch.pageX - oldX) > 0){
							var t = touch.pageX - oldX;
							if(t%5==0){
								oldX = touch.pageX;
								rightClick();
							}
						}
						else{
							var t = oldX - touch.pageX;
							if(t%5==0){
								oldX = touch.pageX;
								leftClick();
							}
						}
					//}									
				});			
		}
		else{
			var oldX = 0;
			$('#movieShow').bind('dragstart',function( event ){
					oldX = event.pageX;
				}).bind('drag',function(ev, dd){
				
				if((ev.pageX - oldX) > 0){
					var t = ev.pageX - oldX;
					if(t%5==0){
						oldX = ev.pageX;
						rightClick();
					}
				}
				else{
					var t = oldX - ev.pageX;
					if(t%5==0){
						oldX = ev.pageX;
						leftClick();
					}
				}
				});
		}

	});
function startAnimation(){
	//if($('#movieShow img:visible).ne
	if($('#movieShow .images img:visible').next().size() == 0){
		$('#movieShow .images img:visible').hide();
		$('#movieShow .images img').eq(0).show()
	}
	else
		$('#movieShow .images img:visible').hide().next().show();
}

function rightClick(){
	if(isPlaying){
		//$('.playBtn').text('Play');
		clearInterval(interval);
		isPlaying = false;
	}
	if($('#movieShow .images img:visible').prev().size() == 0){
		$('#movieShow .images img:visible').hide();
		$('#movieShow .images img:last').show()
	}
	else
		$('#movieShow .images img:visible').hide().prev().show();
}
function leftClick(){
	if(isPlaying){
		//$('.playBtn').text('Play');
		clearInterval(interval);
		isPlaying = false;
	}
	if($('#movieShow .images img:visible').next().size() == 0){
		$('#movieShow .images img:visible').hide();
		$('#movieShow .images img:first').show()
	}
	else
		$('#movieShow .images img:visible').hide().next().show();

}