flowy.min.js

var flowy=function(e,t,i,l,r,d,f){function a(e){r(e)}i||(i=function(){}),l||(l=function(){}),r||(r=function(){}),d||(d=20),f||(f=80),$(document).ready(function(){var r,o,n,s,p=[],c=[],h=e,v=!1,u=d,w=f,g=0,x=0,b=!1,k=!1;function m(){g=p.map(e=>e.x);var e=p.map(e=>e.width),t=g.map(function(t,i){return t-e[i]/2});if((g=Math.min.apply(Math,t))<h.offset().left){k=!0;for(var i=p.map(e=>e.id),l=0;l<p.length;l++)if($(".blockid[value="+p.filter(e=>e.id==i[l])[0].id+"]").parent().css("left",p.filter(e=>e.id==i[l])[0].x-p.filter(e=>e.id==i[l])[0].width/2-g+20),-1!=p.filter(e=>e.id==i[l])[0].parent){var r=p.filter(e=>e.id==i[l])[0];r.x-p.filter(e=>e.id==p.filter(e=>e.id==i[l])[0].parent)[0].x<0?$(".arrowid[value="+i[l]+"]").parent().css("left",r.x-g+20-5+"px"):$(".arrowid[value="+i[l]+"]").parent().css("left",p.filter(e=>e.id==p.filter(e=>e.id==i[l])[0].parent)[0].x-20-g+20+"px")}for(l=0;l<p.length;l++)p[l].x=$(".blockid[value="+p[l].id+"]").parent().offset().left+h.offset().left-$(".blockid[value="+p[l].id+"]").parent().innerWidth()/2-40;x=g}}function C(){for(var e=p.map(e=>e.parent),t=0;t<e.length;t++){-1==e[t]&&t++;for(var i=0,l=0,r=0;r<p.filter(i=>i.parent==e[t]).length;r++){var d=p.filter(i=>i.parent==e[t])[r];0==p.filter(e=>e.parent==d.id).length&&(d.childwidth=0),d.childwidth>d.width?r==p.filter(i=>i.parent==e[t]).length-1?i+=d.childwidth:i+=d.childwidth+u:r==p.filter(i=>i.parent==e[t]).length-1?i+=d.width:i+=d.width+u}-1!=e[t]&&(p.filter(i=>i.id==e[t])[0].childwidth=i);for(r=0;r<p.filter(i=>i.parent==e[t]).length;r++){d=p.filter(i=>i.parent==e[t])[r];$(".blockid[value="+d.id+"]").parent().css("top",p.filter(i=>i.id==e[t]).y+w+"px"),p.filter(i=>i.id==e[t]).y=p.filter(i=>i.id==e[t]).y+w,d.childwidth>d.width?($(".blockid[value="+d.id+"]").parent().css("left",p.filter(i=>i.id==e[t])[0].x-i/2+l+d.childwidth/2-d.width/2-h.offset().left+"px"),d.x=p.filter(i=>i.id==e[t])[0].x-i/2+l+d.childwidth/2,l+=d.childwidth+u):($(".blockid[value="+d.id+"]").parent().css("left",p.filter(i=>i.id==e[t])[0].x-i/2+l-h.offset().left+"px"),d.x=p.filter(i=>i.id==e[t])[0].x-i/2+l+d.width/2,l+=d.width+u);var f=p.filter(e=>e.id==d.id)[0],a=f.x-p.filter(e=>e.id==d.parent)[0].x+20,o=f.y-f.height/2-(p.filter(e=>e.id==d.parent)[0].y+p.filter(e=>e.id==d.parent)[0].height/2);$(".arrowid[value="+d.id+"]").parent().css("top",p.filter(e=>e.id==d.parent)[0].y+p.filter(e=>e.id==d.parent)[0].height/2-h.offset().top+"px"),a<0?($(".arrowid[value="+d.id+"]").parent().css("left",f.x-5-h.offset().left+"px"),$(".arrowid[value="+d.id+"]").parent().html('<input type="hidden" class="arrowid" value="'+d.id+'"><svg preserveaspectratio="none" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M'+(p.filter(e=>e.id==d.parent)[0].x-f.x+5)+" 0L"+(p.filter(e=>e.id==d.parent)[0].x-f.x+5)+" "+w/2+"L5 "+w/2+"L5 "+o+'" stroke="#C5CCD0" stroke-width="2px"/><path d="M0 '+(o-5)+"H10L5 "+o+"L0 "+(o-5)+'Z" fill="#C5CCD0"/></svg>')):($(".arrowid[value="+d.id+"]").parent().css("left",p.filter(e=>e.id==d.parent)[0].x-20-h.offset().left+"px"),$(".arrowid[value="+d.id+"]").parent().html('<input type="hidden" class="arrowid" value="'+d.id+'"><svg preserveaspectratio="none" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20 0L20 '+w/2+"L"+a+" "+w/2+"L"+a+" "+o+'" stroke="#C5CCD0" stroke-width="2px"/><path d="M'+(a-5)+" "+(o-5)+"H"+(a+5)+"L"+a+" "+o+"L"+(a-5)+" "+(o-5)+'Z" fill="#C5CCD0"/></svg>'))}}}h.append("<div class='indicator invisible'></div>"),flowy.output=function(){var e=[];if(p.length>0){for(var t=0;t<p.length;t++)e.push({id:p[t].id,parent:p[t].parent,data:[]}),$(".blockid[value="+p[t].id+"]").parent().children("input").each(function(){var i=$(this).attr("name"),l=$(this).val();e[t].data.push({name:i,value:l})});return e}},flowy.deleteBlocks=function(){p=[],h.html("<div class='indicator invisible'></div>")},$(document).on("mousedown",t,function(e){var t;1===e.which&&(s=$(this),0==p.length?($(this).clone().addClass("block").append("<input type='hidden' name='blockid' class='blockid' value='"+p.length+"'>").removeClass("create").appendTo("body"),$(this).addClass("dragnow"),r=$(".blockid[value="+p.length+"]").parent()):($(this).clone().addClass("block").append("<input type='hidden' name='blockid' class='blockid' value='"+(Math.max.apply(Math,p.map(e=>e.id))+1)+"'>").removeClass("create").appendTo("body"),$(this).addClass("dragnow"),r=$(".blockid[value="+(parseInt(Math.max.apply(Math,p.map(e=>e.id)))+1)+"]").parent()),t=$(this),i(t),r.addClass("dragging"),v=!0,o=e.clientX-$(this).offset().left,n=e.clientY-$(this).offset().top,r.css("left",e.clientX-o+"px"),r.css("top",e.clientY-n+"px"))}),$(document).on("mouseup",function(e){if(1===e.which&&(v||b))if(l(),$(".indicator").hasClass("invisible")||$(".indicator").addClass("invisible"),v&&(s.removeClass("dragnow"),r.removeClass("dragging")),0==parseInt(r.children(".blockid").val())&&b){r.removeClass("dragging"),b=!1;for(var t=0;t<c.length;t++)c[t].id!=parseInt(r.children(".blockid").val())&&($(".blockid[value="+c[t].id+"]").parent().css("left",$(".blockid[value="+c[t].id+"]").parent().offset().left-h.offset().left+h.scrollLeft()),$(".blockid[value="+c[t].id+"]").parent().css("top",$(".blockid[value="+c[t].id+"]").parent().offset().top-h.offset().top+h.scrollTop()),$(".arrowid[value="+c[t].id+"]").parent().css("left",$(".arrowid[value="+c[t].id+"]").parent().offset().left-h.offset().left+h.scrollLeft()),$(".arrowid[value="+c[t].id+"]").parent().css("top",$(".arrowid[value="+c[t].id+"]").parent().offset().top-h.offset().top+h.scrollTop()+"px"),$(".blockid[value="+c[t].id+"]").parent().appendTo(h),$(".arrowid[value="+c[t].id+"]").parent().appendTo(h),c[t].x=$(".blockid[value="+c[t].id+"]").parent().offset().left+$(".blockid[value="+c[t].id+"]").innerWidth()/2+h.scrollLeft(),c[t].y=$(".blockid[value="+c[t].id+"]").parent().offset().top+$(".blockid[value="+c[t].id+"]").parent().innerHeight()/2+h.scrollTop());c.filter(e=>0==e.id)[0].x=r.offset().left+r.innerWidth()/2,c.filter(e=>0==e.id)[0].y=r.offset().top+r.innerHeight()/2,p=$.merge(p,c),c=[]}else if(v&&0==p.length&&r.offset().top>h.offset().top&&r.offset().left>h.offset().left)a(r),v=!1,r.css("top",r.offset().top-h.offset().top+h.scrollTop()+"px"),r.css("left",r.offset().left-h.offset().left+h.scrollLeft()+"px"),r.appendTo(h),p.push({parent:-1,childwidth:0,id:parseInt(r.children(".blockid").val()),x:r.offset().left+r.innerWidth()/2+h.scrollLeft(),y:r.offset().top+r.innerHeight()/2+h.scrollTop(),width:r.innerWidth(),height:r.innerHeight()});else if(v&&0==p.length)r.remove();else if(v||b)for(var i=r.offset().left+r.innerWidth()/2+h.scrollLeft(),d=r.offset().top+h.scrollTop(),f=p.map(e=>e.id),o=0;o<p.length;o++){if(i>=p.filter(e=>e.id==f[o])[0].x-p.filter(e=>e.id==f[o])[0].width/2-u&&i<=p.filter(e=>e.id==f[o])[0].x+p.filter(e=>e.id==f[o])[0].width/2+u&&d>=p.filter(e=>e.id==f[o])[0].y-p.filter(e=>e.id==f[o])[0].height/2&&d<=p.filter(e=>e.id==f[o])[0].y+p.filter(e=>e.id==f[o])[0].height){v=!1,b||(a(r),r.appendTo(h));var n=0,g=0;for(t=0;t<p.filter(e=>e.parent==f[o]).length;t++){(I=p.filter(e=>e.parent==f[o])[t]).childwidth>I.width?n+=I.childwidth+u:n+=I.width+u}n+=r.innerWidth();for(t=0;t<p.filter(e=>e.parent==f[o]).length;t++){(I=p.filter(e=>e.parent==f[o])[t]).childwidth>I.width?($(".blockid[value="+I.id+"]").parent().css("left",p.filter(e=>e.id==f[o])[0].x-n/2+g+I.childwidth/2-I.width/2+"px"),I.x=p.filter(e=>e.parent==f[o])[0].x-n/2+g+I.childwidth/2,g+=I.childwidth+u):($(".blockid[value="+I.id+"]").parent().css("left",p.filter(e=>e.id==f[o])[0].x-n/2+g+"px"),I.x=p.filter(e=>e.parent==f[o])[0].x-n/2+g+I.width/2,g+=I.width+u)}if(r.css("left",p.filter(e=>e.id==f[o])[0].x-n/2+g-h.offset().left+h.scrollLeft()+"px"),r.css("top",p.filter(e=>e.id==f[o])[0].y+p.filter(e=>e.id==f[o])[0].height/2+w-h.offset().top+"px"),b){c.filter(e=>e.id==parseInt(r.children(".blockid").val()))[0].x=r.offset().left+r.innerWidth()/2+h.scrollLeft()+h.scrollLeft(),c.filter(e=>e.id==parseInt(r.children(".blockid").val()))[0].y=r.offset().top+r.innerHeight()/2+h.scrollTop(),c.filter(e=>e.id==r.children(".blockid").val())[0].parent=f[o];for(t=0;t<c.length;t++)c[t].id!=parseInt(r.children(".blockid").val())&&($(".blockid[value="+c[t].id+"]").parent().css("left",$(".blockid[value="+c[t].id+"]").parent().offset().left-h.offset().left+h.scrollLeft()),$(".blockid[value="+c[t].id+"]").parent().css("top",$(".blockid[value="+c[t].id+"]").parent().offset().top-h.offset().top+h.scrollTop()),$(".arrowid[value="+c[t].id+"]").parent().css("left",$(".arrowid[value="+c[t].id+"]").parent().offset().left-h.offset().left+h.scrollLeft()+20),$(".arrowid[value="+c[t].id+"]").parent().css("top",$(".arrowid[value="+c[t].id+"]").parent().offset().top-h.offset().top+h.scrollTop()),$(".blockid[value="+c[t].id+"]").parent().appendTo(h),$(".arrowid[value="+c[t].id+"]").parent().appendTo(h),c[t].x=$(".blockid[value="+c[t].id+"]").parent().offset().left+$(".blockid[value="+c[t].id+"]").innerWidth()/2+h.scrollLeft(),c[t].y=$(".blockid[value="+c[t].id+"]").parent().offset().top+$(".blockid[value="+c[t].id+"]").parent().innerHeight()/2+h.scrollTop());p=$.merge(p,c),c=[]}else p.push({childwidth:0,parent:f[o],id:parseInt(r.children(".blockid").val()),x:r.offset().left+r.innerWidth()/2+h.scrollLeft(),y:r.offset().top+r.innerHeight()/2+h.scrollTop(),width:r.innerWidth(),height:r.innerHeight()});var x=p.filter(e=>e.id==parseInt(r.children(".blockid").val()))[0],k=x.x-p.filter(e=>e.id==f[o])[0].x+20,L=x.y-x.height/2-(p.filter(e=>e.parent==f[o])[0].y+p.filter(e=>e.parent==f[o])[0].height/2)+h.scrollTop();if(k<0?(r.after('<div class="arrowblock"><input type="hidden" class="arrowid" value="'+r.children(".blockid").val()+'"><svg preserveaspectratio="none" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M'+(p.filter(e=>e.id==f[o])[0].x-x.x+5)+" 0L"+(p.filter(e=>e.id==f[o])[0].x-x.x+5)+" "+w/2+"L5 "+w/2+"L5 "+L+'" stroke="#C5CCD0" stroke-width="2px"/><path d="M0 '+(L-5)+"H10L5 "+L+"L0 "+(L-5)+'Z" fill="#C5CCD0"/></svg></div>'),$(".arrowid[value="+r.children(".blockid").val()+"]").parent().css("left",x.x-5-h.offset().left+h.scrollLeft()+"px")):(r.after('<div class="arrowblock"><input type="hidden" class="arrowid" value="'+r.children(".blockid").val()+'"><svg preserveaspectratio="none" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20 0L20 '+w/2+"L"+k+" "+w/2+"L"+k+" "+L+'" stroke="#C5CCD0" stroke-width="2px"/><path d="M'+(k-5)+" "+(L-5)+"H"+(k+5)+"L"+k+" "+L+"L"+(k-5)+" "+(L-5)+'Z" fill="#C5CCD0"/></svg></div>'),$(".arrowid[value="+parseInt(r.children(".blockid").val())+"]").parent().css("left",p.filter(e=>e.id==f[o])[0].x-20-h.offset().left+h.scrollLeft()+"px")),$(".arrowid[value="+parseInt(r.children(".blockid").val())+"]").parent().css("top",p.filter(e=>e.id==f[o])[0].y+p.filter(e=>e.id==f[o])[0].height/2+"px"),-1!=p.filter(e=>e.id==f[o])[0].parent){for(var y=!1,T=f[o];!y;)if(-1==p.filter(e=>e.id==T)[0].parent)y=!0;else{var H=0;for(t=0;t<p.filter(e=>e.parent==T).length;t++){var I;(I=p.filter(e=>e.parent==T)[t]).childwidth>I.width?t==p.filter(e=>e.parent==T).length-1?H+=I.childwidth:H+=I.childwidth+u:t==p.filter(e=>e.parent==T).length-1?H+=I.width:H+=I.width+u}p.filter(e=>e.id==T)[0].childwidth=H,T=p.filter(e=>e.id==T)[0].parent}p.filter(e=>e.id==T)[0].childwidth=n}b&&(b=!1,r.removeClass("dragging")),C(),m();break}o==p.length-1&&(b&&(b=!1,c=[]),v=!1,r.remove())}}),$(document).on("mousedown",".block",function(e){$(document).on("mouseup mousemove",".block",function e(t){if("mouseup"!==t.type&&1===t.which&&!v&&!b){b=!0,(r=$(this)).addClass("dragging"),o=t.clientX-$(this).offset().left,n=t.clientY-$(this).offset().top;var i=parseInt($(this).children(".blockid").val());r=$(this),c.push(p.filter(e=>e.id==i)[0]),p=$.grep(p,function(e){return e.id!=i}),$(".arrowid[value="+i+"]").parent().remove();for(var l=p.filter(e=>e.parent==i),d=!1,f=[],a=[];!d;){for(var s=0;s<l.length;s++)c.push(p.filter(e=>e.id==l[s].id)[0]),$(".blockid[value="+l[s].id+"]").parent().css("left",$(".blockid[value="+l[s].id+"]").parent().offset().left-r.offset().left),$(".blockid[value="+l[s].id+"]").parent().css("top",$(".blockid[value="+l[s].id+"]").parent().offset().top-r.offset().top),$(".arrowid[value="+l[s].id+"]").parent().css("left",$(".arrowid[value="+l[s].id+"]").parent().offset().left-r.offset().left),$(".arrowid[value="+l[s].id+"]").parent().css("top",$(".arrowid[value="+l[s].id+"]").parent().offset().top-r.offset().top),$(".blockid[value="+l[s].id+"]").parent().appendTo(r),$(".arrowid[value="+l[s].id+"]").parent().appendTo(r),f.push(l[s].id),a.push(l[s].id);0==f.length?d=!0:(l=p.filter(e=>f.includes(e.parent)),f=[])}for(s=0;s<p.filter(e=>e.parent==i).length;s++){var u=p.filter(e=>e.parent==i)[s];p=$.grep(p,function(e){return e.id!=u})}for(s=0;s<a.length;s++){u=a[s];p=$.grep(p,function(e){return e.id!=u})}p.length>1&&C(),k&&function(){if(x<h.offset().left){k=!1;for(var e=p.map(e=>e.id),t=0;t<p.length;t++)if($(".blockid[value="+p.filter(i=>i.id==e[t])[0].id+"]").parent().css("left",p.filter(i=>i.id==e[t])[0].x-p.filter(i=>i.id==e[t])[0].width/2-x-20),p.filter(i=>i.id==e[t])[0].x=$(".blockid[value="+p.filter(i=>i.id==e[t])[0].id+"]").parent().offset().left+p.filter(i=>i.id==e[t])[0].width/2,-1!=p.filter(i=>i.id==e[t])[0].parent){var i=p.filter(i=>i.id==e[t])[0],l=i.x-p.filter(i=>i.id==p.filter(i=>i.id==e[t])[0].parent)[0].x;l<0?$(".arrowid[value="+e[t]+"]").parent().css("left",i.x-5-h.offset().left+"px"):$(".arrowid[value="+e[t]+"]").parent().css("left",p.filter(i=>i.id==p.filter(i=>i.id==e[t])[0].parent)[0].x-20-h.offset().left+"px")}for(var t=0;t<p.length;t++);x=0}}()}$(document).off("mouseup mousemove",e)})}),$(document).on("mousemove",function(e){if(v?(r.css("left",e.clientX-o+"px"),r.css("top",e.clientY-n+"px")):b&&(r.css("left",e.clientX-o-h.offset().left+h.scrollLeft()+"px"),r.css("top",e.clientY-n-h.offset().top+h.scrollTop()+"px"),c.filter(e=>e.id==parseInt(r.children(".blockid").val())).x=r.offset().left+r.innerWidth()/2+h.scrollLeft(),c.filter(e=>e.id==parseInt(r.children(".blockid").val())).y=r.offset().left+r.innerHeight()/2+h.scrollTop()),v||b)for(var t=r.offset().left+r.innerWidth()/2+h.scrollLeft(),i=r.offset().top+h.scrollTop(),l=p.map(e=>e.id),d=0;d<p.length;d++){if(t>=p.filter(e=>e.id==l[d])[0].x-p.filter(e=>e.id==l[d])[0].width/2-u&&t<=p.filter(e=>e.id==l[d])[0].x+p.filter(e=>e.id==l[d])[0].width/2+u&&i>=p.filter(e=>e.id==l[d])[0].y-p.filter(e=>e.id==l[d])[0].height/2&&i<=p.filter(e=>e.id==l[d])[0].y+p.filter(e=>e.id==l[d])[0].height){$(".indicator").appendTo($(".blockid[value="+l[d]+"]").parent()),$(".indicator").css("left",$(".blockid[value="+l[d]+"]").parent().innerWidth()/2-5+"px"),$(".indicator").css("top",$(".blockid[value="+l[d]+"]").parent().innerHeight()+"px"),$(".indicator").removeClass("invisible");break}d==p.length-1&&($(".indicator").hasClass("invisible")||$(".indicator").addClass("invisible"))}})})};