7 lines
5.4 KiB
JavaScript
Vendored
7 lines
5.4 KiB
JavaScript
Vendored
//####Arg-Graph####
|
|
// a simple JQuery library to generate directional graphs.
|
|
// version 1.1, 2 Apr 2018
|
|
// by Naser Yousefi
|
|
// Website: https://github.com/n-yousefi/Arg-Graph
|
|
//################
|
|
!function(t){t.fn.ArgGraph=function(e){var r=t(this),a={dragObject:new Object,mouseObject:new Object,groupingAttr:"data-group-id",onChange:function(){},onGraphChange:function(){}},n={},i=function(t){return{x:t.offsetLeft+t.offsetWidth/2,y:t.offsetTop+t.offsetHeight/2}},o=function(e,r){var a,n,o,f=i(r),s={x1:e.x,y1:e.y,x2:f.x,y2:f.y},g=(a=r,(n=new Object).L1={x1:a.offsetLeft,y1:a.offsetTop,x2:a.offsetLeft,y2:a.offsetTop+a.offsetHeight},n.L2={x1:a.offsetLeft,y1:a.offsetTop,x2:a.offsetLeft+a.offsetWidth,y2:a.offsetTop},n.L3={x1:a.offsetLeft,y1:a.offsetTop+a.offsetHeight,x2:a.offsetLeft+a.offsetWidth,y2:a.offsetTop+a.offsetHeight},n.L4={x1:a.offsetLeft+a.offsetWidth,y1:a.offsetTop,x2:a.offsetLeft+a.offsetWidth,y2:a.offsetTop+a.offsetHeight},n);return t.each(g,function(t,e){if(!o){var r=(a=s,i=(((n=e).x2-n.x1)*(a.y1-n.y1)-(n.y2-n.y1)*(a.x1-n.x1))/((n.y2-n.y1)*(a.x2-a.x1)-(n.x2-n.x1)*(a.y2-a.y1)),f=((a.x2-a.x1)*(a.y1-n.y1)-(a.y2-a.y1)*(a.x1-n.x1))/((n.y2-n.y1)*(a.x2-a.x1)-(n.x2-n.x1)*(a.y2-a.y1)),i>=0&&i<=1&&f>=0&&f<=1?{x:a.x1+i*(a.x2-a.x1),y:a.y1+i*(a.y2-a.y1)}:null);r&&(o=r)}var a,n,i,f}),o},f=function(t,e){return"M"+t.x+","+t.y+" L"+e.x+","+e.y+" "},s=function(){var e=r.find("svg > g")[0];e&&(e.innerHTML="",t.each(items,function(r,a){var s=i(a),g=t(a);if(n.dragObject.dragging&&"C"==n.dragObject.type&&g.attr("Id")==n.dragObject.itemId&&n.mouseObject){var d='<path d="'+f(s,n.mouseObject)+'"/>';e.innerHTML+=d}var c=g.attr("data-neighbors");c&&(c=c.split(","),t.each(c,function(r,a){if(a){var n=t("#"+a)[0],i=o(s,n);if(i){var g='<path d="'+f(s,i)+'"/>';e.innerHTML+=g}}}))}))},g=function(){items=r.find(".arg-Graph_item"),items.mousedown(function(e){if(2!==e.button){e.stopPropagation(),e.preventDefault(),n.dragObject.offsetX=e.offsetX,n.dragObject.offsetY=e.offsetY;var r=t(e.target);n.dragObject.dragging||(n.dragObject.dragging=!0,n.dragObject.itemId=t(this).attr("Id"),r.is(".arg-Graph_connector-handler")?n.dragObject.type="C":n.dragObject.type="D")}return!1}).mouseover(function(e){var r=t(this);r.find(".arg-Graph_delete-item").show(),r.find(".arg-Graph_connector-handler").show()}).mouseleave(function(e){t(".arg-Graph_delete-item").hide(),t(".arg-Graph_connector-handler").hide()}).click(function(e){var r=t(this);if(t(e.target).is(".arg-Graph_delete-item")){var a=r.attr("id");t.each(items,function(e,r){var n=t(r),i=n.attr("data-neighbors");if(i){var o=i.split(",").filter(function(t){return t!==a}).join(",");o?n.attr("data-neighbors",o):n.removeAttr("data-neighbors")}}),r.remove(),p()}})},d=function(e){if((a=r.find("#"+e.id)).length<=0){var a=t('<div><span class="arg-Graph_connector-handler" style="display: none; "></span><span class="arg-Graph_delete-item" style="display: none;" ></span ></div>');r.append(a),a.attr("id",e.id),a.addClass("arg-Graph_item"),a.prepend(e.text)}a.css("left",e.position.left),a.css("top",e.position.top);var n="";t.each(e.neighbors,function(t,e){n+=e+","}),a.attr("data-neighbors",n.slice(0,-1))},c=function(){n.onChange()},p=function(){g(),s(),c(),n.onGraphChange()},h=function(){n=t.extend({},a,e),r=t(r),function(){var e=r.find("#arg-Graph_svg");if(!e||e.length<=0){var a=t('<svg id="arg-Graph_svg" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"> <defs> <marker id="arrow" viewBox="0 0 10 10" refX="3" refY="5" markerWidth="6" markerHeight="6" orient="auto"> <path d="M 0 0 L 10 5 L 0 10 z" /> </marker> </defs> <g fill="none" stroke="black" stroke-width="2" marker-end="url(#arrow)"></g> </svg>');r.prepend(a)}}(),r.mousemove(function(e){var a=t(this).offset();n.mouseObject={x:e.pageX-a.left,y:e.pageY-a.top},n.dragObject.dragging&&("D"===n.dragObject.type&&function(){if(n.dragObject.dragging&&"D"===n.dragObject.type&&n.mouseObject){var t=r.find("#"+n.dragObject.itemId);t&&(t.css("left",n.mouseObject.x-n.dragObject.offsetX+"px"),t.css("top",n.mouseObject.y-n.dragObject.offsetY+"px"),c())}}(),s()),n.dragObject.dragging&&(t(".arg-Graph_delete-item").hide(),t(".arg-Graph_connector-handler").hide())}).mouseup(function(e){e.stopPropagation(),e.preventDefault();var a=t(e.target);if(a.is(".arg-Graph_item")||(a=a.closest(".arg-Graph_item")),n.dragObject.dragging&&"C"===n.dragObject.type&&null!=a){var i=a.attr("id"),o=r.find("#"+n.dragObject.itemId);if(i!=o.attr("id")&&a.hasClass("arg-Graph_item")){var f=o.attr("data-neighbors");f?f.split(",").indexOf(i)<0&&(f+=","+i,o.attr("data-neighbors",f)):(f=a.attr("id"),o.attr("data-neighbors",f)),p()}}return n.dragObject.dragging&&(n.dragObject.dragging=!1,n.dragObject.itemId=null,n.dragObject.type=null,s()),!1}),g(),s()};return t.fn.ArgGraph.export=function(){var e=n.groupingAttr,r=[];return t.each(items,function(a,n){var i=t(n),o=i.attr("data-neighbors");o&&(o=o.split(",")),r.push({id:i.attr("id"),text:i.text().trim(),position:{left:i.css("left"),top:i.css("top")},groupType:i.attr(e),neighbors:o})}),r},t.fn.ArgGraph.exportJson=function(){var e=t.fn.ArgGraph.export();return JSON.stringify(e,null,4)},t.fn.ArgGraph.import=function(e){e instanceof Array?t.each(e,function(t,e){d(e)}):d(e),p()},t.fn.ArgGraph.importJson=function(e){var r=JSON.parse(e);t.fn.ArgGraph.import(r)},t.fn.ArgGraph.refresh=function(){h()},h(),t.fn.ArgGraph}}(jQuery); |