var tagId = 0;
var addTag = new Object();
var editTags = new Object();

function tagsInitImage(image) {
	addTag[image] = true;
	editTags[image] = false;
	}

function nl2br(str) {
	if(typeof(str)=="string") return str.replace(/(\r\n)|(\n\r)|\r|\n/g,'\\n');
	else return str;
	}
function escapeSlashes(str) {
	if(typeof(str)=="string") return str.replace(/\\/g,"\\\\");
	else return str;
	}
function escapeQuotes(str) {
	if(typeof(str)=="string") return str.replace(/"/g,"\\\"");
	else return str;
	}
function jsonSpecialChars(str) {
	 return nl2br(escapeQuotes(escapeSlashes(str)));
	}

function enableAddTags(image) {
	window.setTimeout(function() { addTag[image] = true; }, 500);
	}

function createffTag(image, x, y, label, plak, editable, id) {
	$('#'+image).append('<div class="tag" id="tag'+tagId+'" data-id="'+id+'" data-editable="'+editable+'" data-label="'+label+'" data-plak="'+plak+'"><img class="tagImg" src="i/tag.png" /></div>');
	$('#tag'+tagId).css({position:'absolute', left: parseInt(x), top: parseInt(y), marginLeft:'-30px', marginTop:'-30px' });
	if(editable) {
		$('#tag'+tagId).addClass('editable');
		$('#tag'+tagId).draggable({
			containment: '#'+image,
			drag:function() {
				disableTagAddable(image);
				},
			stop:function() {
			//	enableTagAddable(image);
				}
			});
		}
	tagId++;
	return (tagId-1);
	}


function createTag(image,x, y, label, plak, editable, id) {

	$('#image').append('<div class="tag" title="'+plak+'" id="tag'+tagId+'" data-id="'+id+'" data-editable="'+editable+'" data-label="'+label+'" data-plak="'+plak+'"><img class="tagImg" src="i/tag.png" onmouseover="showPlak('+id+');"  onmouseout="hidePlak('+id+');"/></div>');
	$('#tag'+tagId).css({position:'absolute', left: parseInt(x), top: parseInt(y), marginLeft:'-30px', marginTop:'-30px' });
	if(editable) {
		$('#tag'+tagId).addClass('editable');
		$('#tag'+tagId).draggable({
			containment: '#'+image,
			drag:function() {
				disableTagAddable(image);
				},
			stop:function() {
				enableAddTags(image);
				}
			});
		}
	tagId++;
	return (tagId-1);
	}

function loadTags(url, image) {
	$.getJSON(url,
		function(data){
		$.each(data, function(i,item){
			createTag(image, $('#'+image).width()*item.x, $('#'+image).height()*item.y, item.label, item.plak, item.editable, item.id);
			});
		$('#'+image+'.tag').draggable( "disable" );
		});
	}

function exportTags(image) {
	var exportjson = '[';
	$('#'+image+' .tag').each(function() {
		exportjson += '{ "label":"'+jsonSpecialChars($(this).attr('data-label'))+'", "plak":"'+$(this).attr('data-plak')+'", "x":'+parseInt($(this).css('left'))/$('#image').width()+', "y":'+parseInt($(this).css('top'))/$('#image').height()+', "id":'+$(this).attr('data-id')+' },';
		});
	exportjson += ']';
	return exportjson;
	}


function tagsEnableEditMode(image) {
	editTags[image] = true;
	$('#'+image+' .tag').show();
	$('#'+image+' .tag').draggable( "enable" );
	}

function tagsDisableEditMode(image) {
	editTags[image] = false;
	$('#'+image+' .tag').hide();
	$('#'+image+' .tag').draggable( "disable" );
	}

function isTagEditMode(image) {
	if(editTags[image]) return true;
	else return false;
	}
function isTagAddable(image) {
	if(addTag[image]) return true;
	else return false;
	}
function disableTagAddable(image) {
	addTag[image] = false;
	}
function enableTagAddable(image) {
	addTag[image] = false;
	}

function getTagPlaks(url, select) {
	$.getJSON(url, function(data){
		$.each(data, function(i,item){
			$('#'+select).append('<option value="'+item.plak+'">'+item.plak+'</option>')
			});
		});
	}

function showPlak(id){
	$('#'+id).fadeOut();
	$('#'+id).fadeIn();
	$('#'+id).css("text-decoration", "underline");
}
function hidePlak(id){
	$('#'+id).css("text-decoration", "none");
}

function deleteImage(url){
	var conf =  confirm('Bist Du sicher,dass Du das Bild löschen möchtest?');
		if (conf) {
	 window.location = url;
	}
	return ;
}

function deleteTag(url){

	var conf =  confirm('Bist Du sicher,dass Du den Tag löschen möchtest?');
		if (conf) {
	 	 window.location = url;
	}
	return ;
}

$(document).ready(function(){
	$("a.switch_thumb").toggle(function(){
	  $(this).addClass("swap");
	  $("ul.display").fadeOut("fast", function() {
	  	$(this).fadeIn("fast").removeClass("thumb_view");
		 });
	  }, function () {
      $(this).removeClass("swap");
	  $("ul.display").fadeOut("fast", function() {
	  	$(this).fadeIn("fast").addClass("thumb_view");
		});
	});

});