smGallery = function ()
{
	this.domAllow = false;
	this.gallery = null;
	this.ie = false;
	
	this.id = function (objId)
	{
		return this.domAllow ? document.getElementById(objId) : null;
	}
	
	this.init = function ()
	{
		if (document.getElementById)
		{
			this.domAllow = true;
		}
		if (navigator.userAgent.toLowerCase().indexOf("msie") != -1)
		{
			this.isIe = true;
		}
		this.gallery = this.id('blockgallery');
		if (this.gallery == null)
		{
			return false;
		}
		images = this.gallery.getElementsByTagName('IMG');
		for (i in images)
		{
			images[i].onclick = smShowLargeImage;
		}
	}
}

smShowLargeImage = function ()
{
	var img = new Image();
	var cy = screen.availHeight / 2;
    var cx = screen.availWidth / 2;
    
    img.onload = loadLargeImage;
	img.src = this.getAttribute('src').replace('small', 'large');
	img.alt = this.getAttribute('alt');

	if (sm.id('large_image') == null)
	{
		$('body').append('<div id="large_image"><img src="images/main_loader.gif" width="32px" height="32px" /></div>');
	}
	else
    {
		$('#large_image').text('');
		$('#large_image').append('<img src="images/main_loader.gif" width="32px" height="32px" />');
	}	
	$('#large_image').css('display', 'block').css('position', 'absolute').css('left', cx).css('top', cy).css('width', 32).css('height', 32);
}

_smShowLargeImage = function (obj)
{
	if (obj == null)
	{
		return false;
	}
	var w = obj.width + 20;
	var h = obj.height + 20;
	var cy = screen.availHeight / 2;
    var cx = screen.availWidth / 2;
    
	$('#large_image').text('');
    $('#large_image').append('<img src="' + obj.src + '" width="' + w + 'px" height="' + h + '" />');
    $('#large_image').animate({width : w, left : (cx - w/2)}, 'fast', setLargeHeight);
    $('#large_image').children('img').click(hideLargeImage);
}

setLargeHeight = function ()
{
    var h = $(this).children('img').attr('height');
    var cy = screen.availHeight / 2 - 50;
    
    $('#large_image').animate({height : h, top : (cy - h/2)}, 'fast');
}

setLargeWidth = function ()
{
    var cy = screen.availHeight / 2;
    
    $('#large_image').animate({height : 32, top : cy}, 'fast', comleteLargeHide);
}

hideLargeImage = function ()
{
    var cx = screen.availWidth / 2;
    $('#large_image').animate({width : 32, left : cx}, 'fast', setLargeWidth);
}

comleteLargeHide = function ()
{
    $('#large_image').css('display', 'none');
}

loadLargeImage = function (obj)
{
	if (obj == null)
	{
		obj = this;
	}
	_smShowLargeImage(this);
}

var sm = new smGallery();