
$(document).on('click','.richtung', function() {

    var typ = $(this).data('typ');
    var val = $('#sprung').val();

    var vorz = $(this).data('vorz');

    var top_wert = $('#top_wert').val(); 
    var left_wert = $('#left_wert').val();

    var top_wert_neu = '';
    var left_wert_neu = '';

    if(vorz == 'minus'){
    	val = val - (val*2);
    }

    if(typ == 'top'){
    	top_wert_neu = parseInt(top_wert) + parseInt(val);
    	$('#top_wert').val(top_wert_neu);
    }
    else {
		top_wert_neu = top_wert;
    }

    if(typ == 'left'){
    	left_wert_neu = parseInt(left_wert) +  parseInt(val);
    	$('#left_wert').val(left_wert_neu);
    }
    else {
    	left_wert_neu = left_wert;
    }
   

	$('#master').css('top',''+ top_wert_neu + 'px'); 
	$('#master').css('left',''+ left_wert_neu + 'px');
	

});

$(document).on('keyup','.groesse', function() {

    var typ = $(this).data('typ');
    var val = $(this).val();  
	$('#master').css(''+typ+'',''+ val + 'px'); 

});

$(document).on('click','.tisch_anlegen', function() {

	jQuery.extend({
        random: function(X) {
            return Math.floor(X * (Math.random() % 1));
        },
        randomBetween: function(MinV, MaxV) {
          return MinV + jQuery.random(MaxV - MinV + 1);
        }
    });

	var new_id = $.randomBetween(10, 99);

	var top_wert = $('#top_wert').val(); 
    var left_wert = $('#left_wert').val();
    var breite = $('#breite').val(); 
    var hoehe = $('#hoehe').val();
    var tischname = $('#tischname').val();
    var bg_color = $('#bg_color').val();
    var txt_color = $('#txt_color').val();

    bg_color_db = bg_color.substr(1, bg_color.length);
    txt_color_db = txt_color.substr(1, txt_color.length);

    $("#master").clone().prop({ id: new_id }).appendTo( "#plan_vorlage" );

    $("#"+new_id).css("background-color", bg_color);
 	$("#"+new_id).css("color", txt_color);

    //var query = "INSERT INTO tische(raum,tischName,breite,hoehe,posLeft,posTop,bg_color,txt_color,bgImg) VALUES('1','" + tischname + "','" + breite + "','" + hoehe + "','" + left_wert + "','" + top_wert + "','" + bg_color_db + "','" + txt_color_db + "','0');";

    //$('.db_import').val($('.db_import').val() + query + "\n");

    $('#tischauswahl').append('<div id="t_'+new_id+'" data-id="'+new_id+'" data-name="' + tischname + '" data-w="' + breite + '" data-h="' + hoehe + '" data-y="' + top_wert + '" data-x="' + left_wert + '" data-bgcolor="' + bg_color_db + '" data-txtcolor="' + txt_color_db + '" class="tischoptionen">'+tischname+'&nbsp;&nbsp;x&nbsp;<input type="text" id="x_'+new_id+'" data-id="'+new_id+'" size="3" />&nbsp;y&nbsp;<input type="text" data-id="'+new_id+'" id="y_'+new_id+'" size="3" />&nbsp;&nbsp;<button type="button" class="tischopt" data-id="'+new_id+'">&cross;</button></div>')

    $("#x_"+new_id).val(left_wert );
 	$("#y_"+new_id).val(top_wert );
});

$(document).on('keyup','#tischname', function() {

    var name = $(this).val();
    
	$('#master').text(name); 

});


$(document).on('click','.tischopt', function() {

	var tisch = $(this).data('id');

	$('#' + tisch).remove();
	$('#t_'+ tisch).remove();
});

$(document).on('click','.display', function() {

	var typ = $(this).data('typ');
	if($(this).is(':checked')) {
		$('#' + typ ).css('display', 'inherit');
	}
	else {
		$('#' + typ).css('display', 'none');
	}

});

$(document).on('keyup','#ind_rahmen', function() {

    var ind_breite = $('.rahmen_breite').val();
	var ind_hoehe = $('.rahmen_hoehe').val();
	$('#individuell').css('width', ind_breite + 'px');
	$('#individuell').css('height', ind_hoehe + 'px');

});

$(document).on('click','.code_anzeigen', function() {

	var typ = $(this).data('sichtbar');

	if(typ == '0') {
		$('#code').css('left', '15em');
		$('.code_anzeigen').data('sichtbar','1'); 
	}
	else {
		$('#code').css('left', '-1000em');
		$('.code_anzeigen').data('sichtbar','0'); 
	}

	$('.db_import').val('');

	$(".tischoptionen").each(function(i){

        var name = $(this).data('name');
        var w = $(this).data('w');
        var h = $(this).data('h');
        var x = $(this).data('x');
        var y = $(this).data('y');
        var bgcolor = $(this).data('bgcolor');
        var txtcolor = $(this).data('txtcolor');

     	var query = "INSERT INTO tische(raum,tischName,breite,hoehe,posLeft,posTop,bg_color,txt_color,bgImg) VALUES('1','" + name + "','" + w + "','" + h + "','" + x + "','" + y + "','" + bgcolor + "','" + txtcolor + "','0');";
   		$('.db_import').val(query + $('.db_import').val() +  "\n");
    });

});

$(document).on('keyup','.tischoptionen', function() {

    var id = $(this).data('id');
	var left = $('#x_' + id).val();
	var top = $('#y_' + id).val();

	$('#' + id).css('top', top + 'px');
	$('#' + id).css('left', left + 'px');

});

$(document).on('click','.reset', function() {

	location.reload();

});

$(document).on('click','.tab_leeren', function() {

	var query = 'TRUNCATE tische;';

	if($(this).is(':checked')) {
		$('.db_import').val(query + "\n" + $('.db_import').val() );
	}
	
});
