(function($){			  
	$.fn.myscroller = function(){
		var $this = $(this);
		var $clip = $this.children("ul").wrap('<div class="clip">').parent();
		
		
		var li = $(this).children().children().children();
		var li_width = li.width()// + 16;	 16 -> Padding
		
		//var total_width = li_width * li.length;
		
		var totalWidth1 = 0;
		for(var i=0;i<li.length; i++){
			totalWidth1 += $('#imageslider ul').children('li').eq(i).width();
		}
		var total_width = totalWidth1;
		
		
		li.parent().css({width: total_width});
		
		$clip.children("ul").clone().appendTo($clip);
		var $list = new Array();
		$list[0] = $clip.children("ul:first").addClass("list-1").css("left", 0);
		$list[1] = $clip.children("ul:last").addClass("list-2").css("left", $list[0].width());
		
		$('<div class="btn btn-left"></div><div class="btn btn-right"></div>').appendTo($this);
		var $btnleft = $this.children("div.btn-left");
		var $btnright = $this.children("div.btn-right");
		
		var clipwidth = $clip.width();
		var listwidth = $list[0].width();
		var left = new Array();
		left[0] = 0;
		left[1] = listwidth;
		var i = 0;	
		var scrolltimer;
		
		function initMoveLeft(){
			if(left[0] <= (-1 * listwidth))
			{
				left[0] = left[1] + listwidth;
				i = 1;
			}
			else if(left[1] <= (-1 * listwidth))
			{
				left[1] = left[0] + listwidth;
				i = 0;
			}
		}
		
		function moveLeft(v){
			initMoveLeft();
			left[0] -= v;
			left[1] -= v;
			
			$list[0].css("left", left[0]);
			$list[1].css("left", left[1]);
		}
		
		initMoveLeft();
		scrolltimer = setInterval(function(){
			moveLeft(1);
		}, 15);
		
		function initMoveRight(){

			if(left[0] > clipwidth)
			{
				left[0] = left[1] - listwidth;
				i = 1;
			}
			else if(left[1] > clipwidth)
			{
				left[1] = left[0] - listwidth;
				i = 0;
			}
		}
		
		function moveRight(v){
			initMoveRight();			

			left[0] += v;
			left[1] += v;
			
			$list[0].css("left", left[0]);
			$list[1].css("left", left[1]);
		}

		$btnleft.click(function(){
			clearInterval(scrolltimer);
			initMoveRight();
			scrolltimer = setInterval(function(){
				moveRight(3);
			}, 15);		
		});
		/*
		$btnleft.mouseleave(function(){
			clearInterval(scrolltimer);
			initMoveLeft();
			scrolltimer = setInterval(function(){
				moveLeft(1);
			}, 15);
		});
		*/
	/*	$btnright.mouseleave(function(){
			clearInterval(scrolltimer);
			initMoveLeft();
			scrolltimer = setInterval(function(){
				moveLeft(1);
			}, 15);
		});
*/
		$btnright.click(function(){
			clearInterval(scrolltimer);
			initMoveLeft();
			scrolltimer = setInterval(function(){
				moveLeft(3);
			}, 15);		
		});
	

/*		$clip.mouseenter(function(){
			clearInterval(scrolltimer);
		});
		
		$clip.mouseleave(function(){
			clearInterval(scrolltimer);
			initMoveLeft();
			scrolltimer = setInterval(function(){
				moveLeft(1);
			}, 15);
		});*/
		
		$("#playpause").click(function(){
			if($("#playpause").hasClass('playpause')){
				$(this).attr('class','play');
				$(this).html('<div></div>Scroll Carousel');
				clearInterval(scrolltimer);				
			}
			else if($("#playpause").hasClass('play')){
				$(this).attr('class','playpause');
				$(this).html('<div></div>Pause Carousel');
				clearInterval(scrolltimer);
				initMoveLeft();
				scrolltimer = setInterval(function(){
					moveLeft(1);
				}, 15);			
			}					   
			
			
		});
	};
	
	function not(value){
		return value == 0?1:0;
	}
})(jQuery);