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

Версия 16:54, 24 июня 2015

/* добавляет структуру для просмотра увеличенных изображений без перехода на другую страницу */
function addImagePopupWindow2() {
    $('body').append(
        '<div id="popupImageWindow2"><table><tr><td style="vertical-align: middle;">'+
            '<div id="popupImageOverlay"></div>'+
            '<div id="popupImageWrapper2">'+
                '<img id="popupImage2" src="" />'+
                '<img src="//wikicdn.wargaming.net/images/b/bd/Close.png" class="closeBtn">'+
                '<a id="popupImage-left" href="javascript:;">'+
                    '<span id="popupImage-ico-left" class="popupImage-ico"></span>'+
                '</a>'+
                '<a id="popupImage-right" href="javascript:;">'+
                    '<span id="popupImage-ico-right" class="popupImage-ico"></span>'+
                '</a>'+
                '<div id="popupImageInfo2"></div>'+
            '</div>'+
        '</td></tr></table></div>'+
        '<div id="popupImageButtons2"><a id="openImageFile2" href="javascript:;">Файл</a></div>'
    );
}

var gallersArray = [], // Массив галерей в которых массив объектов (src, text, href)
    currentGalleryIndex = 0, currentImageIndex = 0;

/* Открывает картинку */
function setImage(indexGallery, indexImage) {
    currentGalleryIndex = indexGallery;
    currentImageIndex = indexImage;
    $('#popupImage2').width('1px');
    $('#popupImage2').height('1px');
    $('#popupImageOverlay').css('background-image', 'url('+imageLoaderUrl+')');
    $('#popupImage2').attr('src', gallersArray[indexGallery][indexImage].src);
    $('#popupImageButtons2 a#openImageFile2').attr('href', gallersArray[indexGallery][indexImage].href);
    $('#popupImageInfo2').html(gallersArray[indexGallery][indexImage].text);
    if (gallersArray[indexGallery].length < indexImage + 2) { // Если нет следующей картинки убираем кнопку
        $('#popupImage-right').hide();
    } else {
        $('#popupImage-right').show();
    }
    if (indexImage - 1 < 0) { // Если нет предыдущей картинки убираем кнопку
        $('#popupImage-left').hide();
    } else {
        $('#popupImage-left').show();
    }
    $('#popupImageWrapper2').hide();
    $('#popupImageWindow2').show();
    $('#popupImageButtons2').show();
}

/* добавляет функционал просмотра увеличенных изображений без перехода на другую страницу */
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;
                });
            }
        });
    });

    // Для одиночных эскизров
    $.each($('a.image').not($('.js-vehicles_by_types a.image')).not($('ul.gallery a.image')), function(index, value) {
        var indexGallery = gallersArray.length;
        gallersArray[indexGallery] = [];
        var Image = new Object();
        var srcStr = $(value).find('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;
        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();
        }
        Image.text = titleStr;
        Image.href = $(value).attr('href');
        if (typeof Image.src !== 'undefined') {
            gallersArray[indexGallery][0] = Image;
            $(value).click(function(index) {
                setImage(indexGallery, 0);
                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');
        $('#popupImageOverlay').css('background-image', '');
        $('#popupImageWrapper2').show();
    });

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

    //Закрыть попап фоном
    $('#popupImageOverlay').click(function(index) {
        $('#popupImageWindow2').hide();
        $('#popupImageButtons2').hide();
        $('#popupImageButtons2 a').attr('href', '#');
        $('#popupImageInfo2').text('');
        $('#popupImage2').attr('src', '');
    });

    // Предыдущую картинку
    $('a#popupImage-left').click(function(index) {
        setImage(currentGalleryIndex, currentImageIndex - 1);
    });

    // Следующую картинку
    $('a#popupImage-right').click(function(index) {
        setImage(currentGalleryIndex, currentImageIndex + 1);
    });
};

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