var img = new Image();
var baseImgPath = "/uploads/photos/";


// when the DOM is ready
$(function () {
	recreateImg();
    
    // select first element
	$("#select_photo").get(0).selectedIndex = 0;
    // load first image
    $(img).attr('src', baseImgPath + $("#select_photo").val());
})


function recreateImg() {
    $("#loader").css("background-image", 'url("/images/loader.gif")');
    $("#loader").css("background-position", "center center");
    $("#loader").css("background-repeat", "no-repeat");


	delete img;
	img = new Image();
	$(img).load(onImageLoad)
		  .error(function () {
            // When can't load images
            //alert("Error loading image");
            $("#big-picture").hide();
		   })
}

function onImageLoad() {
      	$(this).hide();
		$('#loader').append(this);
		
	    w = $(img).width();
    	h = $(img).height();

		if (w > 450) {
			h = (450/w) * h;
			w = 450;
		}

		$('#loader').width(w);
	    $('#loader').height(h);	

    	$(img).width(w);
	    $(img).height(h);	
	
		$(this).fadeIn();
}


				
function nextImage() {
	if (document.getElementById) {
		selObj = document.getElementById("select_photo");
		changeImg((selObj.selectedIndex+1) % selObj.options.length);
	}
}

function prevImage() {
	if (document.getElementById) {
		selObj = document.getElementById("select_photo");
		changeImg(selObj.selectedIndex-1 < 0 ? selObj.options.length - 1 : selObj.selectedIndex-1);
	}
}

function changeImg(index) {
	if (document.getElementById) {
		selObj = document.getElementById("select_photo");

		$(img).hide();
		recreateImg();
	
		$(img).attr('src', baseImgPath + selObj.options[index].value);
		$(img).attr("alt", "Picture of: "+selObj.options[index].text);
		$(img).attr("title", "Picture of: "+selObj.options[index].text);
	
		selObj.selectedIndex = index;
	
		lBack = document.getElementById("back");
		lNext = document.getElementById("next");
	
		/*
		alert(selObj.length);
		alert(index);
		*/
	
		if (index > 0) {
			lBack.style.display = "inline";
		}
		else {
			lBack.style.display = "none";
		}
	
		if (index == selObj.length - 1) {
			lNext.style.display = "none";
		}
		else {
			lNext.style.display = "inline";
		}
	}	
}