/**
 * @author Egloo
 */

$.fn.photoSlider = function(params) {
	if(params === null || params === undefined) {
		params = {};
	}
	
	var _p = {};
	_p.container = _p.container || $(this);
	
	_p.drawSelectedFrame = params.drawSelectedFrame || false;
	_p.thumbClickCallback = params.thumbClickCallback || null;
	_p.thumbHoverCallback = params.thumbHoverCallback || null;
	_p.thumbOutCallback = params.thumbOutCallback || null;
	_p.getSignedUrlHandler = params.getSignedUrlHandler || null;
	_p.extraInfoAttrName = params.extraInfoAttrName || "photoId";
	_p.selectedPhotoId = params.selectedPhotoId || null;
	
	_p.initialThumbNumber = params.initialThumbNumber || 1;
	_p.frameSize = params.frameSize || 3;
	_p.thumbSideSize = params.thumbSideSize || 80;
	_p.frameSlideStep = _p.thumbSideSize;
	_p.thumbsList = params.thumbsList || [];
	
	_p.selectedPhotoIndex = 0;
	_p.thumbsCount = _p.thumbsList.length;
	
	_p.frameWidth = (_p.thumbsCount < _p.frameSize) ? _p.frameSize * _p.thumbSideSize : _p.thumbsCount * _p.thumbSideSize;
	
	_p.rightSlideLimit = _p.frameWidth - (_p.frameSize * _p.thumbSideSize);
	
	var _sys = {};
	_sys.blockSlider = false;
	_sys.blockClicks = false;
	
	init();
	
	function init() {
		_p.selectedPhotoIndex = getSelectedIndex();
		
		_p.container.bind("activatePhoto", function(e, photoId) {
			if(_sys.blockClicks) return;
			if(_p.selectedPhotoId == photoId) return;
			
			$("div[" + _p.extraInfoAttrName + "='" + _p.selectedPhotoId + "']", _p.container)
				.addClass("img-item").removeClass("img-item-selected");
			_p.selectedPhotoId = photoId;
			$("div[" + _p.extraInfoAttrName + "='" + _p.selectedPhotoId + "']", _p.container)
				.addClass("img-item-selected").removeClass("img-item");
		});
		
		_p.container.bind("blockClicks", function(e, isBlock) {
			_sys.blockClicks = isBlock;
		});
		
		_p.container.bind("setSignedUrl", function(e, photoId, photoUrl) {
			var thumbImg = new Image();
			thumbImg.onload = function() {
				$("div[" + _p.extraInfoAttrName + "='" + photoId + "']", _p.container)
					.css("background", "url(" + photoUrl + ") no-repeat center");
			}
			thumbImg.src = photoUrl;
		});
		
		
		$("<table height='" + _p.container.css("height") + "' border='0' cellspacing='0' cellpadding='0'><tr>" + 
		  "<td valign='middle' align='center' id='parrow'></td><td id='slider'></td>" + 
		  "<td valign='middle' align='center' id='narrow'></td></tr></table>")
		  	.appendTo($(_p.container));
		
		_p.prevArrow = document.createElement("div");
		$(_p.prevArrow).addClass("slider-prev-normal");
		$(_p.prevArrow).bind("disabled", function(event, isOff) {
			if(isOff === null || isOff === undefined) {
				isOff = false;
			}

			if(isOff) {
				$(this).removeClass("slider-prev-normal");
				$(this).addClass("slider-prev-disabled");
			} else {
				$(this).removeClass("slider-prev-disabled");
				$(this).addClass("slider-prev-normal");
			}
		});
		$(_p.prevArrow).bind("click", prevArrowClick);
		$(_p.prevArrow).appendTo($("td#parrow", _p.container));
		$(_p.prevArrow).trigger("disabled", [true]);
		
		_p.sliderContainer = document.createElement("div");
		$(_p.sliderContainer).addClass("slider-container");
		$(_p.sliderContainer).appendTo($("td#slider", _p.container));
		
		_p.slider = document.createElement("div");
		$(_p.slider).addClass("slider");
		$(_p.slider).appendTo($(_p.sliderContainer));

		_p.nextArrow = document.createElement("div");
		$(_p.nextArrow).addClass("slider-next-normal");
		$(_p.nextArrow).bind("disabled", function(event, isOff) {
			if(isOff === null || isOff === undefined) {
				isOff = false;
			}

			if(isOff) {
				$(this).removeClass("slider-next-normal");
				$(this).addClass("slider-next-disabled");
			} else {
				$(this).removeClass("slider-next-disabled");
				$(this).addClass("slider-next-normal");
			}
		});
		$(_p.nextArrow).bind("click", nextArrowClick);
		$(_p.nextArrow).appendTo($("td#narrow", _p.container));
		if(_p.thumbsCount <= _p.frameSize) {
			$(_p.nextArrow).trigger("disabled", [true]);
		}
		
		$(_p.sliderContainer).css("width", String(_p.frameSize * _p.thumbSideSize + 4) + "px");
		$(_p.slider).css("width", String(_p.frameWidth + 100) + "px");
				
		var leftSide = (_p.thumbsCount < _p.frameSize) ? _p.frameSize : _p.thumbsCount;
		
		for(i=0; i < leftSide; i++) {
	        var _item = document.createElement("div");
			
			$(_item).addClass("item-container");
			
			$("<table border='0' cellspacing='0' cellpadding='0'>" + 
			  	"<tr>" + 
					"<td valign='center' align='center'>" + 
						"<div class='indicator img-item' id='thumb'></div>" + 
					"</td>" + 
				"</tr>" +
				"<tr>" + 
					"<td valign='center' align='center' id='index' class='img-number' height='12px'></td>" + 
				"</tr>" +
			  "</table>").appendTo($(_item));
			  
			var thumbDiv = $(".img-item", _item);
			if(_p.thumbClickCallback) {
				thumbDiv.bind("click", function() {
					if(_sys.blockClicks) return;
					
					_p.container.trigger("activatePhoto", [$(this).attr(_p.extraInfoAttrName)]);
					_p.thumbClickCallback.call(this);
				});
			}
			
			if(_p.thumbHoverCallback) {
				thumbDiv.bind("mouseover", function() {
					_p.thumbHoverCallback.call(this);
				});
			}
			
			if(_p.thumbOutCallback) {
				thumbDiv.bind("mouseout", function() {
					_p.thumbOutCallback.call(this);
				});
			}
			
			if(_p.thumbsList.length > 0 && _p.thumbsList[i]) thumbDiv.attr(_p.extraInfoAttrName, _p.thumbsList[i].photoId);
			$(_item).appendTo($(_p.slider));
			
			if(!_p.drawSelectedFrame) {
				if(i < _p.frameSize && i < _p.thumbsCount) {
					// First 3 visible thumbs are signed already
					thumbDiv.removeClass("indicator")
						.css("background", "url(" + _p.thumbsList[i].url + ") no-repeat center");
						
	//				var thumbImg = new Image();
	//				thumbImg.onload = function() {
	//					var re = /^.*\/([^\?]*)\?.*$/;
	//					var photoId = (re.test(this.src)) ? re.exec(this.src)[1] : "";
	//					$("div[" + _p.extraInfoAttrName + "='" + photoId + "']", _p.container)
	//						.removeClass("indicator")
	//						.css("background", "url(" + this.src + ") no-repeat center");
	//				}
	//				thumbImg.src = _p.thumbsList[i].url;
	
					$("td#index", _item).text(String(i + 1));
		        } else {
					if(i > _p.thumbsCount - 1) {
						$("div.img-item", _item).empty();
						$("div.img-item", _item).removeClass("indicator");
						$("div.img-item", _item).addClass("img-empty-item");
						$("div.img-item", _item).unbind("click");
					} else {
						$(_item).attr("href", _p.thumbsList[i].photoId);
						$("td#index", _item).text(String(i + 1));
					}
				}
			} else {
//				IF _p.drawSelectedFrame DEFINED
				
				var leftEdge = (_p.selectedPhotoIndex - 1 < 0) ? 0 : _p.selectedPhotoIndex - 1;
				leftEdge = (_p.selectedPhotoIndex == _p.thumbsCount - 1) ? _p.selectedPhotoIndex - 2 : leftEdge;
				leftEdge = (_p.selectedPhotoIndex == 0) ? 0 : leftEdge;
				
				var rightEdge = (_p.selectedPhotoIndex + 1 > _p.thumbsCount - 1) ? _p.thumbsCount - 1 : _p.selectedPhotoIndex + 1;
				rightEdge = (_p.selectedPhotoIndex == 0) ? ((_p.thumbsCount <= 3) ? _p.thumbsCount - 1 : rightEdge + 1) : rightEdge;
				
				$(_p.prevArrow).trigger("disabled", [(leftEdge < 1)]);
				$(_p.nextArrow).trigger("disabled", [(rightEdge > _p.thumbsCount - 2)]);
				
				var offset = 2;
				if(_p.selectedPhotoIndex == _p.thumbsCount - 1) offset = 3;
				if(_p.selectedPhotoIndex > _p.frameSize - 2) {
					$(_p.slider).css("left", String(-(_p.frameSlideStep * (_p.selectedPhotoIndex + 1)) + offset * _p.frameSlideStep) + "px");
				}
				
				if(i >= leftEdge && i <= rightEdge) {
					thumbDiv.removeClass("indicator")
						.css("background", "url(" + _p.thumbsList[i].url + ") no-repeat center");
					$("td#index", _item).text(String(i + 1));
				} else {
					if(i > _p.thumbsCount - 1) {
						$("div.img-item", _item).empty();
						$("div.img-item", _item).removeClass("indicator");
						$("div.img-item", _item).addClass("img-empty-item");
						$("div.img-item", _item).unbind("click");
					} else {
						$(_item).attr("href", _p.thumbsList[i].photoId);
						$("td#index", _item).text(String(i + 1));
					}
				}
			}
			
			if(_p.drawSelectedFrame) {
				if((_p.selectedPhotoId && _p.thumbsList[i] && _p.thumbsList[i].photoId == _p.selectedPhotoId) || (!_p.selectedPhotoId && i == 0)) {
					_p.selectedPhotoId = _p.thumbsList[i].photoId;
					thumbDiv.addClass("img-item-selected").removeClass("img-item");
				}
			}
	    }
	}
	
	function prevArrowClick() {
		if(_p.thumbsCount <= _p.frameSize || _sys.blockSlider) {
			return;
		}
		
		_sys.blockSlider = true;
		var container = $(_p.slider);
        var container_left = parseInt(container.css("left"), 10);
        if(container_left + _p.frameSlideStep >= 0) {
			$(_p.nextArrow).trigger("disabled", [false]);
			$(_p.prevArrow).trigger("disabled", [true]);
			container_left = 0; 
		} else {
			$(_p.nextArrow).trigger("disabled", [false]);
			container_left += _p.frameSlideStep;
		}
		container.animate({left: String(container_left) + "px"}, "fast", "linear", function() {
			if(_p.drawSelectedFrame) renderFrameP(container_left);
			_sys.blockSlider = false;
		});
	}
	
	function nextArrowClick() {
		if(_p.thumbsCount <= _p.frameSize || _sys.blockSlider) {
			return;
		}
		
		_sys.blockSlider = true;
		var container_left = parseInt($(_p.slider).css("left"), 10);
		if(container_left - _p.frameSlideStep <= -_p.rightSlideLimit) {
			$(_p.nextArrow).trigger("disabled", [true]);
			$(_p.prevArrow).trigger("disabled", [false]);

			container_left = -_p.rightSlideLimit;
		} else {
			$(_p.prevArrow).trigger("disabled", [false]);
			container_left -= _p.frameSlideStep;
		}
		$(_p.slider).animate({left: String(container_left) + "px"}, "fast", "linear", function() {
			_sys.blockSlider = false;
			renderFrameN(container_left);
		});
	}
	
	function renderFrameN(leftPos) {
		var renderThumbIndex = Math.round( ((Math.abs(leftPos) / (_p.frameSize * _p.thumbSideSize)) + 1) * _p.frameSize );
		var item = $(">.item-container", _p.slider)[renderThumbIndex - 1];
        var item_id = $(item).attr("href");
        if(item_id) {
            $(item).removeAttr("href");
			if(_p.getSignedUrlHandler) _p.getSignedUrlHandler(item_id);
        }
	}
	
	function renderFrameP(leftPos) {
		var renderThumbIndex = Math.round( ((Math.abs(leftPos) / (_p.frameSize * _p.thumbSideSize)) + 1) * _p.frameSize ) - _p.frameSize + 1;
		var item = $(">.item-container", _p.slider)[renderThumbIndex - 1];
        var item_id = $(item).attr("href");
        if(item_id) {
            $(item).removeAttr("href");
			if(_p.getSignedUrlHandler) _p.getSignedUrlHandler(item_id);
        }
	}
	
	function getSelectedIndex() {
		var result = null;
		for(var i=0; i<_p.thumbsList.length; i++) {
			if(_p.thumbsList[i].photoId == _p.selectedPhotoId) {
				result = i;
			}
		}
		
		result = !result ? 0 : result;
		if(result == 0 && _p.thumbsCount > 0) _p.selectedPhotoId = _p.thumbsList[0].photoId;
		
		return result;
	}
};