﻿/*
 * Увеличение картинок
 * Разработка - Скубаев Алексей (Test-Templates.com) для CMS JSmart
 * Версия: 2.2
 * Изменен вид панели навигации
 * Пофикшены мелкие баги
*/

$(document).ready(function() {

	//Задаем элементы, к которым применяется библиотека
	$('.zoom a:has(img)').removeAttr('onclick');
	
	var Timages = $('.zoom a:has(img)');
	
	
	////////////////////////////////////////////////////////////////////////////////////
	/////////////////////////////// Функция по клику ///////////////////////////////////
	//////////////////////////////// на изображение ////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////
	function clickImages() {
		$('body').append('<div class="clickimage-shad"><div class="loading">Загрузка...</div></div>');
		$('body').append('<div class="clickimage-block"></div>');
		
		var currentImageUrl = $(this).attr('href');
		
		if ($(this).find('img').attr('alt') !== undefined) { 
			var currentImageTitle = $(this).find('img').attr('alt');
		} else { 
			var currentImageTitle = 'Без названия';
		} 
		
		$('.clickimage-block').animate({opacity: 0},100,function(){
			$('.clickimage-shad').fadeIn(500);
			$(this).html('<img src=' + currentImageUrl + ' class="clickimage-block-image" />').find('img').bind('load',function(){
				
				$('.clickimage-block').animate({opacity: 1},100);
				
				var currentWindowWidth = $(window).width();
				var currentWindowHeight = $(window).height();
				
				var currentImageWidth = $('.clickimage-block-image').width();
				var currentImageHeight = $('.clickimage-block-image').height();
				
				if( currentWindowWidth < currentImageWidth )
					{
						var currentImageWidth = currentWindowWidth - 100;
						$('.clickimage-block-image').css({'width':currentImageWidth, 'margin-left': -currentImageWidth/2-5});
						var currentImageHeight = $('.clickimage-block-image').height();
						$('.clickimage-block-image').css({'width':currentImageWidth, 'margin-top': -currentImageHeight/2-5});
						
						$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
						$('body').css({'overflow':'hidden'});
						
						if( currentWindowHeight < currentImageHeight )
						{
							$('.clickimage-block-image').css({'margin-top':'10px', 'margin-left': -currentImageWidth/2-5, 'top':'0'});
							
							$('.clickimage-block-title').remove();
							$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
							$('body').css({'overflow':'hidden'});
						}
					}
					else
					{
						if( currentWindowHeight < currentImageHeight )
						{
							$('.clickimage-block-image').css({'margin-top':'10px', 'margin-left': -currentImageWidth/2-5, 'top':'0'});
							
							$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
							$('body').css({'overflow':'hidden'});
						}
						
							else {
								$('.clickimage-block-image').css({'margin-top': -currentImageHeight/2-5, 'margin-left':-currentImageWidth/2-5});
								
								$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
								}
					}
				
			});
			
		});
		
		// Вставялем блок для навигации
		$('body').append('<div class="navigation-bottom-panel"></div>');
			
		var ImagesArray = Timages;
		var currentParentImageCount = 0;
		for (i=0; i<ImagesArray.length; i++)
		{
			$(ImagesArray[i]).addClass('count-a'+i);
			var srcImagesForPreview = $(ImagesArray[i]).find('img').attr('src');
			currentParentImageCount = currentParentImageCount + 1;
			$('.navigation-bottom-panel').append('<div class="navigation-bottom-panel-item" rel="count-a'+i+'"><div class="navigation-bottom-panel-item2"><img src="'+srcImagesForPreview+'" /></div></div>');
		}
			
		var currentImageBody =  $(this).attr('class');
		$('.navigation-bottom-panel div[rel="'+currentImageBody+'"]').css({'opacity':'1'}).addClass('fix-hover');
		
		var currentWindowWidth2 = $(window).width();
		
		// Количество элементов в линии
		var currentElementNumLine = (currentWindowWidth2 / 60);
		
		var currentHeightPanel = currentParentImageCount / currentElementNumLine *96 + 60;
		
		if( currentElementNumLine < currentParentImageCount ){
			$('.navigation-bottom-panel').live('hover', function(){ 
				$(this).stop(true).animate({'height':currentHeightPanel});
			});
			
			$('.navigation-bottom-panel').live('mouseleave', function(){ 
				$(this).stop(true).animate({'height':'10%'});
			});
		}
		
		return false;
	}
	
	// Вызов функций через магический портал
	Timages.click(clickImages);
	$('.navigation-bottom-panel-item').live('click',clickImages2);
	
	// Очистка преисподней
	$('.clickimage-block-image, .clickimage-shad, .clickimage-block').live('click', function(){ 
		$('.loading').hide();
		$('body').attr('style','');
		$('.clickimage-shad').fadeOut(500);
		$('.clickimage-block').fadeOut(500, function() { $('.clickimage-shad, .clickimage-block, .navigation-bottom-panel').remove(); });
	});
	
	////////////////////////////////////////////////////////////////////////////////////
	/////////////////////////////// Функция по клику ///////////////////////////////////
	///////////////////////////////// на навигацию /////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////
	function clickImages2() {
	
		$('.clickimage-block-title, .navigation-bottom-panel, .clickimage-block-image').remove();
	
		var currentImageActive = $(this).attr('rel');
		var megaThis = $('a[class="'+currentImageActive+'"]')
	
		
		
		var currentImageUrl = megaThis.attr('href');
		
		if (megaThis.find('img').attr('alt') !== undefined) { 
			var currentImageTitle = megaThis.find('img').attr('alt');
		} else { 
			var currentImageTitle = 'Без названия';
		} 
		
		$('.clickimage-block').animate({opacity: 0},100,function(){
			$('.clickimage-shad').fadeIn(500);
			$(this).html('<img src=' + currentImageUrl + ' class="clickimage-block-image" />').find('img').bind('load',function(){
				
				$('.clickimage-block').animate({opacity: 1},100);
				
				var currentWindowWidth = $(window).width();
				var currentWindowHeight = $(window).height();
				
				var currentImageWidth = $('.clickimage-block-image').width();
				var currentImageHeight = $('.clickimage-block-image').height();
				
				if( currentWindowWidth < currentImageWidth )
					{
						var currentImageWidth = currentWindowWidth - 100;
						$('.clickimage-block-image').css({'width':currentImageWidth, 'margin-left': -currentImageWidth/2-5});
						var currentImageHeight = $('.clickimage-block-image').height();
						$('.clickimage-block-image').css({'width':currentImageWidth, 'margin-top': -currentImageHeight/2-5});
						
						$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
						$('body').css({'overflow':'hidden'});
						
						if( currentWindowHeight < currentImageHeight )
						{
							$('.clickimage-block-image').css({'margin-top':'10px', 'margin-left': -currentImageWidth/2-5, 'top':'0'});
							
							$('.clickimage-block-title').remove();
							$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
							$('body').css({'overflow':'hidden'});
						}
					}
					else
					{
						if( currentWindowHeight < currentImageHeight )
						{
							$('.clickimage-block-image').css({'margin-top':'10px', 'margin-left': -currentImageWidth/2-5, 'top':'0'});
							
							$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
							$('body').css({'overflow':'hidden'});
						}
						
							else {
								$('.clickimage-block-image').css({'margin-top': -currentImageHeight/2-5, 'margin-left':-currentImageWidth/2-5});
								
								$('.navigation-bottom-panel').append('<div class="clickimage-block-title"><span>'+currentImageTitle+'</span></div>');
								}
					}
				
			});
			
		});
		
		// Вставялем блок для навигации
		$('body').append('<div class="navigation-bottom-panel"></div>');
			
		var ImagesArray = Timages;
		var currentParentImageCount = 0;
		for (i=0; i<ImagesArray.length; i++)
		{
			$(ImagesArray[i]).addClass('count-a'+i);
			var srcImagesForPreview = $(ImagesArray[i]).find('img').attr('src');
			currentParentImageCount = currentParentImageCount + 1;
			$('.navigation-bottom-panel').append('<div class="navigation-bottom-panel-item" rel="count-a'+i+'"><div class="navigation-bottom-panel-item2"><img src="'+srcImagesForPreview+'" /></div></div>');
		}
			
		var currentImageBody =  megaThis.attr('class');
		$('.navigation-bottom-panel div[rel="'+currentImageBody+'"]').css({'opacity':'1'}).addClass('fix-hover');
		
		return false;
	}
	
	
	//////////////////////////////////////////////////////////////////////////////////
	/////////////////////////// Показ превиюшек //////////////////////////////////////
	//////////////////////////////////////////////////////////////////////////////////
	$('.navigation-bottom-panel-item').live('hover', function(){ 
		
			$(this).css({'opacity':'1'});
			var currentImageActive = $(this).attr('rel');
			var megaThis = $('a[class="'+currentImageActive+'"]')
			
			var hoverCurrentImageUrl = megaThis.find('img').attr('src');
			
			$(this).append('<div class="navigation-hidden"><img src="'+hoverCurrentImageUrl+'" /></div>');
			$('.navigation-hidden').animate({
				'opacity':'1'
			});
	});
	
	// Очистка
	$('.navigation-bottom-panel-item').live('mouseleave', function(){ 
		$(this).css({'opacity':'0.5'});
		$('.navigation-hidden').remove();
	});

	
});

