var PopupImage = {};
//текущая картинка 
PopupImage.currentImageUrl = null;
//константы состояния 
PopupImage.STATE_CLOSE = 0;
PopupImage.STATE_OPEN = 1;
PopupImage.STATE_CHANGE = 2;
PopupImage.state = PopupImage.STATE_CLOSE;
//обработчики смены статутса 
PopupImage.onStatusHandlers = [];
//некоторые константы 
PopupImage.PRELOAD_W = 600;
PopupImage.PRELOAD_H = 400;
PopupImage.RESIZE_PX_PER_SEC = 1000;
PopupImage.SHOW_IMG_DURATION = 300;
PopupImage.CLOSE_ALL_DURATION = 200;

PopupImage.init = function() {
	//получаем основные DOM-элементы
	this.jContainer = $("#popup_cont"); //общий контейнер
	this.jWhiteArea = $("#popup_white_area"); //белая область вокруг прелоадера
	this.jMainArea = $("#popup_main_area"); //область - содержащая все напрозрачные элементы
	this.jPreloader = $("#popup_preloader"); 
	this.jImage = $("#popup_main_img");	
}
//отобразить новую картинку
PopupImage.setImage = function(imageUrl) {
	//если сейчас происходит анимация - игнорировать
	if(this.state == PopupImage.STATE_CHANGE)
		return;
	//если картинка закрыта
	if(this.state == PopupImage.STATE_CLOSE) {
		//открыть картинку		
		this.open();		
	}
	//показать прелоадер
	this.jPreloader.show();
	//установить состояние
	this._setState(PopupImage.STATE_CHANGE);
	//начать загружать картику
	if(this.loadImage) {//memory leaks fix
		this.loadImage.onload = null;
		this.loadImage.onerror = null;
	}
	this.loadImage = new Image();
	this.loadImage.onload = function(){PopupImage._onImageLoaded();}
	this.loadImage.onerror = function(){PopupImage._onImageError();}
	this.loadImage.src = imageUrl;
}

//обработка события "Новая картинка загружена" 
PopupImage._onImageLoaded = function() {	
	//скрыть прелоадер
	this.jPreloader.hide();
	
	//получить размер картинки 
	//var newWidth  = this.loadImage.width;
	var newHeight = this.loadImage.height;
	//нужно ли менять размер
	//var isWidthChanged = newWidth != this.currentWidth;
	var isHeightChanged = newHeight != this.currentHeight;
	var isNeedResize = isHeightChanged;
	//новую картинку НЕ нужно создавать, если изменяется размер,
	//или текущая картинка не содержит изображения	
	var isCreateNewImage = !isNeedResize && this.jImage.attr('src').length > 0;
	if(isCreateNewImage) {
		var jNewImage = $(document.createElement("img"));
		var leftIndent = (600 - this.loadImage.width) / 2;
		jNewImage.css({position: 'absolute', left:leftIndent, top:0});
		
		if(this.onNewImage) {
			this.onNewImage(jNewImage);
		}
	} else
		var jNewImage = this.jImage;
	//показать новыу картинку и увести в альфу 
	jNewImage.css('opacity', 0);	
	jNewImage.attr('src', this.loadImage.src);	
	if(isCreateNewImage)
		this.jImage.after(jNewImage);
	else
		jNewImage.show();
	//функция для отображения картинки и установки нового статуса
	var fnShowImg = function() {
		jNewImage.animate({opacity: 1}, PopupImage.SHOW_IMG_DURATION, 'linear', function(){						
			//удалит старую картинку
			if(isCreateNewImage) {
				PopupImage.jImage.remove();
				PopupImage.jImage = jNewImage;
				jNewImage.css('position', '');
			}
			PopupImage.currentImageUrl = PopupImage.jImage.attr('src');
			PopupImage._setState(PopupImage.STATE_OPEN);
		});		
	}
	//если размер нужно поеменять
	if(isNeedResize) {
		//установим размер белой области в соответсви со старой картинкой
		this.jWhiteArea.css({
			//width:  this.currentWidth,
			height: this.currentHeight
		});
		//считем длительность анимации 
		//var dx = Math.abs(newWidth - this.currentWidth);
		var dy = Math.abs(newHeight - this.currentHeight);
		var dPx = dy;//dx > dy ? dx : dy;
		var duration = (dPx / PopupImage.RESIZE_PX_PER_SEC) * 1000;		
		//изменяем размер, по окончании показыываем картинку 
		var o = {
			//width:  newWidth,
			height: newHeight
		};
		this.jWhiteArea.animate(o, duration, 'linear', fnShowImg);
	} else {//если размер остаётся старый 
		//показываем картинку 
		fnShowImg();
	}
		
	//запомнить размер текущей картинки 
	//this.currentWidth  = newWidth;
	this.currentHeight = newHeight;
}

//обработка неудачной попытки загрузки изображения 
PopupImage._onImageError = function() {
	//вывести сообщение об ошибке 
	alert("Ошибка при загрузке изображения");
	//закрыть окно
	this.close();
}

//открытие ранее закртыой картинки
PopupImage.open = function() {
	//не показывать картинку, пока она не загрузится 
	this.jImage.hide();
	//дефолтные размеры перлоадера 
	this.jWhiteArea.css({
		width:  PopupImage.PRELOAD_W,
		height: PopupImage.PRELOAD_H
	});
	//установить зрамер прелоадера как текущий 
	this.currentWidth = PopupImage.PRELOAD_W;
	this.currentHeight = PopupImage.PRELOAD_H;
	//закрыть при клике по любой точке экрана 
	$(document).bind('click', PopupImage.close);
	//отобразить
	this.jContainer.show();
}

//может выполняться в глобальном контексте, не использовать this 
PopupImage.close = function() {
	//снать обработчик на закртыие 
	$(document).unbind('click', PopupImage.close);
	//скрыть всё в альфу 
	PopupImage.jMainArea.animate({opacity: 0},PopupImage.CLOSE_ALL_DURATION, 'linear', function() {
		//по окончании установить новый статус и снять альфу 
		PopupImage.jContainer.hide();
		PopupImage.jMainArea.css({opacity: 1});
		PopupImage._setState(PopupImage.STATE_CLOSE);
		//убрать ссылку с картинки
		PopupImage.jImage.attr("src", "");
	});		
}

PopupImage._setState = function(newState) {
	//проверить статус 
	if(newState === undefined)
		alert("Undefined state");
	//установить статус 
	this.state = newState;
	//вызвать обработчики 
	for(var i=0; i<this.onStatusHandlers.length; i++) {
		this.onStatusHandlers[i].call(this);
	}
}

PopupImage.addOnStatusChanged = function(callback) {
	this.onStatusHandlers.push(callback);
}

/////////////////////////////////
// Объект для отображения информации о продукте 
// при просмотре увеличенной фотографии
PopupProductInfo = {};

PopupProductInfo.init = function(){
	//Основные элементы
	PopupProductInfo.jTitle = $("#popup_product_title");
	PopupProductInfo.jDescription = $("#popup_product_info");
	PopupProductInfo.jPrice = $("#popup_product_price");
	PopupProductInfo.jMass = $("#popup_product_mass");
	PopupProductInfo.jCount = $("#popup_product_count");
	//увеличение/уменьшение кол-во
	$("#popup_product_up").click(function(){
		PopupProductInfo.incCount();
		return false;
	});
	$("#popup_product_down").click(function(){
		PopupProductInfo.decCount();
		return false;
	});
};
//отобразить конкрентый продукт
PopupProductInfo.setProductId = function(productId) {
	this.productId = productId;
	//отображаем параметры продукта
	this.jTitle.html( this.getProductTitle() );
	this.jDescription.html( this.getProductDescription() );
	this.jMass.html( this.getProductMass() );
	this.jPrice.html( this.getProductPrice() );
	//кол-во продуктов в корзине
	var count = g_basket.getProductCount(this.productId);
	this.setCount(count, true);
}
//получает название продукта
PopupProductInfo.getProductTitle = function() {
	return $("#title_" + this.productId).html();
}
//получает описание продукта
PopupProductInfo.getProductDescription = function() {
	return $("#description_" + this.productId).html();
}
//получает выход продукта
PopupProductInfo.getProductMass = function() {
	return $("#mass_" + this.productId).html();
}
//получает цену продукта
PopupProductInfo.getProductPrice = function() {
	return $("#price_" + this.productId).html();
}
//установить количество товаров в корзине
PopupProductInfo.setCount = function(count, isNoChangeInBasket) {
	this.count = parseInt(count);
	//отобразить изменение
	this.jCount.html(count.toString());
	//обновить в корзине
	if(!isNoChangeInBasket) {
		g_basket.changeCount(this.productId, count);
	}
}

PopupProductInfo.incCount = function() {
	this.setCount(this.count + 1);
}

PopupProductInfo.decCount = function() {
	if(this.count > 0)
		this.setCount(this.count - 1);
}

$().ready(function(){	
	//инициализация 
	PopupImage.init();
	PopupProductInfo.init();
	//полуим спиок картинок	
	var jImageLinks = $(".j_popup_image");
	//при щелчке по картинке - открыть её 
	jImageLinks.click(function() {
		PopupImage.setImage(this.href);
		return false;
	});		
	jImageLinks.focus(function(){this.blur();});	
	////////
	// Кнопки "вперёд", "назад" 
	var currentIndex = 0;
	//установить индекс открытой картинки
	function setCurrentIndex(index) {
		currentIndex = index;
		//отобразить текущий индекс
		var sIndex = currentIndex + 1;
		var sCount = jImageLinks.length;
		$("#popup_image_number").html(sIndex + " \\ " + sCount);
		//получим ID продукта
		var productId = fromClass(jImageLinks[index], "id_");
		PopupProductInfo.setProductId(productId);
	}
	//при открытии картинки 
	PopupImage.addOnStatusChanged(function(){
		if(this.state == PopupImage.STATE_OPEN) {
			//получаем индекс текущей картинки 
			for(var i=0; i<jImageLinks.length; i++) {
				if(this.currentImageUrl == jImageLinks[i].href) {
					setCurrentIndex(i);					
					break;
				}
			}
		}
	});
		
	//при нажатии на кнопку назад 
	$("#popup_image_back").click(function(){
		//если открыта не первая картинка 
		if(currentIndex > 0) {
			//показать предыдущую картинку 
			var newIndex = currentIndex - 1;
		} else {
			//иначе показать последнюю
			var newIndex = jImageLinks.length - 1;
		}
		PopupImage.setImage(jImageLinks[newIndex]);
		return false;
	});
		
	//при нажатии на кнопку вперёд 
	function nextImage() {
		//если открыта не последняя картинка картинка 
		if(currentIndex < jImageLinks.length - 1) {
			//показать предыдущую картинку 
			var newIndex = currentIndex + 1;			
		} else {
			//иначе показать первую
			var newIndex = 0;
		}
		PopupImage.setImage(jImageLinks[newIndex]);
		return false;
	}
	
	$("#popup_image_next,#popup_main_img").click(nextImage);
	PopupImage.onNewImage = function(jImage) {
		jImage.click(nextImage);
	}
});