// Вызывается так:
/*
1 вариант - динамическая загрузка изображений при загрузке страницы

В html пишем: 
<a class="autoload" onclick="popup.show_load_image(this.href); return false;" href="...">...

<script type="text/javascript">
var popup = new popupImage();
popup.getElementsByClassName('a', 'autoload');
popup.loadHiddenImages();
</script>

2 вариант - загрузка изображений непосредственно при клике по ссылке

В html пишем: 
<a onclick="popup.show_size_image(this.href, 232, 435); return false;" href="...">...

<script type="text/javascript">
var popup = new popupImage();
</script>
*/

/**
 * Данная функция регистриуется как обработчик
 * события при onclick на всплывающем слое и изображении.
 * 
 * @param object ссылка на объект DIV или IMG
 */
function popupImage_close(_this)
{
    // ссылка на объект DIV-a
    var id = _this.parentNode;
    
    // визуальный фильтр blendTrans и сокрытие слоя
    id.style.filter="blendTrans(duration=1)";
    if (id.filters && id.filters.blendTrans.status != 2) {
        id.filters.blendTrans.apply();
        id.style.visibility = 'hidden';
        id.filters.blendTrans.play();
    }
    else
    {
        id.style.visibility = 'hidden';
    }
    
    // "освещение" body
    var bodys = document.getElementsByTagName('body');
    bodys[0].style.filter = "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}


function popupImage()
{
    // Массив, который в дальнейшем будет заполнен 
    // ссылками на теги a с классом равным loadImage
    var links = new Array();
    
    // Массив, который в дальнейшем будет заполнен  
    // путями до изображений.
    var image_array = new Array();
    
    this.cursor_url = '/server/error.ico';
    
    // ID всплывающего блока
    this.divId = 'popUpBlock_123';
    
	// padding вспывающего блока
    this.padding = 10;
    
    // Заполняет массив this.links ссылками на тэги tagName 
    // с классом className
    this.getElementsByClassName = function (tagName, className)
    {
        var allImageAnhors = document.getElementsByTagName(tagName);
        var j = 0;
    
        for (var i=0; i<allImageAnhors.length; i++)
        {
    	    var tClasName = allImageAnhors.item(i).className;
            
            if (tClasName == className || tClasName.indexOf(className) != -1)
            {
                links[j++] = allImageAnhors.item(i);
            }
        }
    }

    // *подгружает* изображения и формирует глобальный массив 
    // с путями к этим изображениям.
    this.loadHiddenImages = function()
    {
        var j = 0;
        for (i=0; i<links.length; i++) 
        {
            var tsrc = links[i].getAttribute('href');
    		
    		// Протокол и хост
    		var protocol_host = location.protocol + "//" + location.host;
    		
    		// Поскольку Mozilla возвращает значение атрибута href без протокола и хоста
    		// то в случае их отсутствия, приписываем их к адресу изображения.
    		if (tsrc.indexOf(protocol_host) == -1)
            {
    			tsrc = protocol_host + tsrc;
    		}
    		
            eval("loadImage_" + i + " = new Image();\
            loadImage_" + i + ".src = '" + tsrc + "'");
            image_array[j++] = tsrc;
        }
    }
    
    // Показывает картинку, загружая её во время вызова.
    this.show_size_image = function(src, width, height)
    {
        this.show_image(src, width, height);
    }
    
    // Показывает уже загруженную картинку по URL src
    this.show_load_image = function(src)
    {
        // находим в массиве путей изображений порядковый номер изображения с путём src
        var index = image_array.in_array(src);
        
        if (index == -1) {
            return false;
        }
        
    	// получаем ссылку на объект изображения
        var lnk = eval("loadImage_" + index + ";");
        this.show_image(lnk.src, lnk.width, lnk.height);
    }

    // Формирует всплывающий блок и показывет изображение
    this.show_image = function(src, width, height)
    {
    	var left = Math.floor((getClientWidth()/2) - (width/2)) + getScrollLeft() - this.padding;
    	var top = Math.floor((getClientHeight()/2) - (height/2)) + getScrollTop() - this.padding;
        
        var id;
        
        if (!(id = document.getElementById(this.divId)))
        {
            id = document.createElement("DIV");
            id.setAttribute('id', this.divId);
            id.style.position = "absolute";
            id.style.display = "block";
            id.style.visibility = "hidden";
        	id.style.zindex = "999";
            id.style.padding = this.padding + 'px';
            id.style.border = '1px solid #333';
            id.style.backgroundColor = '#fff';
        }
    	else
        {
            id.removeChild(id.firstChild);
        }
        
    	id.style.width = width + 'px';
    	id.style.height = height + 'px';
    	id.style.top = top + 'px';
    	id.style.left = left + 'px';

        var img = document.createElement('IMG');
        img.setAttribute('src', src);
        img.setAttribute('title', 'Закрыть окно');
        
        // В IE глюки с курсорами
        if (isMozilla)
        {
            img.style.cursor = 'url(\'' + this.cursor_url + '\'), default';
        }
        
        if (isMSIE && !navigator.appVersion.match('MSIE 8.0'))
        {
            id.setAttribute('onclick', function() {popupImage_close(this.firstChild)});
            img.setAttribute('onclick', function() {popupImage_close(this)});
        }
        else
        {
            id.setAttribute('onclick', 'popupImage_close(this.firstChild)');
            img.setAttribute('onclick', 'popupImage_close(this)');
        }

        id.appendChild(img);
        document.body.appendChild(id);

        // Зпускаем фильтр blendTrans
        id.style.filter="blendTrans(duration=1)";
        // Это IE - есть поддержка этого фильтра
        if (id.filters && id.filters.blendTrans.status != 2) {
            id.filters.blendTrans.apply();
            id.style.visibility="visible";
            id.filters.blendTrans.play();
        }
        // Это не IE
        else
        {
            id.style.visibility="visible";
        }

        // Делаем затемнённым body
        var bodys = document.getElementsByTagName('body');
        bodys[0].style.filter = "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    }
}