/*******************************************************************************
 jquery.mb.components
 Copyright (c) 2001-2010. Matteo Bicocchi (Pupunzi); Open lab srl, Firenze - Italy
 email: mbicocchi@open-lab.com
 site: http://pupunzi.com

 Licences: MIT, GPL
 http://www.opensource.org/licenses/mit-license.php
 http://www.gnu.org/licenses/gpl.html
 ******************************************************************************/

/*
 * Name:jquery.mb.bgndGallery
 * Version: 1.0
 *
 */

(function($){

	$.mbBgndGallery = {
		name:"mb.bgndGallery",
		author:"Matteo Bicocchi",
		version:"1.0",
		defaults:{
			containment:"body",
			images:[],
			controls:null,
			effect:{enter:{left:0,opacity:0},exit:{left:0,opacity:0}, enterTiming:"ease-in", exitTiming:"ease-in"},
			timer:4000,
			raster:false, //"inc/raster.png"
			effTimer:3000,
			folderPath:false,
			autoStart:true,
			grayScale:false,
			activateKeyboard:true,
			preserveTop:false,
			onStart:function(){},
			onChange:function(idx){}, //idx = the zero based index of the displayed photo
			onPause:function(){},
			onPlay:function(opt){},
			onNext:function(opt){},
			onPrev:function(opt){}
		},
		clear:false,

		buildGallery:function(options){
      var opt = {};
			$.extend(opt, $.mbBgndGallery.defaults,options);
			opt.galleryID = new Date().getTime();
			var el = $(opt.containment).get(0);
			el.opt = opt;

			if(el.opt.onStart)
				el.opt.onStart();

			opt.gallery = $("<div/>").attr({id:"bgndGallery_"+el.opt.galleryID}).addClass("mbBgndGallery");
			var pos = opt.containment == "body"?"fixed":"absolute";
			opt.gallery.css({position:pos,top:0,let:0,width:"100%",height:"100%",overflow:"hidden"});

			var containment = el.opt.containment;

			if(containment != "body"){
				var wrapper = $("<div/>").css({"position":"absolute",minHeight:"100%", minWidth:"100%", zIndex:3});
				$(containment).wrapInner(wrapper);
				if($(containment).css("position") == "static")
					$(containment).css("position","relative");
			}

			if(opt.raster){
				var raster = $("<div/>").css({position:"absolute",top:0,left:0,width:"100%",height:"100%",background:"url("+opt.raster+")",zIndex:1});
				opt.gallery.append(raster);
			}

			$(containment).prepend(opt.gallery);

			if(el.opt.folderPath && el.opt.images.length == 0)
				opt.images = jQuery.loadFromSystem(el.opt.folderPath);

			var images = opt.images;

			var totImg = images.length;

			var loadCounter = 0;

			$(opt.gallery).bind("imageLoaded_"+opt.galleryID,function(){
				loadCounter++;
				if(loadCounter == totImg){
					$(opt.gallery).unbind("imageLoaded_"+opt.galleryID);
					return;
				}
				$.mbBgndGallery.preload(images[loadCounter],el);
			});
			$.mbBgndGallery.preload(images[0],el);

			opt.imageCounter = 0;

			$.mbBgndGallery.changePhoto(images[opt.imageCounter],el);

			if ( ! opt.autoStart){
				opt.paused = true;
				$(opt.gallery).trigger("paused");
			}

			$(opt.controls).find(".counter").html(opt.imageCounter+1+" / "+opt.images.length);

			$(opt.gallery).bind("imageReady_"+opt.galleryID,function(){
				if(opt.paused)
					return;
				$.mbBgndGallery.play(el);
			});

			$(window).bind("resize",function(){
				var image = $("#bgndGallery_"+el.opt.galleryID+" img");
				$.mbBgndGallery.checkSize(image,el);
			});

			var controls = el.opt.controls;
			if(controls){
				$.mbBgndGallery.buildControls(controls,el);
			}

			$(opt.containment).bind("paused",function(){
				$(opt.controls).find(".play").show();
				$(opt.controls).find(".pause").hide();
			});
			$(opt.containment).bind("play",function(){
				$(opt.controls).find(".play").hide();
				$(opt.controls).find(".pause").show();
			});

		},

		preload:function(url,el){
			if($.mbBgndGallery.clear){
				$(el.opt.gallery).remove();
				return;
			}

			var img = $("<img/>").load(function(){
				$(el.opt.gallery).trigger("imageLoaded_"+el.opt.galleryID);
			}).attr("src",url);
		},

		checkSize:function(image,el){
			if($.mbBgndGallery.clear){
				$(el.opt.gallery).remove();
				return;
			}

			var w = image.attr("w");
			var h = image.attr("h");
			var containment = el.opt.containment == "body"? window : el.opt.containment;
			var aspectRatio = w/h;
			var wAspectRatio = $(containment).width()/$(containment).height();
			if(aspectRatio >= wAspectRatio){
				image.css("height","100%");
				image.css("width","");
			} else{
				image.css("width","100%");
				image.css("height","");
			}
			image.css("margin-left",(($(containment).width()-image.width())/2));

			if( ! el.opt.preserveTop)
				image.css("margin-top",(($(containment).height()-image.height())/2));
		},

		changePhoto:function(url,el){
			
      if($.mbBgndGallery.clear){
				$(el.opt.gallery).remove();
				return;
			}

			if(el.opt.onChange)
				el.opt.onChange(el.opt.imageCounter);

			var image = $("<img/>").hide().load(function(){
				var image = $(this);

				var tmp = $("<div/>").css({position:"absolute",top:-5000});
				tmp.append(image);
				$("body").append(tmp);
				image.attr("w", image.width());
				image.attr("h", image.height());
				tmp.remove();

				$("#bgndGallery_"+el.opt.galleryID+" img").galleryAnimate(el.opt.effect.exit,el.opt.effTimer,el.opt.effect.exitTiming,function(){$("#bgndGallery_"+el.opt.galleryID+" img:first").remove()});
				image.css({position:"absolute", width:"100%"});
				$("#bgndGallery_"+el.opt.galleryID).append(image);

				$.mbBgndGallery.checkSize(image, el);

				image.css(el.opt.effect.enter).show().galleryAnimate({top:0,left:0,opacity:1},el.opt.effTimer,el.opt.effect.enterTiming,function(){
					$(el.opt.gallery).trigger("imageReady_"+el.opt.galleryID);
				});
			}).attr("src",url);

			if(el.opt.grayScale){
				image.greyScale();

			}

			var counter = $(el.opt.controls).find(".counter");
			counter.html(el.opt.imageCounter+1+" / "+el.opt.images.length);

		},

		play:function(el){
			if($.mbBgndGallery.clear){
				$(el.opt.gallery).remove();
				return;
			}

			if(el.opt.onPlay)
				el.opt.onPlay(el.opt);

			el.opt.changing = setTimeout(function(){
				if(el.opt.paused)
					return;
				if (el.opt.imageCounter >= el.opt.images.length-1)
					el.opt.imageCounter = -1;

				el.opt.imageCounter++;

				$.mbBgndGallery.changePhoto(el.opt.images[el.opt.imageCounter],$(el.opt.containment).get(0));
			},el.opt.paused?0:el.opt.timer);

			$(el.opt.gallery).trigger("play");

		},

		pause:function(el){
			if($.mbBgndGallery.clear){
				$(el.opt.gallery).remove();
				return;
			}

			clearTimeout(el.opt.changing);
			el.opt.paused = true;
			$(el.opt.gallery).trigger("paused");

			if(el.opt.onPause)
				el.opt.onPause();
		},

		next:function(el){
			if($.mbBgndGallery.clear){
				$(el.opt.gallery).remove();
				return;
			}

			if(el.opt.onNext)
				el.opt.onNext(el.opt);
			$.mbBgndGallery.pause(el);
			clearTimeout(el.opt.changing);
			if (el.opt.imageCounter == el.opt.images.length-1)
				el.opt.imageCounter = -1;

			el.opt.imageCounter++;

			$.mbBgndGallery.changePhoto(el.opt.images[el.opt.imageCounter],el);
		},

		prev:function(el){
			if($.mbBgndGallery.clear){
				$(el.opt.gallery).remove();
				return;
			}

			if(el.opt.onPrev)
				el.opt.onPrev(el.opt);

			$.mbBgndGallery.pause(el);
			clearTimeout(el.opt.changing);
			if (el.opt.imageCounter == 0)
				el.opt.imageCounter = el.opt.images.length;

			el.opt.imageCounter--;

			$.mbBgndGallery.changePhoto(el.opt.images[el.opt.imageCounter],el);
			el.opt.paused = true;
			$(el.opt.gallery).trigger("paused");

		},

		loader:{
			show:function(){},
			hide:function(){}
		},

		keyboard:function(el){
			$(document).bind("keydown.bgndGallery",function(e){
				switch(e.keyCode){
					case 32:
						if(el.opt.paused){
							$.mbBgndGallery.play(el);
							el.opt.paused = false;
						}else{
							el.opt.paused = true;
							$.mbBgndGallery.pause(el);
						}
						break;
					case 39:
						$.mbBgndGallery.next(el);

						break;
					case 37:
						$.mbBgndGallery.prev(el);

						break;
				}
			})
		},

		buildControls:function(controls,el){
			var pause = $(controls).find(".pause");
			var play = $(controls).find(".play");
			var next = $(controls).find(".next");
			var prev = $(controls).find(".prev");
			if(el.opt.autoStart)
				play.hide();

			pause.bind("click",function(){
				$.mbBgndGallery.pause(el);
				$(this).hide();
				play.show();
			});

			play.bind("click",function(){
				if( ! el.opt.paused) return;
				clearTimeout(el.opt.changing);
				$.mbBgndGallery.play(el);
				el.opt.paused = false;
			});

			next.bind("click",function(){
				$.mbBgndGallery.next(el);
				pause.hide();
				play.show();
			});

			prev.bind("click",function(){
				$.mbBgndGallery.prev(el);
				pause.hide();
				play.show();
			});

			if(el.opt.activateKeyboard)
				$.mbBgndGallery.keyboard(el);
		},

		changeGallery:function(el,array,startAt,cb){

			$(el.gallery).hide();
      
			$("#bgndGallery_"+el.opt.galleryID+" img").remove();

			$.mbBgndGallery.pause(el);

			el.opt.images = array;
      el.opt.imageCounter = (startAt > -1 ? startAt : 0);
			var images = el.opt.images;
			var totImg = images.length;
			var loadCounter = 0;

			$(el.opt.gallery).bind("imageLoaded_"+el.opt.galleryID, function(){
				loadCounter++;
				if(loadCounter == totImg){
					$(el.opt.gallery).unbind("imageLoaded_"+el.opt.galleryID);
          $.mbBgndGallery.changePhoto(images[el.opt.imageCounter],el);
          if(typeof cb == 'function') cb();
					return;
				}
				$.mbBgndGallery.preload(images[loadCounter],el);
			});
			$.mbBgndGallery.preload(images[loadCounter],el);
			
			

		}
    
	};

	$.fn.galleryAnimate = function(opt,duration, type, callback){
		if( ! opt) return;
		if(typeof duration == "function"){
			callback = duration;
			duration = 1000;
		}
		if(typeof type == "function"){
			callback = type;
			type = "linear"; //	ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier(<number>, <number>, <number>, <number>)
		}

		var el = this;

		if($.browser.msie){   //&& $.browser.version.indexOf("9") == -1
			el.animate(opt,duration,callback);
			return;
		}

		var sfx = "";
		var transitionEnd = "TransitionEnd";
		if ($.browser.webkit) {
			sfx = "-webkit-";
			transitionEnd = "webkitTransitionEnd";
		} else if ($.browser.mozilla) {
			sfx = "-moz-";
			transitionEnd = "transitionend";
		} else if ($.browser.opera) {
			sfx = "-0-";
			transitionEnd = "oTransitionEnd";
		}

		el.css(sfx+"transition-property","opacity, left, top, width, height");
		el.css(sfx+"transition-duration",duration+"ms");
		el.css(sfx+"transition-timing-function",type);
		el.css(opt).bind(transitionEnd,function(){
			callback();
			$(this).unbind(transitionEnd);
			el.css(sfx+"transition","");
		});
	};

	jQuery.loadFromSystem = function(folderPath, type){

		// if directory listing is enabled on the remote server.
		// if you run the page locally you need to run it under a local web server (Ex: http://localhost/yourPage)
		// otherwise the directory listing is unavailable.

		if( ! folderPath)
			return;
		if( ! type)
			type = "jpg" || "jpeg";
		var arr = [];
		$.ajax({
			url:folderPath,
			async:false,
			success:function(response){
				var tmp = $(response);
				var els = tmp.find("[href*='."+type+"']");
				els.each(function(){
					arr.push(folderPath+$(this).attr("href"));
				});
				tmp.remove();
			}
		});
		return arr;
	};

	$.fn.greyScale = function() {
		return this.each(function() {
			if ($.browser.msie && $.browser.version<9) {
				this.style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayScale=1)";
			} else {
				this.src = grayScaleImage(this);
			}
		})
	};

	function grayScaleImage(imgObj){
		var canvas = document.createElement('canvas');
		var canvasContext = canvas.getContext('2d');

		var imgW = imgObj.width;
		var imgH = imgObj.height;
		canvas.width = imgW;
		canvas.height = imgH;

		canvasContext.drawImage(imgObj, 0, 0);
		var imgPixels = canvasContext.getImageData(0, 0, imgW, imgH);

		for(var y = 0; y < imgPixels.height; y++){
			for(var x = 0; x < imgPixels.width; x++){
				var i = (y * 4) * imgPixels.width + x * 4;
				var avg = (imgPixels.data[i] + imgPixels.data[i + 1] + imgPixels.data[i + 2]) / 3;
				imgPixels.data[i] = avg;
				imgPixels.data[i + 1] = avg;
				imgPixels.data[i + 2] = avg;
			}
		}
		canvasContext.putImageData(imgPixels, 0, 0, 0, 0, imgPixels.width, imgPixels.height);
		return canvas.toDataURL();
	}

})(jQuery);