Участник:Degit22:ru/common.js — различия между версиями

Версия 17:47, 23 июня 2015

//display: block; background: rgba(0, 0, 0, 0.8) url("//wikicdn.wargaming.net/images/4/42/Loading.gif") no-repeat scroll 50% 50%;
/* добавляет структуру для просмотра увеличенных изображений без перехода на другую страницу */
function addImagePopupWindow2() {
  $('body').append('<div id="popupImageWindow2"><table><tr><td style="vertical-align: middle;">'+
	'<div id="popupImage-overlay" style="background-color: rgb(119, 119, 119); opacity: 0.7; cursor: pointer; height: 100%; width: 100%; display: block; position: absolute; left: 0px; top: 0px;"></div>'+
    '<div id="popupImageWrapper" style="position: relative; display: inline-block;">'+
    '<img id="popupImage2" src="" /><img src="//wikicdn.wargaming.net/images/b/bd/Close.png" class="closeBtn">'+
    '<a style="display: inline; width: 35%; left: 0px; position: absolute; height: 100%; top: 0px;" href="javascript:;" id="popupImage-left">'+
        '<span id="popupImage-left-ico" style="cursor: pointer; top: 50%; position: absolute; left: 20px; background: transparent url(\'//wiki.gcdn.co/images/f/f1/Prev.png\') repeat scroll 0% 0%; height: 42px; width: 42px;"></span>'+
    '</a>'+
    '<a style="display: inline; width: 35%; right: 0px; position: absolute; height: 100%; top: 0px;" href="javascript:;" id="popupImage-right">'+
        '<span id="popupImage-right-ico" style="cursor: pointer; top: 50%; position: absolute; right: 20px; background: transparent url(\'//wiki.gcdn.co/images/c/c4/Next.png\') repeat scroll 0% 0%; height: 42px; width: 42px;"></span>'+
    '</a>'+
    '<div id="popupImageInfo"></div></div>'+
    '</td></tr></table></div>'+
    '<div id="popupImageButtons"><a id="openImageFile" href="javascript:;">Файл</a></div>');
}

var gallersArray = [], currentGalleryIndex = 0, currentImageIndex = 0;

function setImage(indexGallery, indexImage) {
	if (gallersArray[indexGallery].length < indexImage + 1 || indexImage < 0) {
		return false;
	}
	currentGalleryIndex = indexGallery;
	currentImageIndex = indexImage;
	$('#popupImage2').width('1px');
	$('#popupImage2').height('1px');
	$('#popupImage-overlay').css('background-image', 'url('+imageLoaderUrl+')');
	$('#popupImage2').attr('src', gallersArray[indexGallery][indexImage].src);
	$('#popupImageButtons a#openImageFile').attr('href', gallersArray[indexGallery][indexImage].href);
	$('#popupImageInfo').text(gallersArray[indexGallery][indexImage].text);
	$('#popupImageWrapper').hide();
	$('#popupImageWindow2').show();
	$('#popupImageButtons').show();
}

function nextImage() {
	setImage(currentGalleryIndex, currentImageIndex + 1);
}

function prevImage() {
	setImage(currentGalleryIndex, currentImageIndex - 1);
}

/* добавляет функционал просмотра увеличенных изображений без перехода на другую страницу */
function addImagePopups2() {
	addImagePopupWindow2();
	$('a.image').unbind('click'); ////////////////////////
	
	$.each($('ul.gallery'), function(indexGallery, valueGallery) {
		gallersArray[indexGallery] = [];
		$.each($(valueGallery).find('li.gallerybox'), function(indexImage, valueImage) {
			var Image = new Object();
			var srcStr = $(valueImage).find('a.image img').attr('src');
			if (typeof srcStr !== 'undefined') {
				if (srcStr.indexOf('thumb/')+1 > 0) {
					srcStr = srcStr.replace(/thumb\//gi, '');
					srcStr = srcStr.substring(0, srcStr.lastIndexOf("/"));
				}
			}
			Image.src = srcStr;
			Image.text = $(valueImage).find('div.gallerytext').text().trim();
			Image.href = $(valueImage).find('a.image').attr('href');
			if (typeof Image.src !== 'undefined') {
				gallersArray[indexGallery][indexImage] = Image;
				$(valueImage).find('a.image').click(function(index) {
					setImage(indexGallery, indexImage);
					return false;
				});
				//alert(Image.src + ": " + Image.text);
			}
		});
		
		//value
		//gallersArray
		//currentArray.length
		
		
	});
	//setImage
	
	/*$('ul.gallery li.gallerybox a.image').click(function(index) {
		$('#popupImage2').attr('src', '');
		$('#popupImageWindow2 table').css('background-image', 'url('+imageLoaderUrl+')');
		var srcStr = $(this).children('img').attr('src'); //Адрес картинки
		//var srcPrevStr = $(this).prev().children('img').attr('src');
		//alert(srcPrevStr);
		if (srcStr.indexOf('thumb/')+1 > 0) {
			srcStr = srcStr.replace(/thumb\//gi, '');
			srcStr = srcStr.substring(0, srcStr.lastIndexOf("/"));
		}
		$('#popupImage2').width('1px');
		$('#popupImage2').height('1px');
		$('#popupImage2').attr('src', srcStr);
		$('#popupImageButtons a#openImageFile').attr('href', $(this).attr('href'));

		var titleStr = ''; //Подпись
		if ($(this).next('div.thumbcaption').length > 0) {
			titleStr = $(this).next('div.thumbcaption').text().trim();
		} else if($(this).parent().parent().parent().children('div.gallerytext').length>0){
			titleStr = $(this).parent().parent().parent().children('div.gallerytext').text().trim();
		} //слабоумие и отвага
		if (titleStr.trim().length > 0) {$('#popupImageInfo').text(titleStr.trim());} else {$('#popupImageInfo').text('');}
		$('#popupImageWrapper').hide();
		$('#popupImageWindow2').show();
		$('#popupImageButtons').show();
		return false;
	});*/

	// При загрузке картинки
	$('#popupImage2').load(function() {
		$('#popupImage2').width('');
		$('#popupImage2').height('');
		$(this).css('max-width', (self.innerWidth-100)+'px');
		$(this).css('max-height',(self.innerHeight-100)+'px');
		$('#popupImageWindow2 table').css('background-image', '');
		$('#popupImageWrapper').show();
		if ($('#popupImageInfo').text().trim().length > 0) {$('#popupImageInfo').show();} else {$('#popupImageInfo').hide();}
	});

	//Закрыть попап
	$('.closeBtn').click(function(index) {
		$('#popupImageWindow2').hide();
		$('#popupImageButtons').hide();
		$('#popupImageButtons a').attr('href', '#');
		$('#popupImageInfo').text('');
		$('#popupImage2').attr('src', '');
	});

	$('#popupImage-overlay').click(function(index) {
		$('#popupImageWindow2').hide();
		$('#popupImageButtons').hide();
		$('#popupImageButtons a').attr('href', '#');
		$('#popupImageInfo').text('');
		$('#popupImage2').attr('src', '');
	});

	$('a#popupImage-left').click(function(index) {
		prevImage();
		return false;
	});

	$('a#popupImage-right').click(function(index) {
		nextImage();
		return false;
	});
};

$(document).ready(function(){
	setTimeout(addImagePopups2, 0);
});