You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

16 lines
60 KiB
JavaScript

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("rxjs"),require("rxjs/operators"),require("@angular/cdk/coercion"),require("@angular/common")):"function"==typeof define&&define.amd?define("ngx-flowchart",["exports","@angular/core","rxjs","rxjs/operators","@angular/cdk/coercion","@angular/common"],t):t((e=e||self)["ngx-flowchart"]={},e.ng.core,e.rxjs,e.rxjs.operators,e.ng.cdk.coercion,e.ng.common)}(this,(function(e,t,n,o,i,r){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */var s=function(e,t){return(s=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])})(e,t)};function d(e,t){function n(){this.constructor=e}s(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}function a(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],o=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&o>=e.length&&(e=void 0),{value:e&&e[o++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}var c=new t.InjectionToken("fc-node.component.config"),l={htmlPrefix:"fc",leftConnectorType:"leftConnector",rightConnectorType:"rightConnector",curvedStyle:"curved",lineStyle:"line",dragAnimationRepaint:"repaint",dragAnimationShadow:"shadow",canvasClass:"fc-canvas",selectedClass:"fc-selected",editClass:"fc-edit",activeClass:"fc-active",hoverClass:"fc-hover",draggingClass:"fc-dragging",edgeClass:"fc-edge",edgeLabelClass:"fc-edge-label",connectorClass:"fc-connector",magnetClass:"fc-magnet",nodeClass:"fc-node",nodeOverlayClass:"fc-node-overlay",leftConnectorClass:"fc-leftConnectors",rightConnectorClass:"fc-rightConnectors",canvasResizeThreshold:200,canvasResizeStep:200},g=function(){Error.apply(this,arguments)};Object.defineProperty(g,"prototype",new Error);var h=function(e){function t(t){var n=e.call(this)||this;return n.message=t,n}return d(t,e),t}(g);function u(e){var t,n,o,i,r={};e.nodes.forEach((function(e){r[e.id]={incoming:0,outgoing:[]}})),e.edges.forEach((function(t){var n=e.nodes.filter((function(e){return e.connectors.some((function(e){return e.id===t.source}))}))[0],o=e.nodes.filter((function(e){return e.connectors.some((function(e){return e.id===t.destination}))}))[0];r[n.id].outgoing.push(o.id),r[o.id].incoming++}));var s=[],d=[];try{for(var c=a(Object.keys(r)),l=c.next();!l.done;l=c.next()){var g=l.value;0===r[g].incoming&&d.push(g)}}catch(e){t={error:e}}finally{try{l&&!l.done&&(n=c.return)&&n.call(c)}finally{if(t)throw t.error}}for(;0!==d.length;){for(var h=d.pop(),u=0;u<r[h].outgoing.length;u++){var p=r[h].outgoing[u];r[p].incoming--,0===r[p].incoming&&d.push(p),r[h].outgoing.splice(u,1),u--}s.push(h)}var f=!1;try{for(var v=a(Object.keys(r)),m=v.next();!m.done;m=v.next()){g=m.value;0!==r[g].incoming&&(f=!0)}}catch(e){o={error:e}}finally{try{m&&!m.done&&(i=v.return)&&i.call(v)}finally{if(o)throw o.error}}return f?null:s}var p=function(){function e(e,t,i,r,s,d,a,c,l,g,h,u){var p=this;this.connectorsRectInfos={},this.nodesHtmlElements={},this.canvasHtmlElement=null,this.dragImage=null,this.svgHtmlElement=null,this.debouncer=new n.Subject,this.modelValidation=e,this.model=t,this.modelChanged=i,this.detectChangesSubject=r,this.canvasHtmlElement=h,this.svgHtmlElement=u,this.modelValidation.validateModel(this.model),this.selectedObjects=s,this.dropNode=d||function(){},this.createEdge=a||function(e,t){return n.of(Object.assign(Object.assign({},t),{label:"label"}))},this.edgeAddedCallback=c||function(){},this.nodeRemovedCallback=l||function(){},this.edgeRemovedCallback=g||function(){},this.connectors=new v(this),this.nodes=new m(this),this.edges=new y(this),this.debouncer.pipe(o.debounceTime(100)).subscribe((function(){return p.modelChanged.emit()}))}return e.prototype.notifyModelChanged=function(){this.debouncer.next()},e.prototype.detectChanges=function(){var e=this;setTimeout((function(){e.detectChangesSubject.next()}),0)},e.prototype.selectObject=function(e){this.isEditable()&&-1===this.selectedObjects.indexOf(e)&&this.selectedObjects.push(e)},e.prototype.deselectObject=function(e){if(this.isEditable()){var t=this.selectedObjects.indexOf(e);if(-1===t)throw new Error("Tried to deselect an unselected object");this.selectedObjects.splice(t,1)}},e.prototype.toggleSelectedObject=function(e){this.isSelectedObject(e)?this.deselectObject(e):this.selectObject(e)},e.prototype.isSelectedObject=function(e){return-1!==this.selectedObjects.indexOf(e)},e.prototype.selectAll=function(){var e=this;this.model.nodes.forEach((function(t){t.readonly||e.nodes.select(t)})),this.model.edges.forEach((function(t){e.edges.select(t)})),this.detectChanges()},e.prototype.deselectAll=function(){this.selectedObjects.splice(0,this.selectedObjects.length),this.detectChanges()},e.prototype.isEditObject=function(e){return 1===this.selectedObjects.length&&-1!==this.selectedObjects.indexOf(e)},e.prototype.inRectBox=function(e,t,n){return e>=n.left&&e<=n.right&&t>=n.top&&t<=n.bottom},e.prototype.getItemInfoAtPoint=function(e,t){return{node:this.getNodeAtPoint(e,t),edge:this.getEdgeAtPoint(e,t)}},e.prototype.getNodeAtPoint=function(e,t){var n,o;try{for(var i=a(this.model.nodes),r=i.next();!r.done;r=i.next()){var s=r.value,d=this.nodes.getHtmlElement(s.id).getBoundingClientRect();if(e>=d.left&&e<=d.right&&t>=d.top&&t<=d.bottom)return s}}catch(e){n={error:e}}finally{try{r&&!r.done&&(o=i.return)&&o.call(i)}finally{if(n)throw n.error}}return null},e.prototype.getEdgeAtPoint=function(e,t){var n=document.elementFromPoint(e,t).id,o=-1;return n&&(n.startsWith("fc-edge-path-")?o=Number(n.substring("fc-edge-path-".length)):n.startsWith("fc-edge-label-")&&(o=Number(n.substring("fc-edge-label-".length)))),o>-1?this.model.edges[o]:null},e.prototype.selectAllInRect=function(e){var t=this;this.model.nodes.forEach((function(n){var o=t.nodes.getHtmlElement(n.id).getBoundingClientRect();if(!n.readonly){var i=o.left+o.width/2,r=o.top+o.height/2;t.inRectBox(i,r,e)?t.nodes.select(n):t.nodes.isSelected(n)&&t.nodes.deselect(n)}}));var n=this.canvasHtmlElement.getBoundingClientRect();this.model.edges.forEach((function(o){var i=t.edges.sourceCoord(o),r=t.edges.destCoord(o),s=(i.x+r.x)/2+n.left,d=(i.y+r.y)/2+n.top;t.inRectBox(s,d,e)?t.edges.select(o):t.edges.isSelected(o)&&t.edges.deselect(o)}))},e.prototype.deleteSelected=function(){var e=this;this.edges.getSelectedEdges().forEach((function(t){e.edges.delete(t)})),this.nodes.getSelectedNodes().forEach((function(t){e.nodes.delete(t)}))},e.prototype.isEditable=function(){return void 0===this.dropTargetId},e.prototype.isDropSource=function(){return void 0!==this.dropTargetId},e.prototype.getDragImage=function(){return this.dragImage||(this.dragImage=new Image,this.dragImage.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",this.dragImage.style.visibility="hidden"),this.dragImage},e}(),f=function(){function e(e){this.modelService=e}return e.prototype.select=function(e){this.modelService.selectObject(e)},e.prototype.deselect=function(e){this.modelService.deselectObject(e)},e.prototype.toggleSelected=function(e){this.modelService.toggleSelectedObject(e)},e.prototype.isSelected=function(e){return this.modelService.isSelectedObject(e)},e.prototype.isEdit=function(e){return this.modelService.isEditObject(e)},e}(),v=function(e){function t(t){return e.call(this,t)||this}return d(t,e),t.prototype.getConnector=function(e){var t,n,o,i,r=this.modelService.model;try{for(var s=a(r.nodes),d=s.next();!d.done;d=s.next()){var c=d.value;try{for(var l=(o=void 0,a(c.connectors)),g=l.next();!g.done;g=l.next()){var h=g.value;if(h.id===e)return h}}catch(e){o={error:e}}finally{try{g&&!g.done&&(i=l.return)&&i.call(l)}finally{if(o)throw o.error}}}}catch(e){t={error:e}}finally{try{d&&!d.done&&(n=s.return)&&n.call(s)}finally{if(t)throw t.error}}},t.prototype.getConnectorRectInfo=function(e){return this.modelService.connectorsRectInfos[e]},t.prototype.setConnectorRectInfo=function(e,t){this.modelService.connectorsRectInfos[e]=t,this.modelService.detectChanges()},t.prototype._getCoords=function(e,t){var n=this.getConnectorRectInfo(e),o=this.modelService.canvasHtmlElement;if(null==n||null===o)return{x:0,y:0};var i=n.type===l.leftConnectorType?n.nodeRectInfo.left():n.nodeRectInfo.right(),r=n.nodeRectInfo.top()+n.nodeRectInfo.height()/2;return t||(i-=n.width/2,r-=n.height/2),{x:Math.round(i),y:Math.round(r)}},t.prototype.getCoords=function(e){return this._getCoords(e,!1)},t.prototype.getCenteredCoord=function(e){return this._getCoords(e,!0)},t}(f),m=function(e){function t(t){return e.call(this,t)||this}return d(t,e),t.prototype.getConnectorsByType=function(e,t){return e.connectors.filter((function(e){return e.type===t}))},t.prototype._addConnector=function(e,t){e.connectors.push(t);try{this.modelService.modelValidation.validateNode(e)}catch(n){throw e.connectors.splice(e.connectors.indexOf(t),1),n}},t.prototype.delete=function(e){this.isSelected(e)&&this.deselect(e);var t=this.modelService.model,n=t.nodes.indexOf(e);if(-1===n){if(void 0===e)throw new Error("Passed undefined");throw new Error("Tried to delete not existing node")}for(var o=this.getConnectorIds(e),i=0;i<t.edges.length;i++){var r=t.edges[i];-1===o.indexOf(r.source)&&-1===o.indexOf(r.destination)||(this.modelService.edges.delete(r),i--)}t.nodes.splice(n,1),this.modelService.notifyModelChanged(),this.modelService.nodeRemovedCallback(e)},t.prototype.getSelectedNodes=function(){var e=this;return this.modelService.model.nodes.filter((function(t){return e.modelService.nodes.isSelected(t)}))},t.prototype.handleClicked=function(e,t){t?this.modelService.nodes.toggleSelected(e):(this.modelService.deselectAll(),this.modelService.nodes.select(e))},t.prototype._addNode=function(e){var t=this.modelService.model;try{t.nodes.push(e),this.modelService.modelValidation.validateNodes(t.nodes)}catch(n){throw t.nodes.splice(t.nodes.indexOf(e),1),n}},t.prototype.getConnectorIds=function(e){return e.connectors.map((function(e){return e.id}))},t.prototype.getNodeByConnectorId=function(e){var t,n,o=this.modelService.model;try{for(var i=a(o.nodes),r=i.next();!r.done;r=i.next()){var s=r.value;if(this.getConnectorIds(s).indexOf(e)>-1)return s}}catch(e){t={error:e}}finally{try{r&&!r.done&&(n=i.return)&&n.call(i)}finally{if(t)throw t.error}}return null},t.prototype.getHtmlElement=function(e){return this.modelService.nodesHtmlElements[e]},t.prototype.setHtmlElement=function(e,t){this.modelService.nodesHtmlElements[e]=t,this.modelService.detectChanges()},t}(f),y=function(e){function t(t){return e.call(this,t)||this}return d(t,e),t.prototype.sourceCoord=function(e){return this.modelService.connectors.getCenteredCoord(e.source)},t.prototype.destCoord=function(e){return this.modelService.connectors.getCenteredCoord(e.destination)},t.prototype.delete=function(e){var t=this.modelService.model,n=t.edges.indexOf(e);if(-1===n)throw new Error("Tried to delete not existing edge");this.isSelected(e)&&this.deselect(e),t.edges.splice(n,1),this.modelService.notifyModelChanged(),this.modelService.edgeRemovedCallback(e)},t.prototype.getSelectedEdges=function(){var e=this;return this.modelService.model.edges.filter((function(t){return e.modelService.edges.isSelected(t)}))},t.prototype.handleEdgeMouseClick=function(e,t){t?this.modelService.edges.toggleSelected(e):(this.modelService.deselectAll(),this.modelService.edges.select(e))},t.prototype.putEdge=function(e){this.modelService.model.edges.push(e),this.modelService.notifyModelChanged()},t.prototype._addEdge=function(e,t,n,o){var i=this;this.modelService.modelValidation.validateConnector(t),this.modelService.modelValidation.validateConnector(n);var r={};r.source=t.id,r.destination=n.id,r.label=o;var s=this.modelService.model;this.modelService.modelValidation.validateEdges(s.edges.concat([r]),s.nodes),this.modelService.createEdge(e,r).subscribe((function(e){s.edges.push(e),i.modelService.notifyModelChanged(),i.modelService.edgeAddedCallback(e)}))},t}(f),C=function(){function e(){}return e.prototype.validateModel=function(e){return this.validateNodes(e.nodes),this._validateEdges(e.edges,e.nodes),e},e.prototype.validateNodes=function(e){var t=this,n=[];e.forEach((function(e){if(t.validateNode(e),-1!==n.indexOf(e.id))throw new h("Id not unique.");n.push(e.id)}));var o=[];return e.forEach((function(e){e.connectors.forEach((function(e){if(-1!==o.indexOf(e.id))throw new h("Id not unique.");o.push(e.id)}))})),e},e.prototype.validateNode=function(e){var t=this;if(void 0===e.id)throw new h("Id not valid.");if("string"!=typeof e.name)throw new h("Name not valid.");if("number"!=typeof e.x||e.x<0||Math.round(e.x)!==e.x)throw new h("Coordinates not valid.");if("number"!=typeof e.y||e.y<0||Math.round(e.y)!==e.y)throw new h("Coordinates not valid.");if(!Array.isArray(e.connectors))throw new h("Connectors not valid.");return e.connectors.forEach((function(e){t.validateConnector(e)})),e},e.prototype._validateEdges=function(e,t){var n=this;if(e.forEach((function(e){n._validateEdge(e,t)})),e.forEach((function(t,n){e.forEach((function(e,o){if(n!==o&&(t.source===e.source&&t.destination===e.destination||t.source===e.destination&&t.destination===e.source))throw new h("Duplicated edge.")}))})),null===u({nodes:t,edges:e}))throw new h("Graph has a circle.");return e},e.prototype.validateEdges=function(e,t){return this.validateNodes(t),this._validateEdges(e,t)},e.prototype._validateEdge=function(e,t){if(void 0===e.source)throw new h("Source not valid.");if(void 0===e.destination)throw new h("Destination not valid.");if(e.source===e.destination)throw new h("Edge with same source and destination connectors.");var n=t.filter((function(t){return t.connectors.some((function(t){return t.id===e.source}))}))[0];if(void 0===n)throw new h("Source not valid.");var o=t.filter((function(t){return t.connectors.some((function(t){return t.id===e.destination}))}))[0];if(void 0===o)throw new h("Destination not valid.");if(n===o)throw new h("Edge with same source and destination nodes.");return e},e.prototype.validateEdge=function(e,t){return this.validateNodes(t),this._validateEdge(e,t)},e.prototype.validateConnector=function(e){if(void 0===e.id)throw new h("Id not valid.");if(void 0===e.type||null===e.type||"string"!=typeof e.type)throw new h("Type not valid.");return e},e}();C.decorators=[{type:t.Injectable}],C.ctorParameters=function(){return[]};var S={dropElement:null},b=function(){function e(e,t,n,o){this.nodeDraggingScope={shadowDragStarted:!1,dropElement:null,draggedNodes:[],shadowElements:[]},this.dragOffsets=[],this.draggedElements=[],this.destinationHtmlElements=[],this.oldDisplayStyles=[],this.modelService=e,this.automaticResize=n,this.dragAnimation=o,this.applyFunction=t}return e.prototype.getCoordinate=function(e,t){return e=Math.max(e,0),e=Math.min(e,t)},e.prototype.getXCoordinate=function(e){return this.getCoordinate(e,this.modelService.canvasHtmlElement.offsetWidth)},e.prototype.getYCoordinate=function(e){return this.getCoordinate(e,this.modelService.canvasHtmlElement.offsetHeight)},e.prototype.resizeCanvas=function(e,t){if(this.automaticResize&&!this.modelService.isDropSource()){var n=this.modelService.canvasHtmlElement;n.offsetWidth<e.x+t.offsetWidth+l.canvasResizeThreshold&&(n.style.width=n.offsetWidth+l.canvasResizeStep+"px"),n.offsetHeight<e.y+t.offsetHeight+l.canvasResizeThreshold&&(n.style.height=n.offsetHeight+l.canvasResizeStep+"px")}},e.prototype.isDraggingNode=function(e){return this.nodeDraggingScope.draggedNodes.includes(e)},e.prototype.dragstart=function(e,t){var n,o,i,r;if(!t.readonly){this.dragOffsets.length=0,this.draggedElements.length=0,this.nodeDraggingScope.draggedNodes.length=0,this.nodeDraggingScope.shadowElements.length=0,this.destinationHtmlElements.length=0,this.oldDisplayStyles.length=0;var s=[],d=[];if(this.modelService.nodes.isSelected(t)){var c=this.modelService.nodes.getSelectedNodes();try{for(var g=a(c),h=g.next();!h.done;h=g.next()){var u=h.value,p=$(this.modelService.nodes.getHtmlElement(u.id));s.push(p),d.push(u)}}catch(e){n={error:e}}finally{try{h&&!h.done&&(o=g.return)&&o.call(g)}finally{if(n)throw n.error}}}else s.push($(e.target)),d.push(t);var f=[],v=[];try{for(var m=a(s),y=m.next();!y.done;y=m.next()){p=y.value;f.push(parseInt(p.css("left"),10)-e.clientX),v.push(parseInt(p.css("top"),10)-e.clientY)}}catch(e){i={error:e}}finally{try{y&&!y.done&&(r=m.return)&&r.call(m)}finally{if(i)throw i.error}}var C=e.originalEvent||e;if(this.modelService.isDropSource()){S.dropElement&&(S.dropElement.parentNode.removeChild(S.dropElement),S.dropElement=null),S.dropElement=s[0][0].cloneNode(!0);var b=$(this.modelService.canvasHtmlElement).offset();S.dropElement.offsetInfo={offsetX:Math.round(f[0]+b.left),offsetY:Math.round(v[0]+b.top)},S.dropElement.style.position="absolute",S.dropElement.style.pointerEvents="none",S.dropElement.style.zIndex="9999",document.body.appendChild(S.dropElement);var D={node:t,dropTargetId:this.modelService.dropTargetId,offsetX:Math.round(f[0]+b.left),offsetY:Math.round(v[0]+b.top)};if(C.dataTransfer.setData("text",JSON.stringify(D)),C.dataTransfer.setDragImage)C.dataTransfer.setDragImage(this.modelService.getDragImage(),0,0);else{var E=e.target,w=E.cloneNode(!0);E.parentNode.insertBefore(w,E),E.style.visibility="collapse",setTimeout((function(){E.parentNode.removeChild(w),E.style.visibility="visible"}),0)}}else{this.nodeDraggingScope.draggedNodes=d;for(var x=0;x<s.length;x++)this.draggedElements.push(s[x][0]),this.dragOffsets.push({x:f[x],y:v[x]});if(this.dragAnimation===l.dragAnimationShadow)for(x=0;x<this.draggedElements.length;x++){var k=this.dragOffsets[x],I=this.nodeDraggingScope.draggedNodes[x],O=$('<div style="position: absolute; opacity: 0.7; top: '+this.getYCoordinate(k.y+e.clientY)+"px; left: "+this.getXCoordinate(k.x+e.clientX)+'px; "><div class="innerNode"><p style="padding: 0 15px;">'+I.name+"</p> </div></div>"),R=$(this.draggedElements[x]).children()[0];O.children()[0].style.backgroundColor=R.style.backgroundColor,this.nodeDraggingScope.shadowElements.push(O),this.modelService.canvasHtmlElement.appendChild(this.nodeDraggingScope.shadowElements[x][0])}if(C.dataTransfer.setData("text","Just to support firefox"),C.dataTransfer.setDragImage)C.dataTransfer.setDragImage(this.modelService.getDragImage(),0,0);else if(this.draggedElements.forEach((function(e){var t=e.cloneNode(!0);e.parentNode.insertBefore(t,e),e.style.visibility="collapse",setTimeout((function(){e.parentNode.removeChild(t),e.style.visibility="visible"}),0)})),this.dragAnimation===l.dragAnimationShadow){for(x=0;x<this.draggedElements.length;x++)this.destinationHtmlElements.push(this.draggedElements[x]),this.oldDisplayStyles.push(this.destinationHtmlElements[x].style.display),this.destinationHtmlElements[x].style.display="none";this.nodeDraggingScope.shadowDragStarted=!0}}}},e.prototype.drop=function(e){var t=this;if(this.modelService.isDropSource())return e.preventDefault(),!1;var n=null,o=(e.originalEvent||e).dataTransfer.getData("text");if(o){var i=null;try{i=JSON.parse(o)}catch(e){}if(i&&i.dropTargetId&&this.modelService.canvasHtmlElement.id&&this.modelService.canvasHtmlElement.id===i.dropTargetId){n=i.node;var r=$(this.modelService.canvasHtmlElement).offset(),s=e.clientX-r.left,d=e.clientY-r.top;n.x=Math.round(this.getXCoordinate(i.offsetX+s)),n.y=Math.round(this.getYCoordinate(i.offsetY+d))}}return n?(this.modelService.dropNode(e,n),e.preventDefault(),!1):this.nodeDraggingScope.draggedNodes.length?this.applyFunction((function(){for(var n=0;n<t.nodeDraggingScope.draggedNodes.length;n++){var o=t.nodeDraggingScope.draggedNodes[n],i=t.dragOffsets[n];o.x=Math.round(t.getXCoordinate(i.x+e.clientX)),o.y=Math.round(t.getYCoordinate(i.y+e.clientY))}return e.preventDefault(),t.modelService.notifyModelChanged(),!1})):void 0},e.prototype.dragover=function(e){var t=this;if(S.dropElement){var n=S.dropElement.offsetInfo;return S.dropElement.style.left=n.offsetX+e.clientX+"px",S.dropElement.style.top=n.offsetY+e.clientY+"px",this.nodeDraggingScope.shadowDragStarted&&this.applyFunction((function(){t.destinationHtmlElements[0].style.display=t.oldDisplayStyles[0],t.nodeDraggingScope.shadowDragStarted=!1})),void e.preventDefault()}if(this.modelService.isDropSource())e.preventDefault();else if(this.nodeDraggingScope.draggedNodes.length){if(this.dragAnimation===l.dragAnimationRepaint){if(this.nodeDraggingScope.draggedNodes.length)return this.applyFunction((function(){for(var n=0;n<t.nodeDraggingScope.draggedNodes.length;n++){var o=t.nodeDraggingScope.draggedNodes[n],i=t.dragOffsets[n];o.x=t.getXCoordinate(i.x+e.clientX),o.y=t.getYCoordinate(i.y+e.clientY),t.resizeCanvas(o,t.draggedElements[n])}return e.preventDefault(),t.modelService.notifyModelChanged(),!1}))}else if(this.dragAnimation===l.dragAnimationShadow&&this.nodeDraggingScope.draggedNodes.length){this.nodeDraggingScope.shadowDragStarted&&this.applyFunction((function(){for(var e=0;e<t.nodeDraggingScope.draggedNodes.length;e++)t.destinationHtmlElements[e].style.display=t.oldDisplayStyles[e];t.nodeDraggingScope.shadowDragStarted=!1}));for(var o=0;o<this.nodeDraggingScope.draggedNodes.length;o++){var i=this.nodeDraggingScope.draggedNodes[o],r=this.dragOffsets[o];this.nodeDraggingScope.shadowElements[o].css("left",this.getXCoordinate(r.x+e.clientX)+"px"),this.nodeDraggingScope.shadowElements[o].css("top",this.getYCoordinate(r.y+e.clientY)+"px"),this.resizeCanvas(i,this.draggedElements[o])}e.preventDefault()}}else e.preventDefault()},e.prototype.dragend=function(e){var t=this;this.applyFunction((function(){if(S.dropElement&&(S.dropElement.parentNode.removeChild(S.dropElement),S.dropElement=null),!t.modelService.isDropSource()){if(t.nodeDraggingScope.shadowElements.length){for(var e=0;e<t.nodeDraggingScope.draggedNodes.length;e++){var n=t.nodeDraggingScope.draggedNodes[e],o=t.nodeDraggingScope.shadowElements[e];n.x=parseInt(o.css("left").replace("px",""),10),n.y=parseInt(o.css("top").replace("px",""),10),t.modelService.canvasHtmlElement.removeChild(o[0])}t.nodeDraggingScope.shadowElements.length=0,t.modelService.notifyModelChanged()}t.nodeDraggingScope.draggedNodes.length&&(t.nodeDraggingScope.draggedNodes.length=0,t.draggedElements.length=0,t.dragOffsets.length=0)}}))},e}(),D=function(){function e(){}return e.prototype.getEdgeDAttribute=function(e,t,n){var o="M "+e.x+", "+e.y+" ";if(n===l.curvedStyle){var i=this.computeEdgeSourceTangent(e,t),r=this.computeEdgeDestinationTangent(e,t);o+="C "+i.x+", "+i.y+" "+(r.x-50)+", "+r.y+" "+t.x+", "+t.y}else o+="L "+t.x+", "+t.y;return o},e.prototype.getEdgeCenter=function(e,t){return{x:(e.x+t.x)/2,y:(e.y+t.y)/2}},e.prototype.computeEdgeTangentOffset=function(e,t){return(t.y-e.y)/2},e.prototype.computeEdgeSourceTangent=function(e,t){return{x:e.x,y:e.y+this.computeEdgeTangentOffset(e,t)}},e.prototype.computeEdgeDestinationTangent=function(e,t){return{x:t.x,y:t.y-this.computeEdgeTangentOffset(e,t)}},e}();D.decorators=[{type:t.Injectable}],D.ctorParameters=function(){return[]};var E=function(){function e(e,t,n,o,i,r,s,d){this.edgeDragging={isDragging:!1,dragPoint1:null,dragPoint2:null,shadowDragStarted:!1},this.draggedEdgeSource=null,this.dragOffset={},this.destinationHtmlElement=null,this.oldDisplayStyle="",this.modelValidation=e,this.edgeDrawingService=t,this.modelService=n,this.model=o,this.isValidEdgeCallback=i||function(){return!0},this.applyFunction=r,this.dragAnimation=s,this.edgeStyle=d}return e.prototype.dragstart=function(e,t){var n,o,i,r,s,d=this;if(t.type===l.leftConnectorType){var c=function(e){if(e.destination===t.id)return i=g.modelService.connectors.getConnector(e.source),r=e.label,s=e,g.applyFunction((function(){d.modelService.edges.delete(e)})),"break"},g=this;try{for(var h=a(this.model.edges),u=h.next();!u.done;u=h.next()){if("break"===c(u.value))break}}catch(e){n={error:e}}finally{try{u&&!u.done&&(o=h.return)&&o.call(h)}finally{if(n)throw n.error}}}this.edgeDragging.isDragging=!0,void 0!==i?(this.draggedEdgeSource=i,this.edgeDragging.dragPoint1=this.modelService.connectors.getCenteredCoord(i.id),this.edgeDragging.dragLabel=r,this.edgeDragging.prevEdge=s):(this.draggedEdgeSource=t,this.edgeDragging.dragPoint1=this.modelService.connectors.getCenteredCoord(t.id));var p=this.modelService.canvasHtmlElement;if(!p)throw new Error("No canvas while edgedraggingService found.");this.dragOffset.x=-p.getBoundingClientRect().left,this.dragOffset.y=-p.getBoundingClientRect().top,this.edgeDragging.dragPoint2={x:e.clientX+this.dragOffset.x,y:e.clientY+this.dragOffset.y};var f=e.originalEvent||e;f.dataTransfer.setData("Text","Just to support firefox"),f.dataTransfer.setDragImage?f.dataTransfer.setDragImage(this.modelService.getDragImage(),0,0):(this.destinationHtmlElement=e.target,this.oldDisplayStyle=this.destinationHtmlElement.style.display,this.destinationHtmlElement.style.display="none",this.dragAnimation===l.dragAnimationShadow&&(this.edgeDragging.shadowDragStarted=!0)),this.dragAnimation===l.dragAnimationShadow&&(void 0===this.edgeDragging.gElement&&(this.edgeDragging.gElement=$(document.querySelectorAll(".shadow-svg-class")),this.edgeDragging.pathElement=$(document.querySelectorAll(".shadow-svg-class")).find("path"),this.edgeDragging.circleElement=$(document.querySelectorAll(".shadow-svg-class")).find("circle")),this.edgeDragging.gElement.css("display","block"),this.edgeDragging.pathElement.attr("d",this.edgeDrawingService.getEdgeDAttribute(this.edgeDragging.dragPoint1,this.edgeDragging.dragPoint2,this.edgeStyle)),this.edgeDragging.circleElement.attr("cx",this.edgeDragging.dragPoint2.x),this.edgeDragging.circleElement.attr("cy",this.edgeDragging.dragPoint2.y)),e.stopPropagation()},e.prototype.dragover=function(e){var t=this;if(this.edgeDragging.isDragging)if(this.edgeDragging.magnetActive||this.dragAnimation!==l.dragAnimationShadow){if(this.dragAnimation===l.dragAnimationRepaint)return this.applyFunction((function(){null!==t.destinationHtmlElement&&(t.destinationHtmlElement.style.display=t.oldDisplayStyle),t.edgeDragging.dragPoint2={x:e.clientX+t.dragOffset.x,y:e.clientY+t.dragOffset.y}}))}else null!==this.destinationHtmlElement&&(this.destinationHtmlElement.style.display=this.oldDisplayStyle),this.edgeDragging.shadowDragStarted&&this.applyFunction((function(){t.edgeDragging.shadowDragStarted=!1})),this.edgeDragging.dragPoint2={x:e.clientX+this.dragOffset.x,y:e.clientY+this.dragOffset.y},this.edgeDragging.pathElement.attr("d",this.edgeDrawingService.getEdgeDAttribute(this.edgeDragging.dragPoint1,this.edgeDragging.dragPoint2,this.edgeStyle)),this.edgeDragging.circleElement.attr("cx",this.edgeDragging.dragPoint2.x),this.edgeDragging.circleElement.attr("cy",this.edgeDragging.dragPoint2.y)},e.prototype.dragoverConnector=function(e,t){if(this.edgeDragging.isDragging){this.dragover(e);try{this.modelValidation.validateEdges(this.model.edges.concat([{source:this.draggedEdgeSource.id,destination:t.id}]),this.model.nodes)}catch(e){if(e instanceof h)return!0;throw e}if(this.isValidEdgeCallback(this.draggedEdgeSource,t))return e.preventDefault(),e.stopPropagation(),!1}},e.prototype.dragleaveMagnet=function(e){this.edgeDragging.magnetActive=!1},e.prototype.dragoverMagnet=function(e,t){var n=this;if(this.edgeDragging.isDragging){this.dragover(e);try{this.modelValidation.validateEdges(this.model.edges.concat([{source:this.draggedEdgeSource.id,destination:t.id}]),this.model.nodes)}catch(e){if(e instanceof h)return!0;throw e}if(this.isValidEdgeCallback(this.draggedEdgeSource,t)){if(this.dragAnimation===l.dragAnimationShadow)return this.edgeDragging.magnetActive=!0,this.edgeDragging.dragPoint2=this.modelService.connectors.getCenteredCoord(t.id),this.edgeDragging.pathElement.attr("d",this.edgeDrawingService.getEdgeDAttribute(this.edgeDragging.dragPoint1,this.edgeDragging.dragPoint2,this.edgeStyle)),this.edgeDragging.circleElement.attr("cx",this.edgeDragging.dragPoint2.x),this.edgeDragging.circleElement.attr("cy",this.edgeDragging.dragPoint2.y),e.preventDefault(),e.stopPropagation(),!1;if(this.dragAnimation===l.dragAnimationRepaint)return this.applyFunction((function(){return n.edgeDragging.dragPoint2=n.modelService.connectors.getCenteredCoord(t.id),e.preventDefault(),e.stopPropagation(),!1}))}}},e.prototype.dragend=function(e){var t=this;if(this.edgeDragging.isDragging&&(this.edgeDragging.isDragging=!1,this.edgeDragging.dragPoint1=null,this.edgeDragging.dragPoint2=null,this.edgeDragging.dragLabel=null,e.stopPropagation(),this.dragAnimation===l.dragAnimationShadow&&this.edgeDragging.gElement.css("display","none"),this.edgeDragging.prevEdge)){var n=this.edgeDragging.prevEdge;this.edgeDragging.prevEdge=null,this.applyFunction((function(){t.modelService.edges.putEdge(n)}))}},e.prototype.drop=function(e,t){if(this.edgeDragging.isDragging){try{this.modelValidation.validateEdges(this.model.edges.concat([{source:this.draggedEdgeSource.id,destination:t.id}]),this.model.nodes)}catch(e){if(e instanceof h)return!0;throw e}if(this.isValidEdgeCallback(this.draggedEdgeSource,t))return this.edgeDragging.prevEdge=null,this.modelService.edges._addEdge(e,this.draggedEdgeSource,t,this.edgeDragging.dragLabel),e.stopPropagation(),e.preventDefault(),!1}},e}(),w=function(){function e(e){this.mouseoverscope={connector:null,edge:null,node:null},this.applyFunction=e}return e.prototype.nodeMouseOver=function(e,t){var n=this;return this.applyFunction((function(){n.mouseoverscope.node=t}))},e.prototype.nodeMouseOut=function(e,t){var n=this;return this.applyFunction((function(){n.mouseoverscope.node=null}))},e.prototype.connectorMouseEnter=function(e,t){var n=this;return this.applyFunction((function(){n.mouseoverscope.connector=t}))},e.prototype.connectorMouseLeave=function(e,t){var n=this;return this.applyFunction((function(){n.mouseoverscope.connector=null}))},e.prototype.edgeMouseEnter=function(e,t){this.mouseoverscope.edge=t},e.prototype.edgeMouseLeave=function(e,t){this.mouseoverscope.edge=null},e}(),x=/(auto|scroll)/,k=function(e,t){return getComputedStyle(e,null).getPropertyValue(t)},I=function(e){return x.test(k(e,"overflow")+k(e,"overflow-y")+k(e,"overflow-x"))},O=function(e){return e&&e!==document.body?I(e)?e:O(e.parentNode):document.body},R=function(){function e(e,t,n){this.selectRect={x1:0,x2:0,y1:0,y2:0},this.modelService=e,this.selectElement=t,this.$canvasElement=$(this.modelService.canvasHtmlElement),this.$scrollParent=$(O(this.modelService.canvasHtmlElement)),this.applyFunction=n}return e.prototype.mousedown=function(e){if(this.modelService.isEditable()&&!e.ctrlKey&&!e.metaKey&&0===e.button&&this.selectElement.hidden){this.selectElement.hidden=!1;var t=this.$canvasElement.offset();this.selectRect.x1=Math.round(e.pageX-t.left),this.selectRect.y1=Math.round(e.pageY-t.top),this.selectRect.x2=this.selectRect.x1,this.selectRect.y2=this.selectRect.y1,this.updateSelectRect()}},e.prototype.mousemove=function(e){if(this.modelService.isEditable()&&!e.ctrlKey&&!e.metaKey&&0===e.button&&!this.selectElement.hidden){var t=this.$canvasElement.offset();this.selectRect.x2=Math.round(e.pageX-t.left),this.selectRect.y2=Math.round(e.pageY-t.top),this.updateScroll(t),this.updateSelectRect()}},e.prototype.updateScroll=function(e){var t=this.$scrollParent[0].getBoundingClientRect(),n=t.bottom-e.top,o=t.right-e.left,i=t.top-e.top,r=t.left-e.left;if(this.selectRect.y2-i<25){var s=25-(this.selectRect.y2-i),d=this.$scrollParent.scrollTop();this.$scrollParent.scrollTop(d-s)}else if(n-this.selectRect.y2<40){var a=40-(n-this.selectRect.y2);d=this.$scrollParent.scrollTop();this.$scrollParent.scrollTop(d+a)}if(this.selectRect.x2-r<25){var c=25-(this.selectRect.x2-r);d=this.$scrollParent.scrollLeft();this.$scrollParent.scrollLeft(d-c)}else if(o-this.selectRect.x2<40){var l=40-(o-this.selectRect.x2);d=this.$scrollParent.scrollLeft();this.$scrollParent.scrollLeft(d+l)}},e.prototype.mouseup=function(e){if(this.modelService.isEditable()&&!e.ctrlKey&&!e.metaKey&&0===e.button&&!this.selectElement.hidden){var t=this.selectElement.getBoundingClientRect();this.selectElement.hidden=!0,this.selectObjects(t)}},e.prototype.updateSelectRect=function(){var e=Math.min(this.selectRect.x1,this.selectRect.x2),t=Math.max(this.selectRect.x1,this.selectRect.x2),n=Math.min(this.selectRect.y1,this.selectRect.y2),o=Math.max(this.selectRect.y1,this.selectRect.y2);this.selectElement.style.left=e+"px",this.selectElement.style.top=n+"px",this.selectElement.style.width=t-e+"px",this.selectElement.style.height=o-n+"px"},e.prototype.selectObjects=function(e){var t=this;this.applyFunction((function(){t.modelService.selectAllInRect(e)}))},e}(),M=function(){function e(e,i,r,s,d,a){var c=this;this.elementRef=e,this.differs=i,this.modelValidation=r,this.edgeDrawingService=s,this.cd=d,this.zone=a,this.modelChanged=new t.EventEmitter,this.fitModelSizeByDefaultValue=!0,this.flowchartConstants=l,this.nodesDiffer=this.differs.find([]).create((function(e,t){return t})),this.edgesDiffer=this.differs.find([]).create((function(e,t){return t})),this.detectChangesSubject=new n.Subject,this.arrowDefId="arrow-"+Math.random(),this.arrowDefIdSelected=this.arrowDefId+"-selected",this.detectChangesSubject.pipe(o.debounceTime(50)).subscribe((function(){return c.cd.detectChanges()}))}return Object.defineProperty(e.prototype,"canvasClass",{get:function(){return l.canvasClass},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"fitModelSizeByDefault",{get:function(){return this.fitModelSizeByDefaultValue},set:function(e){this.fitModelSizeByDefaultValue=i.coerceBooleanProperty(e)},enumerable:!1,configurable:!0}),e.prototype.ngOnInit=function(){var e,t,n=this;if(!this.dropTargetId&&this.edgeStyle!==l.curvedStyle&&this.edgeStyle!==l.lineStyle)throw new Error("edgeStyle not supported.");this.nodeHeight=this.nodeHeight||200,this.nodeWidth=this.nodeWidth||200,this.dragAnimation=this.dragAnimation||l.dragAnimationRepaint,this.userCallbacks=this.userCallbacks||{},this.automaticResize=this.automaticResize||!1;try{for(var o=a(Object.keys(this.userCallbacks)),i=o.next();!i.done;i=o.next()){var r=i.value;if("function"!=typeof this.userCallbacks[r]&&"nodeCallbacks"!==r)throw new Error("All callbacks should be functions.")}}catch(t){e={error:t}}finally{try{i&&!i.done&&(t=o.return)&&t.call(o)}finally{if(e)throw e.error}}this.userNodeCallbacks=this.userCallbacks.nodeCallbacks;var s=$(this.elementRef.nativeElement);this.modelService=new p(this.modelValidation,this.model,this.modelChanged,this.detectChangesSubject,this.selectedObjects,this.userCallbacks.dropNode,this.userCallbacks.createEdge,this.userCallbacks.edgeAdded,this.userCallbacks.nodeRemoved,this.userCallbacks.edgeRemoved,s[0],s[0].querySelector("svg")),this.dropTargetId&&(this.modelService.dropTargetId=this.dropTargetId);var d=this.zone.run.bind(this.zone);this.nodeDraggingService=new b(this.modelService,d,this.automaticResize,this.dragAnimation),this.edgeDraggingService=new E(this.modelValidation,this.edgeDrawingService,this.modelService,this.model,this.userCallbacks.isValidEdge||null,d,this.dragAnimation,this.edgeStyle),this.mouseoverService=new w(d),this.rectangleSelectService=new R(this.modelService,s[0].querySelector("#select-rectangle"),d),this.callbacks={nodeDragstart:this.nodeDraggingService.dragstart.bind(this.nodeDraggingService),nodeDragend:this.nodeDraggingService.dragend.bind(this.nodeDraggingService),edgeDragstart:this.edgeDraggingService.dragstart.bind(this.edgeDraggingService),edgeDragend:this.edgeDraggingService.dragend.bind(this.edgeDraggingService),edgeDrop:this.edgeDraggingService.drop.bind(this.edgeDraggingService),edgeDragoverConnector:this.edgeDraggingService.dragoverConnector.bind(this.edgeDraggingService),edgeDragoverMagnet:this.edgeDraggingService.dragoverMagnet.bind(this.edgeDraggingService),edgeDragleaveMagnet:this.edgeDraggingService.dragleaveMagnet.bind(this.edgeDraggingService),nodeMouseOver:this.mouseoverService.nodeMouseOver.bind(this.mouseoverService),nodeMouseOut:this.mouseoverService.nodeMouseOut.bind(this.mouseoverService),connectorMouseEnter:this.mouseoverService.connectorMouseEnter.bind(this.mouseoverService),connectorMouseLeave:this.mouseoverService.connectorMouseLeave.bind(this.mouseoverService),nodeClicked:function(e,t){n.modelService.nodes.handleClicked(t,e.ctrlKey),e.stopPropagation(),e.preventDefault()}},this.adjustCanvasSize(this.fitModelSizeByDefault)},e.prototype.ngDoCheck=function(){if(this.model){var e=this.nodesDiffer.diff(this.model.nodes),t=this.edgesDiffer.diff(this.model.edges),n=!1,o=!1;null!==e&&(e.forEachAddedItem((function(){n=!0})),e.forEachRemovedItem((function(){n=!0}))),null!==t&&(t.forEachAddedItem((function(){o=!0})),t.forEachRemovedItem((function(){o=!0}))),n&&this.adjustCanvasSize(this.fitModelSizeByDefault),(n||o)&&this.detectChangesSubject.next()}},e.prototype.getEdgeDAttribute=function(e){return this.edgeDrawingService.getEdgeDAttribute(this.modelService.edges.sourceCoord(e),this.modelService.edges.destCoord(e),this.edgeStyle)},e.prototype.adjustCanvasSize=function(e){var t,n,o=this,i=0,r=0,s=$(this.elementRef.nativeElement);this.model.nodes.forEach((function(e){i=Math.max(e.x+o.nodeWidth,i),r=Math.max(e.y+o.nodeHeight,r)})),e?(t=i,n=r):(t=Math.max(i,s.prop("offsetWidth")),n=Math.max(r,s.prop("offsetHeight"))),s.css("width",t+"px"),s.css("height",n+"px")},e.prototype.canvasClick=function(e){},e.prototype.edgeMouseDown=function(e,t){e.stopPropagation()},e.prototype.edgeClick=function(e,t){this.modelService.edges.handleEdgeMouseClick(t,e.ctrlKey),e.stopPropagation(),e.preventDefault()},e.prototype.edgeRemove=function(e,t){this.modelService.edges.delete(t),e.stopPropagation(),e.preventDefault()},e.prototype.edgeEdit=function(e,t){this.userCallbacks.edgeEdit&&this.userCallbacks.edgeEdit(e,t)},e.prototype.edgeDoubleClick=function(e,t){this.userCallbacks.edgeDoubleClick&&this.userCallbacks.edgeDoubleClick(e,t)},e.prototype.edgeMouseOver=function(e,t){this.userCallbacks.edgeMouseOver&&this.userCallbacks.edgeMouseOver(e,t)},e.prototype.edgeMouseEnter=function(e,t){this.mouseoverService.edgeMouseEnter(e,t)},e.prototype.edgeMouseLeave=function(e,t){this.mouseoverService.edgeMouseLeave(e,t)},e.prototype.dragover=function(e){this.nodeDraggingService.dragover(e),this.edgeDraggingService.dragover(e)},e.prototype.drop=function(e){e.preventDefault&&e.preventDefault(),e.stopPropagation&&e.stopPropagation(),this.nodeDraggingService.drop(e)},e.prototype.mousedown=function(e){this.rectangleSelectService.mousedown(e)},e.prototype.mousemove=function(e){this.rectangleSelectService.mousemove(e)},e.prototype.mouseup=function(e){this.rectangleSelectService.mouseup(e)},e}();M.decorators=[{type:t.Component,args:[{selector:"fc-canvas",template:'<div (click)="canvasClick($event)" class="fc-canvas-container">\n <svg class="fc-canvas-svg">\n <defs>\n <marker class="fc-arrow-marker" [attr.id]="arrowDefId" markerWidth="5" markerHeight="5" viewBox="-6 -6 12 12" refX="10" refY="0" markerUnits="strokeWidth" orient="auto">\n <polygon points="-2,0 -5,5 5,0 -5,-5" stroke="gray" fill="gray" stroke-width="1px"/>\n </marker>\n <marker class="fc-arrow-marker-selected" [attr.id]="arrowDefIdSelected" markerWidth="5" markerHeight="5" viewBox="-6 -6 12 12" refX="10" refY="0" markerUnits="strokeWidth" orient="auto">\n <polygon points="-2,0 -5,5 5,0 -5,-5" stroke="red" fill="red" stroke-width="1px"/>\n </marker>\n </defs>\n <g *ngFor="let edge of model.edges; let $index = index">\n <path\n [attr.id]="\'fc-edge-path-\'+$index"\n (mousedown)="edgeMouseDown($event, edge)"\n (click)="edgeClick($event, edge)"\n (dblclick)="edgeDoubleClick($event, edge)"\n (mouseover)="edgeMouseOver($event, edge)"\n (mouseenter)="edgeMouseEnter($event, edge)"\n (mouseleave)="edgeMouseLeave($event, edge)"\n [attr.class]="(modelService.edges.isSelected(edge) && flowchartConstants.selectedClass + \' \' + flowchartConstants.edgeClass) ||\n edge === mouseoverService.mouseoverscope.edge && flowchartConstants.hoverClass + \' \' + flowchartConstants.edgeClass ||\n edge.active && flowchartConstants.activeClass + \' \' + flowchartConstants.edgeClass ||\n flowchartConstants.edgeClass"\n [attr.d]="getEdgeDAttribute(edge)"\n [attr.marker-end]="\'url(#\' + (modelService.edges.isSelected(edge) ? arrowDefIdSelected : arrowDefId) + \')\'">\n </path>\n </g>\n <g *ngIf="dragAnimation === flowchartConstants.dragAnimationRepaint && edgeDraggingService.edgeDragging.isDragging">\n <path [attr.class]="flowchartConstants.edgeClass + \' \' + flowchartConstants.draggingClass"\n [attr.d]="edgeDrawingService.getEdgeDAttribute(edgeDraggingService.edgeDragging.dragPoint1, edgeDraggingService.edgeDragging.dragPoint2, edgeStyle)"></path>\n <circle class="edge-endpoint" r="4"\n [attr.cx]="edgeDraggingService.edgeDragging.dragPoint2.x"\n [attr.cy]="edgeDraggingService.edgeDragging.dragPoint2.y">\n </circle>\n </g>\n <g *ngIf="dragAnimation === flowchartConstants.dragAnimationShadow"\n class="shadow-svg-class {{ flowchartConstants.edgeClass }} {{ flowchartConstants.draggingClass }}"\n style="display:none">\n <path d=""></path>\n <circle class="edge-endpoint" r="4"></circle>\n </g>\n </svg>\n <ng-container *ngFor="let node of model.nodes">\n <fc-node\n [selected]="modelService.nodes.isSelected(node)"\n [edit]="modelService.nodes.isEdit(node)"\n [underMouse]="node === mouseoverService.mouseoverscope.node"\n [node]="node"\n [mouseOverConnector]="mouseoverService.mouseoverscope.connector"\n [modelservice]="modelService"\n [dragging]="nodeDraggingService.isDraggingNode(node)"\n [callbacks]="callbacks"\n [userNodeCallbacks]="userNodeCallbacks">\n </fc-node>\n </ng-container>\n <div *ngIf="dragAnimation === flowchartConstants.dragAnimationRepaint && edgeDraggingService.edgeDragging.isDragging"\n [attr.class]="\'fc-noselect \' + flowchartConstants.edgeLabelClass"\n [ngStyle]="{\n top: (edgeDrawingService.getEdgeCenter(edgeDraggingService.edgeDragging.dragPoint1, edgeDraggingService.edgeDragging.dragPoint2).y)+\'px\',\n left: (edgeDrawingService.getEdgeCenter(edgeDraggingService.edgeDragging.dragPoint1, edgeDraggingService.edgeDragging.dragPoint2).x)+\'px\'\n }">\n <div class="fc-edge-label-text">\n <span [attr.id]="\'fc-edge-label-dragging\'" *ngIf="edgeDraggingService.edgeDragging.dragLabel">{{edgeDraggingService.edgeDragging.dragLabel}}</span>\n </div>\n </div>\n <div\n (mousedown)="edgeMouseDown($event, edge)"\n (click)="edgeClick($event, edge)"\n (dblclick)="edgeDoubleClick($event, edge)"\n (mouseover)="edgeMouseOver($event, edge)"\n (mouseenter)="edgeMouseEnter($event, edge)"\n (mouseleave)="edgeMouseLeave($event, edge)"\n [attr.class]="\'fc-noselect \' + ((modelService.edges.isEdit(edge) && flowchartConstants.editClass + \' \' + flowchartConstants.edgeLabelClass) ||\n (modelService.edges.isSelected(edge) && flowchartConstants.selectedClass + \' \' + flowchartConstants.edgeLabelClass) ||\n edge === mouseoverService.mouseoverscope.edge && flowchartConstants.hoverClass + \' \' + flowchartConstants.edgeLabelClass ||\n edge.active && flowchartConstants.activeClass + \' \' + flowchartConstants.edgeLabelClass ||\n flowchartConstants.edgeLabelClass)"\n [ngStyle]="{\n top: (edgeDrawingService.getEdgeCenter(modelService.edges.sourceCoord(edge), modelService.edges.destCoord(edge)).y)+\'px\',\n left: (edgeDrawingService.getEdgeCenter(modelService.edges.sourceCoord(edge), modelService.edges.destCoord(edge)).x)+\'px\'\n }"\n *ngFor="let edge of model.edges; let $index = index">\n <div class="fc-edge-label-text">\n <div *ngIf="modelService.isEditable()" class="fc-noselect fc-nodeedit" (click)="edgeEdit($event, edge)">\n <i class="fa fa-pencil" aria-hidden="true"></i>\n </div>\n <div *ngIf="modelService.isEditable()" class="fc-noselect fc-nodedelete" (click)="edgeRemove($event, edge)">\n &times;\n </div>\n <span [attr.id]="\'fc-edge-label-\'+$index" *ngIf="edge.label">{{edge.label}}</span>\n </div>\n </div>\n <div id="select-rectangle" class="fc-select-rectangle" hidden>\n </div>\n</div>\n',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[":host{-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;background-color:transparent;background-image:linear-gradient(90deg,rgba(0,0,0,.1) 1px,transparent 0),linear-gradient(180deg,rgba(0,0,0,.1) 1px,transparent 0);background-size:25px 25px;min-height:100%;min-width:100%;user-select:none}:host,:host .fc-canvas-container,:host .fc-canvas-container svg.fc-canvas-svg{display:block;height:100%;position:relative;width:100%}:host .fc-edge{fill:transparent;stroke:grey;stroke-width:4;transition:stroke-width .2s}:host .fc-edge.fc-hover{fill:transparent;stroke:grey;stroke-width:6}:host .fc-edge.fc-selected{fill:transparent;stroke:red;stroke-width:4}:host .fc-edge.fc-active{-webkit-animation:dash 3s linear infinite;animation:dash 3s linear infinite;stroke-dasharray:20}:host .fc-edge.fc-dragging{pointer-events:none}:host .fc-arrow-marker polygon{fill:grey;stroke:grey}:host .fc-arrow-marker-selected polygon{fill:red;stroke:red}:host .edge-endpoint{fill:grey}:host .fc-noselect{-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}:host .fc-edge-label{margin:0 auto;opacity:.8;position:absolute;transform-origin:bottom left;transition:transform .2s}:host .fc-edge-label .fc-edge-label-text{font-size:16px;position:absolute;text-align:center;transform:translate(-50%,-50%);white-space:nowrap}:host .fc-edge-label .fc-edge-label-text span{background-color:#fff;border:solid #ff3d00;border-radius:10px;color:#ff3d00;cursor:default;padding:3px 5px}:host .fc-edge-label .fc-nodeedit{right:14px;top:-30px}:host .fc-edge-label .fc-nodedelete{right:-13px;top:-30px}:host .fc-edge-label.fc-hover{transform:scale(1.25)}:host .fc-edge-label.fc-edit .fc-edge-label-text span,:host .fc-edge-label.fc-selected .fc-edge-label-text span{background-color:red;border:solid red;color:#fff;font-weight:600}:host .fc-select-rectangle{background:rgba(20,125,255,.1);border:2px dashed #5262ff;position:absolute;z-index:2}@-webkit-keyframes dash{0%{stroke-dashoffset:500}}@keyframes dash{0%{stroke-dashoffset:500}}:host ::ng-deep .fc-nodeedit{display:none;font-size:15px}:host ::ng-deep .fc-nodedelete{display:none;font-size:18px}:host ::ng-deep .fc-edit .fc-nodedelete,:host ::ng-deep .fc-edit .fc-nodeedit{background:#494949;border:2px solid #eee;border-radius:50%;color:#fff;cursor:pointer;display:block;font-weight:600;height:20px;line-height:20px;padding-top:2px;position:absolute;text-align:center;vertical-align:bottom;width:22px}:host ::ng-deep .fc-edit .fc-nodeedit{right:16px;top:-24px}:host ::ng-deep .fc-edit .fc-nodedelete{right:-13px;top:-24px}"]}]}],M.ctorParameters=function(){return[{type:t.ElementRef},{type:t.IterableDiffers},{type:C},{type:D},{type:t.ChangeDetectorRef},{type:t.NgZone}]},M.propDecorators={canvasClass:[{type:t.HostBinding,args:["attr.class"]}],model:[{type:t.Input}],selectedObjects:[{type:t.Input}],edgeStyle:[{type:t.Input}],userCallbacks:[{type:t.Input}],automaticResize:[{type:t.Input}],dragAnimation:[{type:t.Input}],nodeWidth:[{type:t.Input}],nodeHeight:[{type:t.Input}],dropTargetId:[{type:t.Input}],modelChanged:[{type:t.Output}],fitModelSizeByDefault:[{type:t.Input}],dragover:[{type:t.HostListener,args:["dragover",["$event"]]}],drop:[{type:t.HostListener,args:["drop",["$event"]]}],mousedown:[{type:t.HostListener,args:["mousedown",["$event"]]}],mousemove:[{type:t.HostListener,args:["mousemove",["$event"]]}],mouseup:[{type:t.HostListener,args:["mouseup",["$event"]]}]};var A=function(){function e(e){this.elementRef=e}return e.prototype.ngOnInit=function(){$(this.elementRef.nativeElement).addClass(l.magnetClass)},e.prototype.dragover=function(e){return this.callbacks.edgeDragoverMagnet(e,this.connector)},e.prototype.dragleave=function(e){this.callbacks.edgeDragleaveMagnet(e)},e.prototype.drop=function(e){return this.callbacks.edgeDrop(e,this.connector)},e.prototype.dragend=function(e){this.callbacks.edgeDragend(e)},e}();A.decorators=[{type:t.Directive,args:[{selector:"[fc-magnet]"}]}],A.ctorParameters=function(){return[{type:t.ElementRef}]},A.propDecorators={callbacks:[{type:t.Input}],connector:[{type:t.Input}],dragover:[{type:t.HostListener,args:["dragover",["$event"]]}],dragleave:[{type:t.HostListener,args:["dragleave",["$event"]]}],drop:[{type:t.HostListener,args:["drop",["$event"]]}],dragend:[{type:t.HostListener,args:["dragend",["$event"]]}]};var N=function(){function e(e){this.elementRef=e}return e.prototype.ngOnInit=function(){var e=$(this.elementRef.nativeElement);e.addClass(l.connectorClass),this.modelservice.isEditable()&&(e.attr("draggable","true"),this.updateConnectorClass());var t={type:this.connector.type,width:this.elementRef.nativeElement.offsetWidth,height:this.elementRef.nativeElement.offsetHeight,nodeRectInfo:this.nodeRectInfo};this.modelservice.connectors.setConnectorRectInfo(this.connector.id,t)},e.prototype.ngOnChanges=function(e){var t,n,o=!1;try{for(var i=a(Object.keys(e)),r=i.next();!r.done;r=i.next()){var s=r.value,d=e[s];d.firstChange||d.currentValue===d.previousValue||"mouseOverConnector"===s&&(o=!0)}}catch(e){t={error:e}}finally{try{r&&!r.done&&(n=i.return)&&n.call(i)}finally{if(t)throw t.error}}o&&this.modelservice.isEditable()&&this.updateConnectorClass()},e.prototype.updateConnectorClass=function(){var e=$(this.elementRef.nativeElement);this.connector===this.mouseOverConnector?e.addClass(l.hoverClass):e.removeClass(l.hoverClass)},e.prototype.dragover=function(e){},e.prototype.drop=function(e){if(this.modelservice.isEditable())return this.callbacks.edgeDrop(e,this.connector)},e.prototype.dragend=function(e){this.modelservice.isEditable()&&this.callbacks.edgeDragend(e)},e.prototype.dragstart=function(e){this.modelservice.isEditable()&&this.callbacks.edgeDragstart(e,this.connector)},e.prototype.mouseenter=function(e){this.modelservice.isEditable()&&this.callbacks.connectorMouseEnter(e,this.connector)},e.prototype.mouseleave=function(e){this.modelservice.isEditable()&&this.callbacks.connectorMouseLeave(e,this.connector)},e}();N.decorators=[{type:t.Directive,args:[{selector:"[fc-connector]"}]}],N.ctorParameters=function(){return[{type:t.ElementRef}]},N.propDecorators={callbacks:[{type:t.Input}],modelservice:[{type:t.Input}],connector:[{type:t.Input}],nodeRectInfo:[{type:t.Input}],mouseOverConnector:[{type:t.Input}],dragover:[{type:t.HostListener,args:["dragover",["$event"]]}],drop:[{type:t.HostListener,args:["drop",["$event"]]}],dragend:[{type:t.HostListener,args:["dragend",["$event"]]}],dragstart:[{type:t.HostListener,args:["dragstart",["$event"]]}],mouseenter:[{type:t.HostListener,args:["mouseenter",["$event"]]}],mouseleave:[{type:t.HostListener,args:["mouseleave",["$event"]]}]};var P=function(){function e(e,t,n){this.nodeComponentConfig=e,this.elementRef=t,this.componentFactoryResolver=n}return Object.defineProperty(e.prototype,"nodeId",{get:function(){return this.node.id},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"top",{get:function(){return this.node.y+"px"},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"left",{get:function(){return this.node.x+"px"},enumerable:!1,configurable:!0}),e.prototype.ngOnInit=function(){this.userNodeCallbacks||(this.userNodeCallbacks={}),this.userNodeCallbacks.nodeEdit=this.userNodeCallbacks.nodeEdit||function(){},this.userNodeCallbacks.doubleClick=this.userNodeCallbacks.doubleClick||function(){},this.userNodeCallbacks.mouseDown=this.userNodeCallbacks.mouseDown||function(){},this.userNodeCallbacks.mouseEnter=this.userNodeCallbacks.mouseEnter||function(){},this.userNodeCallbacks.mouseLeave=this.userNodeCallbacks.mouseLeave||function(){};var e=$(this.elementRef.nativeElement);e.addClass(l.nodeClass),this.node.readonly||e.attr("draggable","true"),this.updateNodeClass(),this.modelservice.nodes.setHtmlElement(this.node.id,e[0]),this.nodeContentContainer.clear();var t=this.componentFactoryResolver.resolveComponentFactory(this.nodeComponentConfig.nodeComponentType),n=this.nodeContentContainer.createComponent(t);this.nodeComponent=n.instance,this.nodeComponent.callbacks=this.callbacks,this.nodeComponent.userNodeCallbacks=this.userNodeCallbacks,this.nodeComponent.node=this.node,this.nodeComponent.modelservice=this.modelservice,this.updateNodeComponent(),this.nodeComponent.width=this.elementRef.nativeElement.offsetWidth,this.nodeComponent.height=this.elementRef.nativeElement.offsetHeight},e.prototype.ngAfterViewInit=function(){this.nodeComponent.width=this.elementRef.nativeElement.offsetWidth,this.nodeComponent.height=this.elementRef.nativeElement.offsetHeight},e.prototype.ngOnChanges=function(e){var t,n,o=!1;try{for(var i=a(Object.keys(e)),r=i.next();!r.done;r=i.next()){var s=r.value,d=e[s];d.firstChange||d.currentValue===d.previousValue||["selected","edit","underMouse","mouseOverConnector","dragging"].includes(s)&&(o=!0)}}catch(e){t={error:e}}finally{try{r&&!r.done&&(n=i.return)&&n.call(i)}finally{if(t)throw t.error}}o&&(this.updateNodeClass(),this.updateNodeComponent())},e.prototype.updateNodeClass=function(){var e=$(this.elementRef.nativeElement);this.toggleClass(e,l.selectedClass,this.selected),this.toggleClass(e,l.editClass,this.edit),this.toggleClass(e,l.hoverClass,this.underMouse),this.toggleClass(e,l.draggingClass,this.dragging)},e.prototype.updateNodeComponent=function(){this.nodeComponent.selected=this.selected,this.nodeComponent.edit=this.edit,this.nodeComponent.underMouse=this.underMouse,this.nodeComponent.mouseOverConnector=this.mouseOverConnector,this.nodeComponent.dragging=this.dragging},e.prototype.toggleClass=function(e,t,n){n?e.addClass(t):e.removeClass(t)},e.prototype.mousedown=function(e){e.stopPropagation()},e.prototype.dragstart=function(e){this.node.readonly||this.callbacks.nodeDragstart(e,this.node)},e.prototype.dragend=function(e){this.node.readonly||this.callbacks.nodeDragend(e)},e.prototype.click=function(e){this.node.readonly||this.callbacks.nodeClicked(e,this.node)},e.prototype.mouseover=function(e){this.node.readonly||this.callbacks.nodeMouseOver(e,this.node)},e.prototype.mouseout=function(e){this.node.readonly||this.callbacks.nodeMouseOut(e,this.node)},e}();P.decorators=[{type:t.Component,args:[{selector:"fc-node",template:"<ng-template #nodeContent></ng-template>",styles:[":host{position:absolute;z-index:1}:host.fc-dragging{z-index:10}:host ::ng-deep .fc-leftConnectors,:host ::ng-deep .fc-rightConnectors{display:flex;flex-direction:column;height:100%;position:absolute;top:0;z-index:-10}:host ::ng-deep .fc-leftConnectors .fc-magnet,:host ::ng-deep .fc-rightConnectors .fc-magnet{align-items:center}:host ::ng-deep .fc-leftConnectors{left:-20px}:host ::ng-deep .fc-rightConnectors{right:-20px}:host ::ng-deep .fc-magnet{display:flex;flex-grow:1;height:60px;justify-content:center}:host ::ng-deep .fc-connector{-moz-background-clip:padding;-webkit-background-clip:padding;background-clip:padding-box;background-color:#f7a789;border:10px solid transparent;border-radius:50% 50%;color:#fff;height:18px;pointer-events:all;width:18px}:host ::ng-deep .fc-connector.fc-hover{background-color:#000}"]}]}],P.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Inject,args:[c]}]},{type:t.ElementRef},{type:t.ComponentFactoryResolver}]},P.propDecorators={callbacks:[{type:t.Input}],userNodeCallbacks:[{type:t.Input}],node:[{type:t.Input}],selected:[{type:t.Input}],edit:[{type:t.Input}],underMouse:[{type:t.Input}],mouseOverConnector:[{type:t.Input}],modelservice:[{type:t.Input}],dragging:[{type:t.Input}],nodeId:[{type:t.HostBinding,args:["attr.id"]}],top:[{type:t.HostBinding,args:["style.top"]}],left:[{type:t.HostBinding,args:["style.left"]}],nodeContentContainer:[{type:t.ViewChild,args:["nodeContent",{read:t.ViewContainerRef,static:!0}]}],mousedown:[{type:t.HostListener,args:["mousedown",["$event"]]}],dragstart:[{type:t.HostListener,args:["dragstart",["$event"]]}],dragend:[{type:t.HostListener,args:["dragend",["$event"]]}],click:[{type:t.HostListener,args:["click",["$event"]]}],mouseover:[{type:t.HostListener,args:["mouseover",["$event"]]}],mouseout:[{type:t.HostListener,args:["mouseout",["$event"]]}]};var H=function(){function e(){var e=this;this.flowchartConstants=l,this.nodeRectInfo={top:function(){return e.node.y},left:function(){return e.node.x},bottom:function(){return e.node.y+e.height},right:function(){return e.node.x+e.width},width:function(){return e.width},height:function(){return e.height}}}return e.prototype.ngOnInit=function(){},e}();H.decorators=[{type:t.Directive}],H.propDecorators={callbacks:[{type:t.Input}],userNodeCallbacks:[{type:t.Input}],node:[{type:t.Input}],selected:[{type:t.Input}],edit:[{type:t.Input}],underMouse:[{type:t.Input}],mouseOverConnector:[{type:t.Input}],modelservice:[{type:t.Input}],dragging:[{type:t.Input}]};var j=function(e){function t(){return e.call(this)||this}return d(t,e),t}(H);j.decorators=[{type:t.Component,args:[{selector:"fc-default-node",template:'<div\n (dblclick)="userNodeCallbacks.doubleClick($event, node)">\n <div class="{{flowchartConstants.nodeOverlayClass}}"></div>\n <div class="innerNode">\n <p>{{ node.name }}</p>\n\n <div class="{{flowchartConstants.leftConnectorClass}}">\n <div fc-magnet [connector]="connector" [callbacks]="callbacks"\n *ngFor="let connector of modelservice.nodes.getConnectorsByType(node, flowchartConstants.leftConnectorType)">\n <div fc-connector [connector]="connector"\n [nodeRectInfo]="nodeRectInfo"\n [mouseOverConnector]="mouseOverConnector"\n [callbacks]="callbacks"\n [modelservice]="modelservice"></div>\n </div>\n </div>\n <div class="{{flowchartConstants.rightConnectorClass}}">\n <div fc-magnet [connector]="connector" [callbacks]="callbacks"\n *ngFor="let connector of modelservice.nodes.getConnectorsByType(node, flowchartConstants.rightConnectorType)">\n <div fc-connector [connector]="connector"\n [nodeRectInfo]="nodeRectInfo"\n [mouseOverConnector]="mouseOverConnector"\n [callbacks]="callbacks"\n [modelservice]="modelservice"></div>\n </div>\n </div>\n </div>\n <div *ngIf="modelservice.isEditable() && !node.readonly" class="fc-nodeedit" (click)="userNodeCallbacks.nodeEdit($event, node)">\n <i class="fa fa-pencil" aria-hidden="true"></i>\n </div>\n <div *ngIf="modelservice.isEditable() && !node.readonly" class="fc-nodedelete" (click)="modelservice.nodes.delete(node)">\n &times;\n </div>\n</div>\n',styles:[":host .fc-node-overlay{background-color:#000;bottom:0;left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0}:host :host-context(.fc-hover) .fc-node-overlay{opacity:.25;transition:opacity .2s}:host :host-context(.fc-selected) .fc-node-overlay{opacity:.25}:host .innerNode{align-items:center;background-color:#f15b26;border-radius:5px;color:#fff;display:flex;font-size:16px;justify-content:center;min-width:100px;pointer-events:none}:host .innerNode p{padding:0 15px;text-align:center}"]}]}],j.ctorParameters=function(){return[]};var T={nodeComponentType:j},L=function(){};L.decorators=[{type:t.NgModule,args:[{entryComponents:[j],declarations:[M,A,N,P,j],providers:[C,D,{provide:c,useValue:T}],imports:[r.CommonModule],exports:[M,A,N,j]}]}],e.DefaultFcNodeComponent=j,e.FC_NODE_COMPONENT_CONFIG=c,e.FcConnectorDirective=N,e.FcMagnetDirective=A,e.FcNodeComponent=H,e.FlowchartConstants=l,e.ModelvalidationError=h,e.NgxFlowchartComponent=M,e.NgxFlowchartModule=L,e.fcTopSort=u,e.ɵ0=T,e.ɵa=P,e.ɵb=C,e.ɵc=D,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=ngx-flowchart.umd.min.js.map