(function($) {
	var params = new Array;
	var order = new Array;
	var images = new Array;
	var interval = new Array;
	var imagePos = new Array;
	var appInterval = new Array;	
	var squarePos = new Array;
	var reverse = new Array;
	var elhack;
	
	$.fn.bgslide = function(options){
		$(window).bind("resize", function() {
			$.each($('.cs-background'), function(){
				tWidth = sWidth = parseInt($(window).width()/params['background'].spw);
				tHeight = sHeight = parseInt($(window).height()/params['background'].sph);
				counter = sLeft = sTop = 0;
				tgapx = gapx = $(window).width() - params['background'].spw*sWidth;
				tgapy = gapy = $(window).height() - params['background'].sph*sHeight;
				var img = new Image();
				img.src = images['background'][imagePos['background']];
				var ratio = img.height / img.width;
				var browserheight = $(window).height();
				var browserwidth = $(window).width()
				if ((browserheight/browserwidth) > ratio){
				    var img_w = browserheight / ratio;
				    var img_h = browserheight;
				} else {
				    var img_w = browserwidth;
				    var img_h = browserwidth * ratio;
				}
				var bgsize = img_w + 'px auto';
				for(i=1;i <= params['background'].sph;i++){
					gapx = tgapx;
						if(gapy > 0){
							gapy--;
							sHeight = tHeight+1;
						} else {
							sHeight = tHeight;
						}
					for(j=1; j <= params['background'].spw; j++){
						if(gapx > 0){
							gapx--;
							sWidth = tWidth+1;
						} else {
							sWidth = tWidth;
						}
						order['background'][counter] = i+''+j;
						counter++;	
						$("#cs-background"+i+j).css({ 
							'background-position': -sLeft +'px '+(-sTop+'px'),
							'left' : sLeft ,
							'top': sTop,
							'background-size': bgsize,
							'-moz-background-size': bgsize,
							'-webkit-background-size': bgsize,
							'-o-background-size': bgsize,
							'width': sWidth,
							'height': sHeight
						});
						sLeft += sWidth;
					}
					sTop += sHeight;
					sLeft = 0;					
				}
			});
		});
		
		init = function(el){
			order[el.id] 		= new Array();
			images[el.id]		= new Array();
			imagePos[el.id]		= 0;
			squarePos[el.id]	= 0;
			reverse[el.id]		= 1;
			elhack = el;
			
			params[el.id] = $.extend({}, $.fn.bgslide.defaults, options);
			
			$.each($('#'+el.id+' img'), function(i,item){
				images[el.id][i] = $(item).attr('src');
				$(item).hide();
				$(item).next().hide();
			});			
						
			$.setFields(el);
			
			
			$.transition(el,0);
			$.transitionCall(el);
				
		}
		
		$.setFields = function(el){
			
			tWidth = sWidth = parseInt(params[el.id].width/params[el.id].spw);
			tHeight = sHeight = parseInt(params[el.id].height/params[el.id].sph);
			
			counter = sLeft = sTop = 0;
			tgapx = gapx = params[el.id].width - params[el.id].spw*sWidth;
			tgapy = gapy = params[el.id].height - params[el.id].sph*sHeight;

			
			for(i=1;i <= params[el.id].sph;i++){
				gapx = tgapx;
				
					if(gapy > 0){
						gapy--;
						sHeight = tHeight+1;
					} else {
						sHeight = tHeight;
					}
				
				for(j=1; j <= params[el.id].spw; j++){	

					if(gapx > 0){
						gapx--;
						sWidth = tWidth+1;
					} else {
						sWidth = tWidth;
					}

					order[el.id][counter] = i+''+j;
					counter++;
					
					$('#'+el.id).append("<div class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></div>");
					
								
					$("#cs-"+el.id+i+j).css({ 
						'background-position': -sLeft +'px '+(-sTop+'px'),
						'left' : sLeft ,
						'top': sTop
					});
				
					sLeft += sWidth;
				}

				sTop += sHeight;
				sLeft = 0;					
			}
		};
				
		$.transitionCall = function(el){
			clearInterval(interval[el.id]);	
			delay = params[el.id].delay + params[el.id].spw*params[el.id].sph*params[el.id].sDelay;
			interval[el.id] = setInterval(function() { $.transition(el)  }, delay);
		}
		
		// transitions
		$.transition = function(el,direction){
			
			if(params[el.id].pause == true) return;
			
			$.effect(el);
			
			squarePos[el.id] = 0;
			appInterval[el.id] = setInterval(function() { $.appereance(el,order[el.id][squarePos[el.id]])  },params[el.id].sDelay);
			
			var img = new Image();
			img.src = images[el.id][imagePos[el.id]];
			var w = img.width;
			var h = img.height;
			
			imagePos[el.id]++;
		
			if  (imagePos[el.id] == images[el.id].length || images[el.id][imagePos[el.id]] == '' || images[el.id][imagePos[el.id]] == null ) {
				imagePos[el.id] = 0;
			}
									
		};
		
		$.appereance = function(el,sid){

			if (squarePos[el.id] == params[el.id].spw*params[el.id].sph) {
				clearInterval(appInterval[el.id]);
				return;
			}
			
			var img = new Image();
			img.src = images[el.id][imagePos[el.id]];
			var ratio = img.height / img.width;	
			
			var browserheight = $(window).height();
			var browserwidth = $(window).width()
			
			if ((browserheight/browserwidth) > ratio){
			    var img_w = browserheight / ratio;
			    var img_h = browserheight;
			} else {
			    var img_w = browserwidth;
			    var img_h = browserwidth * ratio;
			}

			var bgsize = img_w + 'px auto';
						
			$("#cs-"+el.id+sid).css({ 
				'background-size': bgsize,
				'-moz-background-size': bgsize,
				'-webkit-background-size': bgsize,
				'-o-background-size': bgsize
			});

			$('#cs-'+el.id+sid).css({ opacity: 0, 'background-image': 'url('+images[el.id][imagePos[el.id]]+')' });
			$('#cs-'+el.id+sid).animate({ opacity: 1 }, 300);
			squarePos[el.id]++;
			
		};



		// effects
		$.effect = function(el){
			counter = 0;
			  for(i=1;i <= params[el.id].sph;i++){
			  	for(j=1; j <= params[el.id].spw; j++){	
			  		order[el.id][counter] = i+''+j;
					counter++;
			  	}
			  }	
			$.random(order[el.id]);			
			reverse[el.id] *= -1;
			if(reverse[el.id] > 0){
				order[el.id].reverse();
			}
		}

		$.random = function(arr) {			
		  var i = arr.length;
		  if ( i == 0 ) return false;
		  while ( --i ) {
		     var j = Math.floor( Math.random() * ( i + 1 ) );
		     var tempi = arr[i];
		     var tempj = arr[j];
		     arr[i] = tempj;
		     arr[j] = tempi;
		   }
		}		
	
		this.each (
			function(){ init(this); }
		);
	};
	
	// default values
	$.fn.bgslide.defaults = {	
		width: $(window).width(), // width of slider panel
		height: $(window).height(), // height of slider panel
		spw: 4, // squares per width
		sph: 3, // squares per height
		delay: 10000, // delay between images in ms
		sDelay: 100, // delay beetwen squares in ms
		effect: 'random'// random, swirl, rain, straight	
	};
	
	$.fn.bgslide.plop = function(bg, bg2, bg3) {
		images = new Array();
		images['background'] = new Array();
		if (bg != '' || bg != null) images['background'][0] = bg;
		if (bg2 != '' || bg2 != null) images['background'][1] = bg2;
		if (bg3 != '' || bg3 != null) images['background'][2] = bg3;
		imagePos['background'] = 0;
		
		$.transition(elhack);
		$.transitionCall(elhack);
		
	};
	
})(jQuery);
