var w;
var h;
var loading;
var navigation;
var next;
var prev;
var clos;
var image;
var id_image;
var new_img;
var big_img
var id_image;
var opacity;
window.onload = function(){
	//initialising vars ---------------------------------------------------------------------------------------------------------------------------------------------------------------
	image = parent.document.getElementById("image");//div which consist with loading,navigation and change image
	loading = parent.document.getElementById("loading");//preload image
	navigation = parent.document.getElementById("navigation");//position div
	next = parent.document.getElementById("next");//image for button' next image'
	prev = parent.document.getElementById("prev");//image for botton prev image
	clos = parent.document.getElementById("close");//image for button close image
	new_img = parent.document.getElementById("big_img");//change image
	opacity = parent.document.getElementById("opacity");//opacity
	
}
function open_big_image(id){
	opacity.style.display = "block";
	loading.style.display = "none";
	image.style.display = "block";
	new_img.style.display = "none";
	navigation.style.display = "none";
	id_image = id;
	w = width[id_image];
	h = height[id_image];
	image.style.width = w;
	image.style.height = h;
	loading.style.display = "block";
	big_img = compatibility_prev_big[id_image];
	new_img.src = "../../images/gallery/"+big_img;
	new_img.onload = function(){
		loading.style.display = "none";
		new_img.style.display = "block";
		switch_prev_next();
		new_img.onmouseover = function(){
			navigation.style.display = "block";
			navigation.onmouseover = function(){
				navigation.style.display = "block";
				next.onmousedown = function(){
					id_image = parseInt(id_image) + 1;
					return open_big_image(id_image);
				}
				prev.onmousedown = function(){
					id_image = parseInt(id_image) - 1;
					return open_big_image(id_image);
				}
				clos.onmousedown = function(){
					opacity.style.display = "none";
					image.style.display = "none";
				}
			}
		}
		new_img.onmouseout = function(){
			navigation.style.display = "none";
		}
	}
	
}
function switch_prev_next(){
	switch(parseInt(id_image)){
		case 0:
			prev.style.display = "none";
			next.style.display = "";
			break;
		case last_number-1:
			next.style.display = "none";
			prev.style.display = "";
			break;
		default:
			prev.style.display = "";
			next.style.display = "";
			break;
		}
}