var tmp = false;
function gallery (gallery_id, global_variable_name) {
	
	this.global_variable = global_variable_name;
	this.gallery_images = new Array();	
	this.gallery = document.getElementById(gallery_id);
	this.current_img = 0;
	this.count_img = 0;
	this.buildGallery();

	window.onscroll = setPositionGallery;
}

gallery.prototype.buildGallery = function () {

	var code_gallery = '<div id="substrate"></div>';
	code_gallery += '<div id="controlPanel">';
	code_gallery += '<span id="titlePhoto">&nbsp;</span>';
	code_gallery += '<div style="position:absolute; left:0px; margin-left:-100px; margin-top:-100px; top:45%" id="loadingImgPlace"><img src="images/big_loading.gif" id="loading_img"/></div>';
	code_gallery += '<img src="images/spacer.gif" id="loadImg"/><br/>';
	code_gallery += '<div id="substrateClose"><a href="#" onClick="return '+this.global_variable+'.Close()" class="galleryClose">Закрыть</a></div>';
	code_gallery += '<div id="substrateManadge"><a href="#" onClick="return '+this.global_variable+'.Prev()" class="galleryPrev">Предыдущий</a> &nbsp; &nbsp; ';
	code_gallery += '<a href="#" onClick="return '+this.global_variable+'.Next()" class="galleryNext">Следующий</a></div>';
	code_gallery += '</div>';

	this.gallery.innerHTML+=code_gallery;

	this.substrate = document.getElementById('substrate');
	this.control_panel = document.getElementById('controlPanel');
	this.titlePhoto = document.getElementById('titlePhoto');	
	this.load_img = document.getElementById('loadImg');
	this.loading_img = document.getElementById('loading_img');
	this.loading_img_place= document.getElementById('loadingImgPlace');
	
	for(var i in this.gallery.childNodes)
	{
		if(this.gallery.childNodes[i].nodeName=='IMG')
		{
			this.gallery_images[this.current_img] = this.gallery.childNodes[i];
			this.gallery_images[this.current_img].onclick = new Function (this.global_variable+'.viewImage('+this.current_img+')');
			this.current_img++;
		}
	}
	this.count_img = this.current_img-1;
}
	
gallery.prototype.viewImage = function (img) {

	this.substrate.style.display = 'block';
	this.control_panel.style.display = 'block';
	
	var ind = this.gallery_images[img].src.indexOf('?');
	
	tmp = new Image();
	tmp.src = this.gallery_images[img].src.slice((ind+5));
	
	this.titlePhoto.innerHTML =  this.gallery_images[img].alt;
	
	/* ----------- Показать gif загрузки ---------------*/
	if(this.load_img.src.indexOf('spacer')==-1)
	 	this.loading_img_place.style.left = '50%';

	this.loading_img.style.display = 'block';	
	this.LoadingImage();

	this.current_img = img;
	return false;
}

gallery.prototype.Next = function () {
	var next = this.current_img+1;
	if(next<=this.count_img)
		this.viewImage((this.current_img+1));
	return false;
}

gallery.prototype.Prev = function () {
	var prev = this.current_img-1;
	if(prev>=0)
		this.viewImage((this.current_img-1));
	return false;
}

gallery.prototype.Close = function () {
	this.substrate.style.display = 'none';
	this.control_panel.style.display = 'none';
	return false;
}

gallery.prototype.LoadingImage = function () {
	
	if(!tmp.complete)
	{
		window.setTimeout(this.global_variable+'.LoadingImage()', 500);
		return false;
	}
	{
		this.load_img.src = tmp.src;

		var w_img = parseInt(this.load_img.width);
		var h_img = parseInt(this.load_img.height);

		this.control_panel.style.width = w_img+'px';
		this.substrate.style.margin = '0px 0px 0px -'+(w_img/2)+'px';
		this.control_panel.style.margin = '0px 0px 0px -'+(w_img/2)+'px';
		this.substrate.style.width = (w_img+40)+'px';
		this.substrate.style.height = (h_img+80)+'px';

		this.loading_img.style.display = 'none';	

	}
	setPositionGallery();
	return false;
}


function setPositionGallery() {

	var substrate = document.getElementById('substrate');
	var controlPanel = document.getElementById('controlPanel')
	
	//oCanvas = document.getElementsByTagName((document.compatMode &&	document.compatMode == "CSS1Compat") ? "HTML" : "BODY");
	
	screenHeight = document.all?self.document.body.offsetHeight:self. innerHeight;

	var offset = (document.documentElement.clientHeight - substrate.offsetHeight)/2;
	
	var s = self.pageYOffset || (document.documentElement && document.documentElement.scrollTop) || (document.body && document.body.scrollTop);
	
	substrate.style.top = controlPanel.style.top = parseInt(s+offset)+'px';
}
