/*
	galleryList
	largeIMG
*/

jQuery.fn.gallery = function(_options){
	
	var _options = jQuery.extend({
		galleryList: 'ul li a',
		largeIMG: 'div.img-hold img',
		btNext: 'a.next-photo',
		btPrev:'a.prev-photo',
		btFirst:'a.first-photo',
		btLast:'a.last-photo',
		play:'a.play',
		loadIMG:'div.img-hold img.load',
		holderEl:'div',
		moveEl:'ul',
		simpleEl:'li',
		duration: 400,
		slideTime : 4000
	},_options);
	
	return this.each(function(){
		var _THIS = $(this);
		var _galleryList = jQuery(_options.galleryList, _THIS);
		var _btNext = jQuery(_options.btNext, _THIS);
		var _btPrev = jQuery(_options.btPrev, _THIS);
		var _btFirst = _options.btFirst ? jQuery(_options.btFirst, _THIS) : false;
		var _btLast = _options.btLast ? jQuery(_options.btLast, _THIS) : false;
		var _btPlay = _options.play ? jQuery(_options.play, _THIS) : false;
		var _largeIMG = jQuery(_options.largeIMG, _THIS);
		var _loadIMG = jQuery(_options.loadIMG, _THIS);
		var _duration = _options.duration;
		var _img = new Image();
		var _holderEl = jQuery(_options.holderEl, _THIS);
		var _moveEl = jQuery(_options.moveEl, _THIS);
		var _simpleEl = jQuery(_options.simpleEl, _THIS);
		var _holderWidth = _holderEl.outerWidth();
		var _simpleElWidth = _simpleEl.outerWidth();
		var _moveElwidth = _simpleElWidth*_simpleEl.length;
		var _margin = 0;
		
		var _step = _simpleElWidth;
		
		// preload
		var _imagesG = [];
		_galleryList.each(function(i, el){
			if (jQuery(el).attr('rel') != '') {
				_imagesG[i] = new Image();
				var _rel = jQuery(this).attr('rel');
				_imagesG[i].src = _rel;
			}
		});
		_loadIMG.hide();
		_largeIMG.filter('.next').hide();
		
		// click gallery
		_galleryList.click(function(){
			if (jQuery(this).attr('rel') != '' && !jQuery(this).is('.active')) {
				_galleryList.removeClass('active');
				var _rel = jQuery(this).attr('rel');
				_img.src = _rel;
				_loadIMG.show();
				
				if (!$.browser.msie && $.browser.version != '6.0') _img.onload = showImg(_rel);
				if ($.browser.msie && $.browser.version == '6.0' && _img.complete) showImg(_rel);
				
				jQuery(this).addClass('active');
				return false;
			}
		});
		function showImg(rel) {
			_loadIMG.hide();
			_largeIMG.filter('.active').removeClass('active').addClass('temp').fadeOut(_duration);
			_largeIMG.filter('.next').fadeIn(_duration).removeClass('next').addClass('active').attr('src',rel);
			_largeIMG.filter('.temp').removeClass('temp').addClass('next');
		}
		var _timerPlay = false;
		if (_btPlay) {
			_btPlay.click(function(){
				if ($(this).is('.pause')) {
					$(this).removeClass('pause');
					if (_timerPlay) clearTimeout(_timerPlay);
				} else {
					$(this).addClass('pause');
					_timerPlay = setTimeout(function(){nextSlide()}, _options.slideTime/2);
				}
				return false;
			})
		}
		// Next/Prev
		if (_btNext) {
			_btNext.click(function(){
				nextSlide();
				return false;	
			});
		}
		function nextSlide(){
			if (!_loadIMG.is(':visible')) {
				var _indexActive = _galleryList.index(_galleryList.filter('.active')) + 1;
				_galleryList.removeClass('active');
				if (_galleryList.eq(_indexActive).length) {
					_galleryList.eq(_indexActive).addClass('active');
				} else _galleryList.eq(0).addClass('active');
				var _rel = _galleryList.filter('.active').attr('rel');
				
				_img.src = _rel;
				_loadIMG.show();
				if (!$.browser.msie && $.browser.version != '6.0') _img.onload = showImg(_rel);
				if ($.browser.msie && $.browser.version == '6.0' && _img.complete) showImg(_rel);
				
				if ($(_btPlay).is('.pause')) _timerPlay = setTimeout(function(){nextSlide()}, _options.slideTime);
				moveNext();
			}			
		}
		if (_btPrev) {
			_btPrev.click(function(){
				if (!_loadIMG.is(':visible')) {
					var _indexActive = _galleryList.index(_galleryList.filter('.active')) - 1;
					_galleryList.removeClass('active');
					if (_galleryList.eq(_indexActive).length) {
						_galleryList.eq(_indexActive).addClass('active');
					} else _galleryList.eq(_galleryList.length - 1).addClass('active');
					var _rel = _galleryList.filter('.active').attr('rel');
					
					_img.src = _rel;
					_loadIMG.show();
					if (!$.browser.msie && $.browser.version != '6.0') _img.onload = showImg(_rel);
					if ($.browser.msie && $.browser.version == '6.0' && _img.complete) showImg(_rel);
					
					movePrev();
				}
				return false;
			});
		}
		if (_btFirst) {
			_btFirst.click(function(){
				if (!_loadIMG.is(':visible')) {
					var _indexActive = 0;
					_galleryList.removeClass('active');
					_galleryList.eq(_indexActive).addClass('active');
					var _rel = _galleryList.filter('.active').attr('rel');
					
					_img.src = _rel;
					_loadIMG.show();
					if (!$.browser.msie && $.browser.version != '6.0') _img.onload = showImg(_rel);
					if ($.browser.msie && $.browser.version == '6.0' && _img.complete) showImg(_rel);
					_margin = 0;
					_moveEl.animate({marginLeft:-_margin},{queue:false,duration:_duration});
				}
				return false;	
			});
		}
		if (_btLast) {
			_btLast.click(function(){
				if (!_loadIMG.is(':visible')) {
					var _indexActive = _galleryList.length - 1;
					_galleryList.removeClass('active');
					_galleryList.eq(_indexActive).addClass('active');
					var _rel = _galleryList.filter('.active').attr('rel');
					
					_img.src = _rel;
					_loadIMG.show();
					if (!$.browser.msie && $.browser.version != '6.0') _img.onload = showImg(_rel);
					if ($.browser.msie && $.browser.version == '6.0' && _img.complete) showImg(_rel);
					_margin = _moveElwidth-_holderWidth;
					_moveEl.animate({marginLeft:-_margin},{queue:false,duration:_duration});
				}
				return false;	
			});
		}
		
		function moveNext() {
			if (_margin+_step > _moveElwidth-_holderWidth) {
				_margin = _moveElwidth-_holderWidth;
			}
			else _margin += _step;
			if (_galleryList.index(_galleryList.filter('.active')) == 0) {
				_margin = 0;
			}
			_moveEl.animate({marginLeft:-_margin},{queue:false,duration:_duration});
		}
		function movePrev() {
			if (_margin-_step < 0) {
				_margin = 0;
			}
			else _margin -= _step;
			if (_galleryList.index(_galleryList.filter('.active')) == _galleryList.length - 1) _margin = _moveElwidth-_holderWidth;
			_moveEl.animate({marginLeft:-_margin},{queue:false,duration:_duration});
		}
	});
}
$(document).ready(function(){
	$('div.light-box').gallery({
		galleryList:'div.gallery ul a',
		largeIMG: 'div.karusel-image img',
		loadIMG:'img.load',
		btNext: 'a.link-next',
		btPrev:'a.link-prev',
		btFirst: false,
		btLast: false,
		play: false,
		holderEl:'div.gallery > div',
		moveEl:'div.gallery ul',
		simpleEl:'div.gallery li'
	})
});