var loaded_images = new Array();
var curr_thumb_id = -1;
var curr_thumb_ctr = 0;
var next_id = 1;
var rotation_id = 0;

function change_thumb(vid, tid) {
	if (tid > 4) {
		tid = 0;
	}
	
	$("#vid_" + vid).attr("src", $("#vid_" + vid).attr("rel").split("|")[tid]);
	next_id = tid + 1;
}

function safe_change_thumb(vid, rid, tid) {
	if (curr_thumb_id == vid && curr_thumb_ctr == rid) {
		change_thumb(vid, tid);
		setTimeout("safe_change_thumb(" + vid + ", " + rid + ", " + next_id + ")", 600);
	}
}

function end_thumb_animation(id) {
	if (curr_thumb_id == id) {
		curr_thumb_id = -1;
	}
	
	change_thumb(id, 0);
}

function animate_thumbnail(id) {
	curr_thumb_id = id;
	
	var thumbs = $("#vid_" + id).attr("rel").split("|");
	
	// preload all images
	for (i = 0; i < thumbs.length; i++) {
		src = thumbs[i];
		if (loaded_images[src] == null) {
			img = new Image()
			img.src = src;
			loaded_images[src] = img
		}
	}
	rotation_id = ++curr_thumb_ctr;
	safe_change_thumb(id, rotation_id, 1)
}

$(document).ready(function() {
	$(".thumb img").hover(function() {
		animate_thumbnail($(this).attr("id").split("_")[1]);
	}, function() {
		end_thumb_animation($(this).attr("id").split("_")[1]);
	})
});