/*
	spaceboxSlider v1.0.0
	Ilya Firsaev http://www.spacebox.ru/

*/
(function($) {
	
	var settings = {
		'slide_elements': 10,
		'slide_delay': 500,
		'space_of_pane': 50
	};	
	var params;
	var params_slide_elements = 0;
	var half_leftside = 0;	// Анимируемые с левой стороны
	var half_rightside = 0; // Анимируемые с правой стороны
	var curr_index = 0; // Текущий индекс елемента
	var prev_index = 0;	// Предфдущий индекс элемента индекс елемента
	var height_of_image = new Array(); // Массив высот элементов
	var length_img = 0; // Количество картинок слайдера
	var width_img = 0; // Ширина картинок слайдера
	var height_img = 0; // Высота картинок слайдера
	var animate_li = new Array();
	var animate_li_height = new Array(); // Высота каждого анимируемого блока
	var direct_pane; // Панель управления с кнопками
	var is_playing = false; // Флаг, true во время проигрывания
	var timeoutGlobal = 0; // Таймер автоматической прокрутки, задержка
	var its_spl_slider = false; // Если входящее значение меньше нуля, то используем обычный слайдинг
	var $this; // Глобальный объект. к которому применяется анимация
	var direct_pane_height = 0; // Высота генерируемой панели управления
	
	var methods = {
		init : function(options) {
			$this = $(this);
			if(options) {
				params = $.extend(settings, options);
			}
			if(params.slide_elements < 0) {
				params.slide_elements = 1;
				its_spl_slider = true;
			}
			if(params.slide_delay < (params.slide_elements * 32 + 320)) {
				params.slide_delay = (params.slide_elements * 32 + 320);
			}			
			params_slide_elements = params.slide_elements;
			half_leftside = Math.floor(params_slide_elements / 2);
			half_rightside = params_slide_elements - half_leftside;

			// Создаем панель управления
			direct_pane = $('<div></div>').attr({
				'id': 'work_slider_direct'
			});
			$this.css({
				'position': 'relative'
			});
			$this.find('div').css({
				'position': 'relative'
			});
			$this.find('#work_slider_pict').find('img').css({
				'display': 'block'
			});			
			var direct_pane_ul = $('<ul></ul>');
			var length_frame = $this.attr('relFrame');
			length_img = $this.find('#work_slider_pict li').length;
			width_img = $this.find('#work_slider_pict li').width();
			height_img = $this.find('#work_slider_pict li').height();
			$this.find('#work_slider_pict').css({
				'position': 'relative',
				'overflow': 'hidden',
				'height': height_img
			});
			
			// Обходим все элементы с картинками
			$this.find('#work_slider_pict li').each(function(index) {

				animate_li[index] = $(this);
				animate_li_height[index] = animate_li[index].find('img:eq(0)').height();
				if(index == 0) {
					$(this).css({
						'position': 'absolute',
						'z-index': 1000,
						'left': '0px',
						'top': '0px',
						'width': width_img + "px",
						'height': animate_li_height[index] + "px"
					});
				} else {
					$(this).css({
						'position': 'absolute',
						'z-index': 100 - index,
						'left': 1 * width_img + params.space_of_pane + 'px',
						'top': '0px',
						'width': width_img + "px",
						'height': animate_li_height[index] + "px"
					});					
				}
				var width_span = Math.floor(width_img/params.slide_elements);
				var img_src = $(this).find('img').attr('src');
				var max_width_span = 0;
				if(width_img % params.slide_elements != 0) {
					max_width_span = width_img - Math.floor(width_img/params.slide_elements) * params.slide_elements;
				}
				var li_height = $(this).height();
				for(var i = 0; i < params.slide_elements; i++) {
					var span = $('<span></span>').css({
						'background-image': 'url(' + img_src + ')',
						'background-position': -1 * width_span * i + 'px 0px',
						'background-repeat': 'no-repeat',
						'overflow': 'hidden',
						'position': 'absolute',
						'left': i * width_span,
						'top': '0px',
						'width': width_span,
						'height': li_height,
						'z-index': '1'
					});
					if(i == params.slide_elements && max_width_span != 0) {
						var span = $('<span></span>').css({
							'background-image': 'url(' + img_src + ')',
							'background-position': -1 * max_width_span * i + 'px 0px',
							'background-repeat': 'no-repeat',
							'overflow': 'hidden',
							'position': 'absolute',
							'left': i * max_width_span,
							'top': '0px',
							'width': width_span,
							'height': li_height,
							'z-index': '1'
						});
					}
					$(this).append(span);
				}
				$(this).find('img').css({
					'display': 'none'
				});
				if((length_img - index) <= length_frame) {
					var direct_pane_li = $('<li></li>').attr({
						'class': 'frame'
					});
				} else {
					var direct_pane_li = $('<li></li>').attr({
						'class': 'work'
					});
				}
				if(index == 0) {
					var direct_pane_li_a = $('<a></a>').attr({
						'href': 'javascript: void(0)',
						'class': 'current'
					}).html('&nbsp;');
				} else {
					var direct_pane_li_a = $('<a></a>').attr({
						'href': 'javascript: void(0)'
					}).html('&nbsp;');				
				}
				direct_pane_li.append(direct_pane_li_a);
				direct_pane_ul.append(direct_pane_li);
			});
			var direct_pane_libackward_a = $('<a></a>').attr({
				'href': 'javascript: void(0)'
			}).html('&nbsp;');		
			var direct_pane_libackward = $('<li></li>').attr({
				'class': 'backward'
			});
			direct_pane_libackward.append(direct_pane_libackward_a);
			var direct_pane_liforward_a = $('<a></a>').attr({
				'href': 'javascript: void(0)'
			}).html('&nbsp;');				
			var direct_pane_liforward = $('<li></li>').attr({
				'class': 'forward'
			});
			direct_pane_liforward.append(direct_pane_liforward_a);
			
			direct_pane_ul.append(direct_pane_libackward);
			direct_pane_ul.append(direct_pane_liforward);
			direct_pane.append(direct_pane_ul);
			$this.prepend(direct_pane);
			direct_pane_height = direct_pane.height();
			
			$this.find('#work_slider_pict li').bind('click', function(event) {
				if(!is_playing) {
					methods.next(direct_pane);
				}								
				event.preventDefault();	
			});			
			
			methods.derection_event($this, direct_pane, length_frame);
			/*
			timeoutGlobal = window.setInterval(function() {
				methods.next(direct_pane);
			}, params.slide_delay);
			*/
		},
		derection_event : function(parentelement, directpane, lengthframe) {
			var direct_btn_len = directpane.find('li').length;
			directpane.find('li').each(function(index) {
				if($(this).hasClass('forward')) {
					$(this).click(function(event) {
						event.preventDefault();	
						if(!is_playing) {
							methods.next(directpane);
						}								
					});
				} else if($(this).hasClass('backward')) {
					$(this).click(function(event) {
						event.preventDefault();	
						if(!is_playing) {
							methods.prev(directpane);
						}								
					});
				} else {
					$(this).click(function(event) {
						event.preventDefault();	
						if(!is_playing) {
							methods.playindex($(this), index, directpane);
						}
					});					
				}

			});

		},
		next: function(directpane) {
			if(!is_playing) {
				prev_index = curr_index;
				if(curr_index == (length_img - 1)) {
					curr_index = 0;
				} else {
					curr_index = curr_index + 1; // Текущий индекс елемента
				}
			}
			methods.play(curr_index, prev_index, directpane, 'left');
		},
		prev: function(directpane) {
			if(!is_playing) {
				prev_index = curr_index;
				if(curr_index == 0) {
					curr_index = (length_img - 1);
				} else {
					curr_index = curr_index - 1; // Текущий индекс елемента
				}
			}
			methods.play(curr_index, prev_index, directpane, 'right');
		},
		playindex: function(element, index, directpane) {
			var direct = '';
			if(!is_playing) {
				if(index > curr_index) {
					direct = 'left';
				} else  {
					direct = 'right';
				} 
				prev_index = curr_index;
				curr_index = index; // Текущий индекс елемента
			}
			methods.play(curr_index, prev_index, directpane, direct);
		},
		play: function(currentindex, previndex, directpane, direct) {
				
			
			if(currentindex != previndex && !is_playing) {
				is_playing = true;
				// Используем два вида слайдинга, простой горизонтальный и фейдовый
				
				if(its_spl_slider) {
					if(direct == 'left') {
						animate_li[previndex].animate({
							'left': -1 * width_img - params.space_of_pane
						}, 320, 'easeOutSine', function() {
							$(this).css({
								'left': 1 * width_img + params.space_of_pane,
								'z-index': 9
							});
						});
						animate_li[currentindex].css({
							'left': 1 * width_img + params.space_of_pane
						});						
						animate_li[currentindex].animate({
							'left': 0
						}, 320, 'easeOutSine', function() {
							$(this).css({
								'left': 0,
								'z-index': 1000
							});
						});
					} else {
						animate_li[previndex].animate({
							'left': 1 * width_img + params.space_of_pane
						}, 320, 'linear', function() {
							$(this).css({
								'left': -1 * width_img - params.space_of_pane,
								'z-index': 9
							});
						});
						animate_li[currentindex].css({
							'left': -1 * width_img - params.space_of_pane
						});
						animate_li[currentindex].animate({
							'left': 0
						}, 320, 'linear', function() {
							$(this).css({
								'left': 0,
								'z-index': 1000
							});
						});
					}
					$this.animate({
						'height': animate_li_height[currentindex] + direct_pane_height
					}, 320, 'easeOutSine', function() {
						//
					});
					$('#work_slider_pict').animate({
						'height': animate_li_height[currentindex] + direct_pane_height
					}, 320, 'easeOutSine', function() {
						//
					});
					is_playing = false;
					
				} else {
					animate_li[previndex].css({
						'z-index': 1000
					});
					animate_li[currentindex].css({
						'z-index': 900
					});
					animate_li[currentindex].find('span').css({
						'opacity': 1.0
					});
					for(var i = 0; i<= half_leftside; i++) {
						animate_li[previndex].find('span').eq(i).delay(32 * i).animate({
							'opacity': 0
						}, 320, 'easeOutSine', function() {
							//
						});
					}
					var jj = 0;
					for( var j = (params_slide_elements - 1); j> half_leftside; j-- ) {
						animate_li[previndex].find('span').eq(j).delay(32 * jj).animate({
							'opacity': 0
						}, 320, 'easeOutSine', function() {
							//
						});
						jj++;
					}
					function change_data() {
						animate_li[previndex].css({
							'z-index': 900
						});
						animate_li[currentindex].css({
							'z-index': 1000
						});
						window.clearTimeout(timeoutID);
						timeoutID = 0;
						is_playing = false;
					}
					var timeoutID = window.setTimeout(function() {
						change_data();
					}, half_leftside * 32 + 320);
				}
				directpane.find('a').removeClass('current');
				directpane.find('a').eq(currentindex).addClass('current');					
			}
		}
	};
	
	$.fn.spaceboxSlider = function(method) {
		// Параметры скрипта по-умолчанию
		if ( methods[method] ) {
			return methods[ method ].apply(this, Array.prototype.slice.call( arguments, 1 ));
		} else if (typeof method === 'object' || ! method) {
			return methods.init.apply(this, arguments);
		} else {
			$.error( 'Method ' +  method + ' does not exist on jQuery.tooltip' );
		}   
		
	}
	
})(jQuery);

