(function($){
	$.fn.menuSlider = function(settings){
		options = $.extend({
							width:'100%',
							height:'100px',
							margin:'2px',
							padding: '0',
							lightBox: false,
							arrowWidth: 20
							}, settings);
		var counter = 0;
		var _width = options.width;
		var _height = options.height;
		var _margin = options.margin;
		var _arrowWidth = options.arrowWidth;
		
		$(this).each(function(){
			var _hgContenedor = $(this).children('div.hg-contenedor');
			var _contenido = _hgContenedor.children('div.contenido');
			var _miniaturas = _contenido.children('div.miniaturas');
			var _mWidth = 0;
			var _arrowLeft = _hgContenedor.children('a.arrow-left');
			var _arrowRight = _hgContenedor.children('a.arrow-right');
			var _intervalID = null;
			var _x = 0;
			var _imgCounter = 0;
			var _cantidad = _miniaturas.children('a').length;
			var _imgLoaded = 0;
			
			_init();
			
			//variable que guarda el ancho total de las imagenes
			var ancho = 0;
			//recorremos cada imagen
			_miniaturas.children('a').each(function(){
				$(this).attr('rel','msLightbox'+counter);
				var miniatura = $(this).children('img');
				var margins = parseInt(_margin) * 2;
				
				miniatura.attr('id','thumb'+counter+'_'+_imgCounter);
				
				
				if($.browser.msie){
					var img = miniatura;
					_imgLoaded++;
					
					var nh = parseInt(_height);
					var nw = Math.floor((img.width() * nh) / img.height());
					
					img.height(nh);
					img.width(nw);
					ancho += nw + (parseInt(_margin) * 2);
					_miniaturas.width(ancho+4);
					_eventsHandler();
					
				}else{
					var img = new Image();
					img.src = miniatura.attr('src');
					img.id = 'temp'+counter+'_'+_imgCounter;
					img.onload = function(){
						_imgLoaded++;
						
						var nh = parseInt(_height);
						var nw = Math.floor((this.width * nh) / this.height);
						
						$('img#thumb'+this.id.substr(4)).height(nh);
						$('img#thumb'+this.id.substr(4)).width(nw);
						
						ancho += nw + margins;
						if(_imgLoaded == _cantidad){
							_miniaturas.width(ancho);
							_eventsHandler();
						}
					}
				}
				
				miniatura.css('margin','0 ' + _margin + ' 0 ' + _margin);
				_imgCounter++;
			});
			
			$('a[rel=msLightbox'+counter+']').lightBox();
						
			//inicializa los contenedores y eventos de los botones
			function _init()
			{
				counter++;
				var _paddingX = options.padding.length > 1 ? options.padding.split(' ') : new Array(0,0,0,0);
				_hgContenedor.css({width:parseInt(options.width)-parseInt(_paddingX[1])-parseInt(_paddingX[3]), height:options.height, padding:options.padding});
				var _contWidth = parseInt(_width)-(_arrowWidth*2);
				_contenido.css({width:_contWidth+'px', height:_height, overflow:'hidden'});
				_miniaturas.css({position:'absolute',left:0});
			}
			
			function _eventsHandler()
			{
				if(ancho > parseInt(_contenido.width())){
					_addEvents();
				}else{
					_removeEvents();
				}
			}
			
			function _removeEvents()
			{
				_arrowRight.css('display','none');
				_arrowLeft.css('display','none');
			}
			
			function _addEvents()
			{
				
				//Eventos para los botones (Flechas)
				
				//flecha derecha over
				_arrowRight.mouseover(function(e){
					e.preventDefault();
					_intervalID = setInterval(function(){
														 _x = parseInt(_miniaturas.css('left'))-1;
														 if(_x > (_contenido.width() - _miniaturas.width())){
															_miniaturas.css('left',_x+'px');
														 }else{
															 _miniaturas.css('left',_contenido.width() - _miniaturas.width()+'px');
														 }
														 },1);
				});
				
				//flecha derecha out
				_arrowRight.mouseout(function(e){
					e.preventDefault();
					clearInterval(_intervalID);
				});
				
				//flecha izquierda over
				_arrowLeft.mouseover(function(e){
					e.preventDefault();
					_intervalID = setInterval(function(){
														 _x = parseInt(_miniaturas.css('left'))+1;
														 if(_x <= 0){
															_miniaturas.css('left',_x+'px');
														 }else{
															 _miniaturas.css('left',0+'px');
														 }
														 },1);
				});
				
				//flecha izquierda out
				_arrowLeft.mouseout(function(e){
					e.preventDefault();
					clearInterval(_intervalID);
				});
			}
		});
		
	}
})(jQuery);
