var image = null;
var thumbnails = null;
var set_thumbnails = null;

function clearImage(){
	$('frame').hide();
}

function initThumbnailArray() {
	thumbnails = new Array();
	set_thumbnails = new Array();
}

function showThumbnail(index, url){
	var thumbnail = new Image();
	thumbnail.src = url;	
	thumbnails[index] = thumbnail;
	// console.log("show thumbnail for " + index + " with url " + url)
		
	waitForThumbnail(index);
}

function showSet(index, url) {
	if (set_thumbnails == null) {
		set_thumbnails = new Array();
	}
	
	var set_thumbnail = new Image();
	set_thumbnail.src = url;	
	set_thumbnails[index] = set_thumbnail;
		
	waitForSetThumbnail(index);
}

function showImage(url){
	$('frame_spinner').show();
	$('frame_content').update('')
	image = new Image();
	image.src = url;
	waitForImage();
}

function showImageLoaded() {
	$('frame_content').update('<img style="display:none;" id="image_in_frame" src="' + image.src + ' "/>');
	$('frame_spinner').hide();
	$('frame').show();
	Effect.Appear($('image_in_frame'), { duration: 0.1 });
	image = null;
}

function showThumbnailLoaded(index) {	
	$('photo_' + index).update('<img style="display:none;width:74.57px;" id="thumbnail_' + index + '"  src="' + thumbnails[index].src + ' "/>');
	$('photo_spinner_' + index).hide();
	Effect.Appear($('thumbnail_' + index), { duration: 0.3 });
}

function showSetThumbnailLoaded(index) {
	var setId = 'set_' + index;
	var spinner_id = 'set_spinner_' + index;
	$('set_' + index).update('<img style="display:none" id="set_thumbnail_' + index + '"  class="set_thumbnail" src="' + set_thumbnails[index].src + ' "/>');
	$('set_spinner_' + index).hide();
	Effect.Appear($('set_thumbnail_' + index), { duration: 0.3 });
}

function waitForImage() {
	if (!image.complete) {
		imgWait=setTimeout('waitForImage()', 4000);
	} else {
		showImageLoaded();
	}
}

function waitForThumbnail(index) {
	if (!thumbnails[index].complete) {
		imgWait=setTimeout('waitForThumbnail(' + index + ')', 250);
	} else {
		showThumbnailLoaded(index);
	}
}

function waitForSetThumbnail(index) {
	if (!set_thumbnails[index].complete) {
		imgWait=setTimeout('waitForSetThumbnail(' + index + ')', 250);
	} else {
		showSetThumbnailLoaded(index);
	}
}