var sbWidth=100;var sbHeight=100;var sbGen=30;var sbMargin=4;var moo="";$(document).ready(function(){$('img').mouseenter(function(){})
$('input').change(function(){sbWidth=parseInt($('#sbWidth').val());sbHeight=parseInt($('#sbHeight').val());sbGen=parseInt($('#sbGen').val());sbMargin=parseInt($('#sbMargin').val());stammbaum();sbAnimation();})
$('#sbCalc').click(function(){if($('#stammbaum .cat').queue("fx")!='inprogress'){sbWidth=parseInt($('#sbWidth').val());sbHeight=parseInt($('#sbHeight').val());sbGen=parseInt($('#sbGen').val());sbMargin=parseInt($('#sbMargin').val());}
stammbaum();sbAnimation();})
sbAnimation();})
function sbAnimation(){if($('#stammbaum .cat').queue("fx")!='inprogress'){$('#stammbaum .example').hide();var gens=$('#stammbaum .generation').length;for(var i=gens;i>0;i--){var curgen=i-1;if(curgen>=0){var pis=$('#gen'+curgen).position();$('#gen'+curgen).css({'top':0});$('#gen'+curgen).animate({'top':pis.top},2000);$('#gen'+curgen).find('.cat').each(function(){var pos=$(this).position();console.log(pos);$(this).css({'top':0,'left':$('#gen0 .cat').css('left')});$(this).show().animate({'top':pos.top,'left':pos.left},2000,function(){$('#stammbaum .example').fadeIn();});})}}}}
function stammbaum(){if($('#stammbaum .cat').queue("fx")!='inprogress'){var gens=$('#stammbaum .generation').length;$('#stammbaum').css('height',gens*(sbHeight+sbGen)+'px');$('#stammbaum .example').attr({'height':(gens*(sbHeight+sbGen))-sbHeight,'width':Math.pow(2,gens-1)*(sbWidth)});for(var i=gens;i>0;i--){$('#debug').html($('#debug').html()+i+'<br>');var curgen=i-1;if(curgen>=0){var statleft=0;$('#gen'+curgen).find('.cat').each(function(){var curid=$(this).attr('id').substr(3);var left=0;$(this).css({'left':0,'top':0})
if($('#child'+curid).length){var posdad=$('#child'+curid+' .dad').position();var posmom=$('#child'+curid+' .mom').position();var dif=(posmom.left-posdad.left)/2;$('#debug').html($('#debug').html()+curid+': '+posmom.left+'-'+posdad.left+'-'+dif+'<br>');left=posdad.left+dif;y=curgen*(sbHeight+sbGen)+sbHeight+sbGen+sbMargin;$("canvas.example").drawLine({strokeStyle:"#000",strokeWidth:1,strokeCap:"round",strokeJoin:"round",x1:posdad.left+(sbWidth/2),y1:y,x2:posdad.left+dif+(sbWidth/2),y2:y-(sbGen+(sbMargin*2)-2),x3:posmom.left+(sbWidth/2),y3:y})}
else{left=statleft;}
$(this).css({'width':sbWidth-(2*sbMargin)+'px','height':sbHeight-(2*sbMargin)+'px','padding':sbMargin+'px','left':left+'px','top':curgen*(sbHeight+sbGen)*0+'px'})
$(this).parent().parent().css({'top':curgen*(sbHeight+sbGen)+'px'})
statleft=statleft+sbWidth;})}}}}