$(document).ready(function() { 
	get_tags();
});



function show_tags() {
	$('.tag_link').each(function (i, elem) {
		$(elem).fadeIn(100);
	});
}

function hide_tags() {
	$('.tag_link').each(function (i, elem) {
		$(elem).fadeOut(500);
	});
}


function get_tags() {
	$.getJSON("/photos/get_tags/" + get_photo_id(), function(data){
	          $.each(data, function(i,item){
				new_tag(item);});
			  hide_tags();});
}

function get_photo_id() {
	return $("#photo_id").val();
}

function new_tag(item) {
	$('body').after(tag_for(item)); 
	$(".tag_box").hover( function(event) { 
		show_tags();
	}, function(event) { 
		hide_tags();
	});

}

function tag_for(item) {
	return '<div class="tag_box" style="z-index:300;top:' + 
	                      (get_img_pos()[1] + item.y - 33) + 'px; left:' + (get_img_pos()[0] + item.x - 40) + 
	                      'px"><a class="tag_link" href="/photos/tag/' + item.name + '">' + item.name + '</div>';
}

function get_img_pos() {
	return get_pos($(".big_photo").get(0))
}

function get_pos(elem) {
	var left = 0, top = 0;
	
	while (elem != null) {
		top += elem.offsetTop;
		left += elem.offsetLeft;
		elem = elem.offsetParent;
	}
	
	return [left, top];
}