(function($){
   var KeyFrameClip = function(element, options)
   {
       var elem = $(element);
       var obj = this;
       var settings = $.extend( {
       	imagepath: 'ani/',
		imagename: 'ani_',
		suffix:'.jpg',
		images:36,
		framerate:25,
		autoplay: true,
        loop: false,
		touchcontrol:false
    	}, options);
		
		var timer	= null;
		var timer2	= null;
		var counter = 0;
		var sframe = null;
		var x = 0;
		var xNew = 0;
		var friction	= 0.5;
		var imagesProcessed = 1;
		var loadingcomplete = false;
		var started = false;
		var AImages = new Array();
		var imagenumberstring;
		var imagenumber = 0;
		var imagename= settings.imagename;
		var imagepath= settings.imagepath;
		var total = settings.images;
		var suffix = settings.suffix;
		var framer = 1000/settings.framerate;
		var framer2 = null;
		var loop = settings.loop;
		var autoplay = settings.autoplay;
		var touchcontrol = settings.touchcontrol;
		var callBack = null;
       
       

       // Private method - can only be called from within this object
       var privateMethod = function()
       {
           //console.log('private method called!');
       };
	   
	   
	   var leadingZero = function (source,n) { 
		
	
			filled = source;
			for (i=0;i<(n-source.length);i++) {
				filled = '0'+filled;
			}
			return(filled);
		}
		
		var checkLoad =  function() {
			var ready = false;
			for ( u=0; u<total; u++) {
				if(AImages[u].complete)
					ready = true;
				else
					ready = false;
			}
			if(!ready)
			 timer2 = setTimeout(checkLoad ,30);
			else{
				clearTimeout(timer2);
				launch();
			}
		}
		
		var launch = function () {
	
			loadingcomplete = true;
			elem.width(AImages[imagenumber].width);
			elem.height(AImages[imagenumber].height);
			elem.css('background', 'url('+AImages[imagenumber].src+')'); 
			if(autoplay){
				frame = total;
			autorotate();
			}
			if(touchcontrol){
				elem.bind("touchstart", startHandler);
				elem.bind("touchmove", touchHandler);
				elem.bind("touchend", stopHandler);
				elem.bind("touchcancel", stopHandler); 
				elem.css("cursor","move");
				document.getElementById(elem.attr("id")).onmousemove =  mousepos;
				document.getElementById(elem.attr("id")).onmousedown =  startHandler;
				document.getElementById(elem.attr("id")).onmouseup =  stopHandler;
				document.getElementById(elem.attr("id")).onmouseleave =  stopHandler;
				elem.bind("mouseleave", stopHandler); 
	
			}
			
		}
		
		
		var autorotate = function() { 
			
			
			imagenumber = counter;
			elem.css('background', 'url('+AImages[imagenumber].src+')'); 
			
			//alert(elem.attr('id'));
			
			if(sframe != null){
				//console.log(counter + " " + sframe);
				if(counter < total - 1 && counter != sframe){
					counter += 1;
					timer = setTimeout(autorotate,framer2);
				}else if(counter != sframe && counter == total - 1){
					counter = 0;
					
					timer = setTimeout(autorotate,framer2);
				}else{
					if(callback)
					callback();
					callback = null;
					clearTimeout(timer);
					sframe = null;
				}
				
			}else{
				if(counter < total -1){
					counter += 1;
					timer = setTimeout(autorotate,framer);
				}else{
					if(loop){
						counter = 0;
						timer = setTimeout(autorotate,framer);
					}
				}
			}
			
		}
		
		var startHandler = function (e) {
			started = true;
			sframe = null;
			//console.log("start");
			clearTimeout(timer);
			return false;	
		}
		
		
		
		var stopHandler = function (e) {
			//console.log("stop");
			started = false;
		}
		
				
		var mousepos = function(e) {
			if(started){
				//console.log("move");
				xposition = xNew;
				
				xNew = e.pageX;
				var dir = xposition - xNew;
				var delta  = Math.round((xposition - xNew)*0.2);
				if(imagenumber + delta > total)
				imagenumber = imagenumber + delta - total;
				else if(imagenumber + delta < 0)
				imagenumber = total + imagenumber + delta;
				else{
					if(delta==0) {
						if(dir<0)
							delta = -1;
						else if(dir>0)
							delta = 1;
						else if(dir==0)
							delta = 0;
					}
					imagenumber =imagenumber + delta;
				}
				//console.log(imagenumber);
				elem.css('background', 'url('+AImages[imagenumber].src+')'); 
			}
		}
		
		
		var touchHandler = function (e)
		{
			 e.preventDefault();
			  var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
			  var elm = elem.offset();
			  var x = touch.pageX - elm.left;
			  var y = touch.pageY - elm.top;
			  if(x < elem.width() && x > 0){
				  if(y < elem.height() && y > 0){
						  //CODE GOES HERE
						  if(started){
							xposition = xNew;
							xNew = touch.pageX;
							var delta  = Math.round((xposition - xNew)*0.2);
							if(imagenumber + delta > total)
							imagenumber = imagenumber + delta - total;
							else if(imagenumber + delta < 0)
							imagenumber = total + imagenumber + delta;
							else{
								if(delta==0) {
									if(dir<0)
										delta = -1;
									else if(dir>0)
										delta = 1;
									else if(dir==0)
										delta = 0;
								}
								imagenumber =imagenumber + delta;
							}
							elem.css('background', 'url('+AImages[imagenumber].src+')'); 
						}
				  }
			  }
		}
		
		
		// Public method - can be called from client code
       this.init = function()
       {
           for ( u=0; u<total; u++) {
			AImages[u] = new Image();
			imagenumberstring    = u.toString();
			var imageN            = imagename+leadingZero(imagenumberstring,total.toString().length);
			AImages[u].src = imagepath+imageN+suffix;
		   }
		   checkLoad();
       };
	   
	   this.gotoAndPlay = function(frame)
       {
          imagenumber = counter = frame;
		  autorotate();
       };
	   this.playtoAndStop = function(frame,framerate,call)
       {
		   if(!framerate)
		  	framer2 = framer;
			else 
			framer2 = 1000/framerate;
			if(call)
			callback = call;
          	sframe = frame;
		  	autorotate();
       };
	   
	   this.gotoAndStop = function(frame)
       {
		   clearTimeout(timer);
          imagenumber = counter = frame;
		  elem.css('background', 'url('+AImages[imagenumber].src+')'); 
       };
	   this.prevFrame = function()
       {
		   if(counter == 0){
				counter = total-1;
				imagenumber = counter;
					
			}else{
				counter--;
				imagenumber = counter;
			}
		  elem.css('background', 'url('+AImages[imagenumber].src+')'); 
       };
	   this.nextFrame = function()
       {
		   if(counter < total -1){
				counter++;
				imagenumber = counter;
					
			}else{
				counter = 0;
				imagenumber = counter;
			}
		  elem.css('background', 'url('+AImages[imagenumber].src+')'); 
       };
	   
	   this.currentFrame = function()
       {
          return imagenumber;
       };
   };

   $.fn.keyframeclip = function(options)
   {
       return this.each(function()
       {
           var element = $(this);
          
           // Return early if this element already has a plugin instance
           if (element.data('keyframeclip')) return;

           // pass options to plugin constructor
           var keyframeclip = new KeyFrameClip(this, options);

           // Store plugin object in this element's data
           element.data('keyframeclip', keyframeclip);
       });
   };
})(jQuery);