/**
 * @author Ruan Candido
 */
	$.widget("nmk.galeria" , {
		options: {
			type:'ajax',
			iconURL:'images/loading.gif',
			auto:0,
			arrows:false,
			legend:true,
			thumbsCarousel:true,
			mover:2,
			itensPage:6
		},
		
		
		_create: function(){
			var browserName , $this , $thumbs , current , target , numImages , legend , type , baseURL , arrows , thumbsCarousel,iconLoading,
			/*var current = 0,
				target,
				numImages = this.element.find('img').length,
				numPages = numImages,
				$this = this.element,
				$thumbs,
				$itens,
				legend = this.options.legend,
				heightFotoGrande = new Array() ,
				load = this.options.loadGaleria,
				urlImgFull = this.options.urlImgFull,*/
			
			start = function (element,options){
				//settando variveis
				browserName 	= navigator.appName;
				$this 			= element;
				current 		= 0 ;
				target 			= 0 ;
				numImages 		= $this.find("img").length;
				legend 			= options.legend;
				type 			= options.type;
				arrows 			= options.arrows;
				thumbsCarousel 	= options.thumbsCarousel;
				iconLoading 	= $('<img src="'+ options.iconURL +'" class="loading"/>');
				
				/*THUMBS CARROSSEL ?*/
				if(thumbsCarousel){
					$this.append('<div class="carrosselGaleria"><a href="javascript:;" class="bts btPrev">Anterior<span class="effect"><span class="out"></span><span class="hover"></span></span></a><a href="javascript:;" class="bts btNext">Proxima<span class="effect"><span class="out"></span><span class="hover"></span></span></a><div class="mask" style="width:100%;height:100%; position:relative; display:block; overflow:hidden;"><ul class="animation"></ul></div></div>')
					var $carrossel = $this.find('div.carrosselGaleria');
					$this.find('img').each(function(i, img){
						$carrossel.find('ul').append('<li><img src="' + img.src + '" alt="' + img.alt + '" title="' + img.title + '" /></li>');
						if (type == "ajax"){
							$(this).remove();
						}
					});                   
					$thumbs = $carrossel.find('li');
					var	$btPrev 	= $carrossel.find('a.btPrev'),
						$btNext 	= $carrossel.find('a.btNext'),
						$animation 	= $carrossel.find('ul.animation')
						mover 		= options.mover,
						pageWidth 	= $thumbs.outerWidth(true) * mover,                      
						itensPage 	= Math.ceil($carrossel.width() / $thumbs.outerWidth(true)),                      
						numItens 	= $thumbs.length,
						page 		= 0,
						target 		= 0,	
						pages  	   	= Math.ceil((numItens - itensPage) / mover) + 1,
						
						moverCarousel = function (target , page){
							var move = -pageWidth*target;
							if (target >= page) {
								var falta = (numImages-itensPage) - (page * mover);
							} else{
								var falta = (numImages-itensPage) - (target * mover);
							};
							if ( falta < mover ){
								move = move + ((mover - falta) * $thumbs.outerWidth(true));
							};
							
			                switch(target){
			                	case 0:
				                   $btPrev.addClass('disable');
				                   $btNext.removeClass('disable');
			                	break;
			                	case pages-1:
				                   $btPrev.removeClass('disable');
				                   $btNext.addClass('disable');
			                	break;
			                	default:
				                   $btPrev.removeClass('disable');
				                   $btNext.removeClass('disable');
			                	break;
			                };
			                					
							$animation.stop().animate({left:move+'px'},500 , 'easeOutSine');
					}
					$animation.width(numItens * $thumbs.outerWidth(true));
					$btPrev.click(function(){
						target = page - 1;
						if (target >= 0){
							moverCarousel (target , page);
						}else{
							target = page;
						};
						page=target;
						return false;
					});
					$btNext.click(function(){
						target = page + 1;
						if (target < pages){
							moverCarousel (target , page);
						}else{
							target = pages-1;
						};
						page=target;
						return false;
					});
					$carrossel.hover (function(){
						$(document).bind( 'keydown' , function(e){
							if (e.keyCode == 39){
								//NEXT
								target = page + 1;
								if (target < pages){
									moverCarousel (target , page);
								}else{
									target = pages-1;
								};
								page=target;
							}else if (e.keyCode == 37){
								//PREV
								target = page - 1;
								if (target >= 0){
									moverCarousel (target , page);
								}else{
									target = page;
								};
								page=target;
							}
						});
					},function(){
						$(document).unbind('keydown');
					});

					if(pages>1){
						$btPrev.addClass('disable');
						$btNext.removeClass('disable');
					}else{
						$btPrev.addClass('disable');
						$btNext.addClass('disable');
					};						
					
					
				}else{
					$this.append('<div class="thumbs"><ul class="list-thumbs"></ul></div>')
					$this.find('img').each(function(i, img){
						$this.find('ul.list-thumbs').append('<li><img src="' + img.src + '" alt="' + img.alt + '" title="' + img.title + '" /><li>');
					});
					$this.find('ul.list-thumbs').append('<div class="clear"></div>');
					$thumbs = $this.find('div.thumbs li');
				}
			
				//Metodos
				switch (type){
					case "ajax":
						var baseURL = $this.find('img').first().attr('src').replace('thumb' , 'large');
						//console.log(baseURL);
						$this.prepend('<div class="imgFull"><img class="full" src="'+ baseURL +'" /></div>');
						$this.find('div.imgFull').append(iconLoading);
					break;
					default:
					break;
				}
				
				/*LEGENDAS?*/
				if(legend){
					var leg = $thumbs.first().find('img').attr('alt');
					if (leg == "") {
						$this.find(".imgFull").append('<div class="legend"></div>');
					} else{
						$this.find(".imgFull").append('<div class="legend"><p>' + leg + '</p></div>');
					};
				}         
				
				
				/*ARROWS GALERIA?*/          
				if(arrows){
					$this.prepend("<a href=\"javascript:;\" class=\"bts prev disable\">Anterior</a><a href=\"javascript:;\" class=\"bts next\">Próxima</a>")
					var $prev = $this.find('.prev');
					var $next = $this.find('.next');
					$prev.click(function(){
		                target = current - 1;
		                if (target < 0 ){
		                        target = 0;
		                }else{
		                    mudarFoto(target,current);
		                }
		                current = target
	                    return false;
					});
					
					$next.click(function(){
		                target = current + 1; 
		                if(target > (numPages-1)){
		                        target = numPages-1;
		                }else{
		                        mudarFoto(target,current);
		                }
		                current = target
	                    return false;
					});
					$this.find('div.imgFull').hover (function(){
						$(document).bind( 'keydown' , function(e){
							if (e.keyCode == 39){
								//NEXT
				                target = current - 1;
				                if (target < 0 ){
				                        target = 0;
				                }else{
				                    mudarFoto(target,current);
				                }
				                current = target
							}else if (e.keyCode == 37){
								//PREV
				                target = current + 1; 
				                if(target > (numPages-1)){
				                        target = numPages-1;
				                }else{
				                        mudarFoto(target,current);
				                }
				                current = target
							}
						});
					},function(){
						$(document).unbind('keydown');
					});
					
				}
			
			}
			
			
			var mudarFoto =  function(target , current){
				switch(type){
					case 'ajax':
						baseURL  = $thumbs.eq(target).find('img').attr('src').replace('thumb' , 'large');
						var flag = false , 
							flag2 = false,
							moveIn = $this.find('.imgFull').outerWidth(),
							moveOut = -$this.find('.imgFull').outerWidth() ;
						
						if(target % 2 == 0){
							moveIn = -moveIn;
							moveOut = -moveOut;
						};
						$this.find('.imgFull img.full').animate({ left: moveOut + 'px' , opacity:0 } , 500 , 'easeInBack' , function(){
							$(this).attr('src' , '');
							iconLoading.show();
							flag = true;
							fotoNova(flag , flag2);
						});
						if (browserName == "Microsoft Internet Explorer"){
							setTimeout(function(){
								flag2 = true;
								fotoNova(flag , flag2);
							},1000);
						}else{
							$.get(baseURL  ,  function(){
								flag2 = true;
								fotoNova(flag , flag2);
							});
						}	
						var fotoNova = function (flag , flag2) {
						  if(flag && flag2){
							iconLoading.hide();
							$this.find('.imgFull img.full').attr('src' , baseURL).css({'left':moveIn + "px"}).animate({left:'1px' , 'opacity':1} , 500);
						  }
						}
						if(legend){
							$this.find('.legend').stop().animate({opacity:0},300,function(){
								var leg = $thumbs.eq(target).find('img').attr('alt');
								if (leg == "") {
									$this.find('.legend').hide();
								} else{
									$this.find('.legend').show().html('<p>'+leg+'</p>');
									$this.find('.legend').animate({opacity:0.5},300);
								};
							});
						}

					break;
					case 'normal':
						$this.find('.imgFull img').eq(current).fadeOut(400).end().eq(target).fadeIn(400);
						if(legend){
							$this.find('.legend').eq(current).animate({'bottom':'-20%' , opacity:0}, {duration:500});
							$this.find('.legend').eq(target).animate({'bottom':0 , opacity:1}, {duration:500});
						}
					break;
				}
			};                        
			                          
			start(this.element , this.options);

			/*TROCA A FOTO CLICANDO NAS THUMBS*/
			
			$thumbs.click( function(){
				var i = $thumbs.index(this);
				target = i;
				if (target != current){
					mudarFoto(target,current);
				} 
				current = target
				return false;
			});
			
				
			this._update();
			
		},
		

		
		
		_setOption: function(key, value) {
			this.options[key] = value;
			this._update();
		},
		
		_update: function(){
			//alert('fim')
		}
		
	});