Shoobx/OrgChart.js

"use strict";function _toConsumableArray(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(exports,"__esModule",{value:!0});var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},_createClass=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),OrgChart=function(){function e(t){_classCallCheck(this,e),this._name="OrgChart",Promise.prototype.finally=function(e){var t=this.constructor;return this.then(function(n){return t.resolve(e()).then(function(){return n})},function(n){return t.resolve(e()).then(function(){throw n})})};var n=this,i={rootNodeTitle:null,nodeTitle:null,firstLine:null,secondLine:null,nodeId:"id",toggleSiblingsResp:!1,depth:999,chartClass:"",exportButton:!1,exportFilename:"OrgChart",parentNodeSymbol:"fa-users",draggable:!1,direction:"t2b",pan:!1,zoom:!1,showAvatars:!1,colors:null,borderColors:null,colored:!1,onNodeSelect:null,onShowAllClick:null},r=Object.assign(i,t),s=r.data,a=document.createElement("div"),o=document.querySelector(r.chartContainer);if(this.options=r,delete this.options.data,this.chart=a,this.chartContainer=o,a.dataset.options=JSON.stringify(r),a.setAttribute("class","orgchart"+(""!==r.chartClass?" "+r.chartClass:"")+("t2b"!==r.direction?" "+r.direction:"")),"object"===(void 0===s?"undefined":_typeof(s)))this.buildHierarchy(a,r.ajaxURL?s:this._attachRel(s,"00"),0);else if("string"==typeof s&&s.startsWith("#"))this.buildHierarchy(a,this._buildJsonDS(document.querySelector(s).children[0]),0);else{var l=document.createElement("i");l.setAttribute("class","fa fa-circle-o-notch fa-spin spinner"),a.appendChild(l),this._getJSON(s).then(function(e){n.buildHierarchy(a,r.ajaxURL?e:n._attachRel(e,"00"),0)}).catch(function(e){console.error("failed to fetch datasource for orgchart",e)}).finally(function(){var e=a.querySelector(".spinner");e.parentNode.removeChild(e)})}if(a.addEventListener("click",this._clickChart.bind(this)),r.exportButton&&!o.querySelector(".oc-export-btn")){var d=document.createElement("button"),c=document.createElement("a");d.setAttribute("class","oc-export-btn"+(""!==r.chartClass?" "+r.chartClass:"")),d.innerHTML="Export",d.addEventListener("click",this._clickExportButton.bind(this)),c.setAttribute("class","oc-download-btn"+(""!==r.chartClass?" "+r.chartClass:"")),c.setAttribute("download",r.exportFilename+".png"),o.appendChild(d),o.appendChild(c)}r.pan&&(o.style.overflow="hidden",a.addEventListener("mousedown",this._onPanStart.bind(this)),a.addEventListener("touchstart",this._onPanStart.bind(this)),document.body.addEventListener("mouseup",this._onPanEnd.bind(this)),document.body.addEventListener("touchend",this._onPanEnd.bind(this))),r.zoom&&(o.addEventListener("wheel",this._onWheeling.bind(this)),o.addEventListener("touchstart",this._onTouchStart.bind(this)),document.body.addEventListener("touchmove",this._onTouchMove.bind(this)),document.body.addEventListener("touchend",this._onTouchEnd.bind(this))),r.colored&&a.classList.add("colored"),this.addZoomControls(o),o.appendChild(a)}return _createClass(e,[{key:"toggleColors",value:function(){this.chart.classList.toggle("colored")}},{key:"addZoomControls",value:function(e){var t=this,n=document.createElement("div");n.classList.add("zoom-container");var i=document.createElement("div");i.classList.add("zoom-in"),i.innerHTML='<i class="fa fa-search-plus" aria-hidden="true"></i>',i.addEventListener("click",function(){return t._setChartScale(t.chart,!0)}),n.appendChild(i);var r=document.createElement("div");r.classList.add("zoom-out"),r.innerHTML='<i class="fa fa-search-minus" aria-hidden="true"></i>',r.addEventListener("click",function(){return t._setChartScale(t.chart,!1)}),n.appendChild(r),e.appendChild(n)}},{key:"_closest",value:function(e,t){return e&&(t(e)&&e!==this.chart?e:this._closest(e.parentNode,t))}},{key:"_siblings",value:function(e,t){return Array.from(e.parentNode.children).filter(function(n){return n!==e&&(!t||e.matches(t))})}},{key:"_prevAll",value:function(e,t){for(var n=[],i=e.previousElementSibling;i;)t&&!i.matches(t)||n.push(i),i=i.previousElementSibling;return n}},{key:"_nextAll",value:function(e,t){for(var n=[],i=e.nextElementSibling;i;)t&&!i.matches(t)||n.push(i),i=i.nextElementSibling;return n}},{key:"_isVisible",value:function(e){return null!==e.offsetParent}},{key:"_addClass",value:function(e,t){e.forEach(function(e){t.indexOf(" ")>0?t.split(" ").forEach(function(t){return e.classList.add(t)}):e.classList.add(t)})}},{key:"_removeClass",value:function(e,t){e.forEach(function(e){t.indexOf(" ")>0?t.split(" ").forEach(function(t){return e.classList.remove(t)}):e.classList.remove(t)})}},{key:"_css",value:function(e,t,n){e.forEach(function(e){e.style[t]=n})}},{key:"_removeAttr",value:function(e,t){e.forEach(function(e){e.removeAttribute(t)})}},{key:"_one",value:function(e,t,n,i){var r=function r(s){try{n.call(i,s)}finally{e.removeEventListener(t,r)}};e.addEventListener(t,r)}},{key:"_getDescElements",value:function(e,t){var n=[];return e.forEach(function(e){return n.push.apply(n,_toConsumableArray(e.querySelectorAll(t)))}),n}},{key:"_getJSON",value:function(e){return new Promise(function(t,n){function i(){4===this.readyState&&(200===this.status?t(JSON.parse(this.response)):n(new Error(this.statusText)))}var r=new XMLHttpRequest;r.open("GET",e),r.onreadystatechange=i,r.responseType="json",r.setRequestHeader("Content-Type","application/json"),r.send()})}},{key:"_buildJsonDS",value:function(e){var t=this,n={name:e.firstChild.textContent.trim(),relationship:("LI"===e.parentNode.parentNode.nodeName?"1":"0")+(e.parentNode.children.length>1?1:0)+(e.children.length?1:0)};return e.id&&(n.id=e.id),e.querySelector("ul")&&Array.from(e.querySelector("ul").children).forEach(function(e){n.children||(n.children=[]),n.children.push(t._buildJsonDS(e))}),n}},{key:"_attachRel",value:function(e,t){if(e.relationship=t+(e.children&&e.children.length>0?1:0),e.children){var n=!0,i=!1,r=void 0;try{for(var s,a=e.children[Symbol.iterator]();!(n=(s=a.next()).done);n=!0){var o=s.value;this._attachRel(o,"1"+(e.children.length>1?1:0))}}catch(e){i=!0,r=e}finally{try{!n&&a.return&&a.return()}finally{if(i)throw r}}}return e}},{key:"_repaint",value:function(e){e&&(e.style.offsetWidth=e.offsetWidth)}},{key:"_isInAction",value:function(e){return e.querySelector("* > .edge").className.indexOf("fa-")>-1}},{key:"_getNodeState",value:function(e,t){var n=this,i=void 0,r={exist:!1,visible:!1};return"parent"===t?(i=this._closest(e,function(e){return e.classList&&e.classList.contains("nodes")}),i&&(r.exist=!0),r.exist&&this._isVisible(i.parentNode.children[0])&&(r.visible=!0)):"children"===t?(i=this._closest(e,function(e){return"TR"===e.nodeName}).nextElementSibling,i&&(r.exist=!0),r.exist&&this._isVisible(i)&&(r.visible=!0)):"siblings"===t&&(i=this._siblings(this._closest(e,function(e){return"TABLE"===e.nodeName}).parentNode),i.length&&(r.exist=!0),r.exist&&i.some(function(e){return n._isVisible(e)})&&(r.visible=!0)),r}},{key:"getRelatedNodes",value:function(e,t){return"parent"===t?this._closest(e,function(e){return e.classList.contains("nodes")}).parentNode.children[0].querySelector(".node"):"children"===t?Array.from(this._closest(e,function(e){return"TABLE"===e.nodeName}).lastChild.children).map(function(e){return e.querySelector(".node")}):"siblings"===t?this._siblings(this._closest(e,function(e){return"TABLE"===e.nodeName}).parentNode).map(function(e){return e.querySelector(".node")}):[]}},{key:"_switchHorizontalArrow",value:function(e){var t=this.options,n=e.querySelector(".leftEdge"),i=e.querySelector(".rightEdge"),r=this._closest(e,function(e){return"TABLE"===e.nodeName}).parentNode;if(t.toggleSiblingsResp&&(void 0===t.ajaxURL||this._closest(e,function(e){return e.classList.contains(".nodes")}).dataset.siblingsLoaded)){var s=r.previousElementSibling,a=r.nextElementSibling;s&&(s.classList.contains("hidden")?(n.classList.add("fa-chevron-left"),n.classList.remove("fa-chevron-right")):(n.classList.add("fa-chevron-right"),n.classList.remove("fa-chevron-left"))),a&&(a.classList.contains("hidden")?(i.classList.add("fa-chevron-right"),i.classList.remove("fa-chevron-left")):(i.classList.add("fa-chevron-left"),i.classList.remove("fa-chevron-right")))}else{var o=this._siblings(r),l=!!o.length&&!o.some(function(e){return e.classList.contains("hidden")});n.classList.toggle("fa-chevron-right",l),n.classList.toggle("fa-chevron-left",!l),i.classList.toggle("fa-chevron-left",l),i.classList.toggle("fa-chevron-right",!l)}}},{key:"_clickNode",value:function(e){this.options.onNodeSelect&&this.options.onNodeSelect(JSON.parse(e.currentTarget.dataset.source))}},{key:"_buildParentNode",value:function(e,t,n){var i=this,r=document.createElement("table");t.relationship=t.relationship||"001",this._createNode(t,0).then(function(e){var t=i.chart;e.classList.remove("slide-up"),e.classList.add("slide-down");var s=document.createElement("tr"),a=document.createElement("tr"),o=document.createElement("tr"),l=document.createElement("tr");s.setAttribute("class","hidden"),s.innerHTML='<td colspan="2"></td>',r.appendChild(s),a.setAttribute("class","lines hidden"),a.innerHTML='<td colspan="2"><div class="downLine"></div></td>',r.appendChild(a),o.setAttribute("class","lines hidden"),o.innerHTML='<td class="rightLine">&nbsp;</td><td class="leftLine">&nbsp;</td>',r.appendChild(o),l.setAttribute("class","nodes"),l.innerHTML='<td colspan="2"></td>',r.appendChild(l),r.querySelector("td").appendChild(e),t.insertBefore(r,t.children[0]),r.children[3].children[0].appendChild(t.lastChild),n()}).catch(function(e){console.error("Failed to create parent node",e)})}},{key:"_switchVerticalArrow",value:function(e){e.classList.toggle("fa-minus-square"),e.classList.toggle("fa-plus-square")}},{key:"showParent",value:function(e){var t=this._prevAll(this._closest(e,function(e){return e.classList.contains("nodes")}));this._removeClass(t,"hidden"),this._addClass(Array(t[0].children).slice(1,-1),"hidden");var n=t[2].querySelector(".node");this._one(n,"transitionend",function(){n.classList.remove("slide"),this._isInAction(e)&&this._switchVerticalArrow(e.querySelector(":scope > .topEdge"))},this),this._repaint(n),n.classList.add("slide"),n.classList.remove("slide-down")}},{key:"showSiblings",value:function(e,t){var n=this,i=[],r=this._closest(e,function(e){return"TABLE"===e.nodeName}).parentNode;i=t?"left"===t?this._prevAll(r):this._nextAll(r):this._siblings(r),this._removeClass(i,"hidden");var s=this._prevAll(this._closest(e,function(e){return e.classList.contains("nodes")}));if(r=Array.from(s[0].querySelectorAll(":scope > .hidden")),t?this._removeClass(r.slice(0,2*i.length),"hidden"):this._removeClass(r,"hidden"),!this._getNodeState(e,"parent").visible){this._removeClass(s,"hidden");var a=s[2].querySelector(".node");this._one(a,"transitionend",function(e){e.target.classList.remove("slide")},this),this._repaint(a),a.classList.add("slide"),a.classList.remove("slide-down")}i.forEach(function(e){Array.from(e.querySelectorAll(".node")).forEach(function(e){n._isVisible(e)&&(e.classList.add("slide"),e.classList.remove("slide-left","slide-right"))})}),this._one(i[0].querySelector(".slide"),"transitionend",function(){var t=this;i.forEach(function(e){t._removeClass(Array.from(e.querySelectorAll(".slide")),"slide")}),this._isInAction(e)&&(this._switchHorizontalArrow(e),e.querySelector(".bottomEdge").classList.remove("fa-plus-square"),e.querySelector(".bottomEdge").classList.add("fa-minus-square"))},this)}},{key:"hideSiblings",value:function(e,t){var n=this,i=this._closest(e,function(e){return"TABLE"===e.nodeName}).parentNode;(this._siblings(i).forEach(function(e){e.querySelector(".spinner")&&(n.chart.dataset.inAjax=!1)}),!t||t&&"left"===t)&&this._prevAll(i).forEach(function(e){Array.from(e.querySelectorAll(".node")).forEach(function(e){n._isVisible(e)&&e.classList.add("slide","slide-right")})});if(!t||t&&"left"!==t){this._nextAll(i).forEach(function(e){Array.from(e.querySelectorAll(".node")).forEach(function(e){n._isVisible(e)&&e.classList.add("slide","slide-left")})})}var r=[];this._siblings(i).forEach(function(e){Array.prototype.push.apply(r,Array.from(e.querySelectorAll(".slide")))});var s=[],a=!0,o=!1,l=void 0;try{for(var d,c=r[Symbol.iterator]();!(a=(d=c.next()).done);a=!0){var h=d.value,u=this._closest(h,function(e){return e.classList.contains("nodes")}).previousElementSibling;s.push(u),s.push(u.previousElementSibling)}}catch(e){o=!0,l=e}finally{try{!a&&c.return&&c.return()}finally{if(o)throw l}}s=[].concat(_toConsumableArray(new Set(s))),s.forEach(function(e){e.style.visibility="hidden"}),this._one(r[0],"transitionend",function(n){var a=this;s.forEach(function(e){e.removeAttribute("style")});var o=[];o=t?"left"===t?this._prevAll(i,":not(.hidden)"):this._nextAll(i,":not(.hidden)"):this._siblings(i);var l=Array.from(this._closest(i,function(e){return e.classList.contains("nodes")}).previousElementSibling.querySelectorAll(":scope > :not(.hidden)")),d=l.slice(1,t?2*o.length+1:-1);this._addClass(d,"hidden"),this._removeClass(r,"slide"),o.forEach(function(e){Array.from(e.querySelectorAll(".node")).slice(1).forEach(function(e){a._isVisible(e)&&(e.classList.remove("slide-left","slide-right"),e.classList.add("slide-up"))})}),o.forEach(function(e){a._addClass(Array.from(e.querySelectorAll(".lines")),"hidden"),a._addClass(Array.from(e.querySelectorAll(".nodes")),"hidden"),a._addClass(Array.from(e.querySelectorAll(".verticalNodes")),"hidden")}),this._addClass(o,"hidden"),this._isInAction(e)&&this._switchHorizontalArrow(e)},this)}},{key:"hideParent",value:function(e){var t=Array.from(this._closest(e,function(e){return e.classList.contains("nodes")}).parentNode.children).slice(0,3);t[0].querySelector(".spinner")&&(this.chart.dataset.inAjax=!1),this._getNodeState(e,"siblings").visible&&this.hideSiblings(e);var n=t.slice(1);this._css(n,"visibility","hidden");var i=t[0].querySelector(".node"),r=this._getNodeState(i,"parent").visible;i&&this._isVisible(i)&&(i.classList.add("slide","slide-down"),this._one(i,"transitionend",function(){i.classList.remove("slide"),this._removeAttr(n,"style"),this._addClass(t,"hidden")},this)),i&&r&&this.hideParent(i)}},{key:"addParent",value:function(e,t){var n=this;this._buildParentNode(e,t,function(){if(!e.querySelector(":scope > .topEdge")){var t=document.createElement("i");t.setAttribute("class","edge verticalEdge topEdge fa"),e.appendChild(t)}n.showParent(e)})}},{key:"_startLoading",value:function(e,t){var n=this.options,i=this.chart;if(void 0!==i.dataset.inAjax&&"true"===i.dataset.inAjax)return!1;e.classList.add("hidden");var r=document.createElement("i");r.setAttribute("class","fa fa-circle-o-notch fa-spin spinner"),t.appendChild(r),this._addClass(Array.from(t.querySelectorAll(":scope > *:not(.spinner)")),"hazy"),i.dataset.inAjax=!0;var s=this.chartContainer.querySelector(".oc-export-btn"+(""!==n.chartClass?"."+n.chartClass:""));return s&&(s.disabled=!0),!0}},{key:"_endLoading",value:function(e,t){var n=this.options;e.classList.remove("hidden"),t.querySelector(":scope > .spinner").remove(),this._removeClass(Array.from(t.querySelectorAll(":scope > .hazy")),"hazy"),this.chart.dataset.inAjax=!1;var i=this.chartContainer.querySelector(".oc-export-btn"+(""!==n.chartClass?"."+n.chartClass:""));i&&(i.disabled=!1)}},{key:"_clickTopEdge",value:function(e){e.stopPropagation();var t=this,n=e.target,i=n.parentNode,r=this._getNodeState(i,"parent"),s=this.options;if(r.exist){var a=this._closest(i,function(e){return e.classList.contains("nodes")}),o=a.parentNode.firstChild.querySelector(".node");if(o.classList.contains("slide"))return;r.visible?(this.hideParent(i),this._one(o,"transitionend",function(){this._isInAction(i)&&(this._switchVerticalArrow(n),this._switchHorizontalArrow(i))},this)):this.showParent(i)}else{var l=n.parentNode.id;this._startLoading(n,i)&&this._getJSON("function"==typeof s.ajaxURL.parent?s.ajaxURL.parent(i.dataset.source):s.ajaxURL.parent+l).then(function(e){"true"===t.chart.dataset.inAjax&&Object.keys(e).length&&t.addParent(i,e)}).catch(function(e){console.error("Failed to get parent node data.",e)}).finally(function(){t._endLoading(n,i)})}}},{key:"_addShowAllBottom",value:function(e){var t=document.createElement("div");t.classList.add("show-all","bottom"),t.addEventListener("click",function(t){t.preventDefault(),t.stopPropagation(),e.querySelector(".toggleBtn").click()});var n=document.createElement("i");n.classList.add("fa","fa-group"),t.appendChild(n);var i=document.createElement("i");i.classList.add("fa","fa-angle-double-down"),t.appendChild(i),e.appendChild(t)}},{key:"hideChildren",value:function(e){var t=this,n=this,i=this._nextAll(e.parentNode.parentNode),r=i[i.length-1],s=[];r.querySelector(".spinner")&&(this.chart.dataset.inAjax=!1);var a=Array.from(r.querySelectorAll(".node")).filter(function(e){return n._isVisible(e)}),o=r.classList.contains("verticalNodes");o||(a.forEach(function(e){var i=e.querySelector(".bottomEdge-click");i&&(i.classList.remove("fa-minus-square"),i.classList.add("fa-plus-square"),t._addShowAllBottom(e)),Array.prototype.push.apply(s,n._prevAll(n._closest(e,function(e){return e.classList.contains("nodes")}),".lines"))}),s=[].concat(_toConsumableArray(new Set(s))),this._css(s,"visibility","hidden")),this._one(a[0],"transitionend",function(t){this._removeClass(a,"slide"),o?n._addClass(i,"hidden"):(s.forEach(function(e){e.removeAttribute("style"),e.classList.add("hidden"),e.parentNode.lastChild.classList.add("hidden")}),this._addClass(Array.from(r.querySelectorAll(".verticalNodes")),"hidden")),this._isInAction(e)&&this._switchVerticalArrow(e.querySelector(".bottomEdge"))},this),this._addClass(a,"slide slide-up"),this._addShowAllBottom(e)}},{key:"showChildren",value:function(e){var t=this,n=this,i=this._nextAll(e.parentNode.parentNode),r=[];this._removeClass(i,"hidden"),i.some(function(e){return e.classList.contains("verticalNodes")})?i.forEach(function(e){Array.prototype.push.apply(r,Array.from(e.querySelectorAll(".node")).filter(function(e){return n._isVisible(e)}))}):Array.from(i[2].children).forEach(function(e){Array.prototype.push.apply(r,Array.from(e.querySelector("tr").querySelectorAll(".node")).filter(function(e){return n._isVisible(e)}))}),this._repaint(r[0]),this._one(r[0],"transitionend",function(n){t._removeClass(r,"slide"),t._isInAction(e)&&t._switchVerticalArrow(e.querySelector(".bottomEdge"))},this),this._addClass(r,"slide"),this._removeClass(r,"slide-up")}},{key:"_buildChildNode",value:function(e,t,n){var i=t.children||t.siblings;e.querySelector("td").setAttribute("colSpan",2*i.length),this.buildHierarchy(e,{children:i},0,n)}},{key:"addChildren",value:function(e,t){var n=this,i=this.options,r=0;this.chart.dataset.inEdit="addChildren",this._buildChildNode.call(this,this._closest(e,function(e){return"TABLE"===e.nodeName}),t,function(){if(++r===t.children.length){if(!e.querySelector(".bottomEdge")){var s=document.createElement("i");s.setAttribute("class","edge verticalEdge bottomEdge fa"),e.appendChild(s)}if(!e.querySelector(".symbol")){var a=document.createElement("i");a.setAttribute("class","fa "+i.parentNodeSymbol+" symbol"),e.querySelector(":scope > .title").appendChild(a)}n.showChildren(e),n.chart.dataset.inEdit=""}})}},{key:"_clickBottomEdge",value:function(e){var t=this;e.stopPropagation();var n=this,i=this.options,r=e.target,s=r.parentNode,a=this._getNodeState(s,"children");if(a.exist){var o=this._closest(s,function(e){return"TR"===e.nodeName}).parentNode.lastChild;if(Array.from(o.querySelectorAll(".node")).some(function(e){return t._isVisible(e)&&e.classList.contains("slide")}))return;a.visible?this.hideChildren(s):(this.showChildren(s),Array.from(s.querySelectorAll(".show-all.bottom")).forEach(function(e){return e.remove()}))}else{var l=r.parentNode.id;this._startLoading(r,s)&&this._getJSON("function"==typeof i.ajaxURL.children?i.ajaxURL.children(s.dataset.source):i.ajaxURL.children+l).then(function(e){"true"===n.chart.dataset.inAjax&&e.children.length&&n.addChildren(s,e)}).catch(function(e){console.error("Failed to get children nodes data",e)}).finally(function(){n._endLoading(r,s)})}}},{key:"_complementLine",value:function(e,t,n){var i=e.parentNode.parentNode.children;i[0].children[0].setAttribute("colspan",2*t),i[1].children[0].setAttribute("colspan",2*t);for(var r=0;r<n;r++){var s=document.createElement("td"),a=document.createElement("td");s.setAttribute("class","rightLine topLine"),s.innerHTML="&nbsp;",i[2].insertBefore(s,i[2].children[1]),a.setAttribute("class","leftLine topLine"),a.innerHTML="&nbsp;",i[2].insertBefore(a,i[2].children[1])}}},{key:"_buildSiblingNode",value:function(e,t,n){var i=this,r=this,s=t.siblings?t.siblings.length:t.children.length,a="TD"===e.parentNode.nodeName?this._closest(e,function(e){return"TR"===e.nodeName}).children.length:1,o=a+s,l=o>1?Math.floor(o/2-1):0;if("TD"===e.parentNode.nodeName){var d=this._prevAll(e.parentNode.parentNode);d[0].remove(),d[1].remove();var c=0;r._buildChildNode.call(r,r._closest(e.parentNode,function(e){return"TABLE"===e.nodeName}),t,function(){if(++c===s){var t=Array.from(r._closest(e.parentNode,function(e){return"TABLE"===e.nodeName}).lastChild.children);if(a>1){var i=e.parentNode.parentNode;Array.from(i.children).forEach(function(e){t[0].parentNode.insertBefore(e,t[0])}),i.remove(),r._complementLine(t[0],o,a),r._addClass(t,"hidden"),t.forEach(function(e){r._addClass(e.querySelectorAll(".node"),"slide-left")})}else{var d=e.parentNode.parentNode;t[l].parentNode.insertBefore(e.parentNode,t[l+1]),d.remove(),r._complementLine(t[l],o,1),r._addClass(t,"hidden"),r._addClass(r._getDescElements(t.slice(0,l+1),".node"),"slide-right"),r._addClass(r._getDescElements(t.slice(l+1),".node"),"slide-left")}n()}})}else{var h=0;r.buildHierarchy.call(r,r.chart,t,0,function(){if(++h===o){var t=e.nextElementSibling.children[3].children[l],s=document.createElement("td");s.setAttribute("colspan",2),s.appendChild(e),t.parentNode.insertBefore(s,t.nextElementSibling),r._complementLine(t,o,1);var a=r._closest(e,function(e){return e.classList&&e.classList.contains("nodes")}).parentNode.children[0];a.classList.add("hidden"),r._addClass(Array.from(a.querySelectorAll(".node")),"slide-down");var d=i._siblings(e.parentNode);r._addClass(d,"hidden"),r._addClass(r._getDescElements(d.slice(0,l),".node"),"slide-right"),r._addClass(r._getDescElements(d.slice(l),".node"),"slide-left"),n()}})}}},{key:"addSiblings",value:function(e,t){var n=this;this.chart.dataset.inEdit="addSiblings",this._buildSiblingNode.call(this,this._closest(e,function(e){return"TABLE"===e.nodeName}),t,function(){if(n._closest(e,function(e){return e.classList&&e.classList.contains("nodes")}).dataset.siblingsLoaded=!0,!e.querySelector(".leftEdge")){var t=document.createElement("i"),i=document.createElement("i");t.setAttribute("class","edge horizontalEdge rightEdge fa"),e.appendChild(t),i.setAttribute("class","edge horizontalEdge leftEdge fa"),e.appendChild(i)}n.showSiblings(e),n.chart.dataset.inEdit=""})}},{key:"removeNodes",value:function(e){var t=this._closest(e,function(e){return"TABLE"===e.nodeName}).parentNode,n=this._siblings(t.parentNode);"TD"===t.nodeName?this._getNodeState(e,"siblings").exist?(n[2].querySelector(".topLine").nextElementSibling.remove(),n[2].querySelector(".topLine").remove(),n[0].children[0].setAttribute("colspan",n[2].children.length),n[1].children[0].setAttribute("colspan",n[2].children.length),t.remove()):(n[0].children[0].removeAttribute("colspan"),n[0].querySelector(".bottomEdge").remove(),this._siblings(n[0]).forEach(function(e){return e.remove()})):Array.from(t.parentNode.children).forEach(function(e){return e.remove()})}},{key:"_clickHorizontalEdge",value:function(e){var t=this;e.stopPropagation();var n=this,i=this.options,r=e.target,s=r.parentNode,a=this._getNodeState(s,"siblings");if(a.exist){var o=this._closest(s,function(e){return"TABLE"===e.nodeName}).parentNode;if(this._siblings(o).some(function(e){var n=e.querySelector(".node");return t._isVisible(n)&&n.classList.contains("slide")}))return;if(i.toggleSiblingsResp){var l=this._closest(s,function(e){return"TABLE"===e.nodeName}).parentNode.previousElementSibling,d=this._closest(s,function(e){return"TABLE"===e.nodeName}).parentNode.nextElementSibling;r.classList.contains("leftEdge")?l.classList.contains("hidden")?this.showSiblings(s,"left"):this.hideSiblings(s,"left"):d.classList.contains("hidden")?this.showSiblings(s,"right"):this.hideSiblings(s,"right")}else a.visible?this.hideSiblings(s):this.showSiblings(s)}else{var c=r.parentNode.id,h=this._getNodeState(s,"parent").exist?"function"==typeof i.ajaxURL.siblings?i.ajaxURL.siblings(JSON.parse(s.dataset.source)):i.ajaxURL.siblings+c:"function"==typeof i.ajaxURL.families?i.ajaxURL.families(JSON.parse(s.dataset.source)):i.ajaxURL.families+c;this._startLoading(r,s)&&this._getJSON(h).then(function(e){"true"===n.chart.dataset.inAjax&&(e.siblings||e.children)&&n.addSiblings(s,e)}).catch(function(e){console.error("Failed to get sibling nodes data",e)}).finally(function(){n._endLoading(r,s)})}}},{key:"_clickToggleButton",value:function(e){var t=this,n=e.target,i=n.parentNode.nextElementSibling,r=Array.from(i.querySelectorAll(".node")),s=Array.from(i.children).map(function(e){return e.querySelector(".node")});s.some(function(e){return e.classList.contains("slide")})||(n.classList.toggle("fa-plus-square"),n.classList.toggle("fa-minus-square"),r[0].classList.contains("slide-up")?(i.classList.remove("hidden"),this._repaint(s[0]),this._addClass(s,"slide"),this._removeClass(s,"slide-up"),this._one(s[0],"transitionend",function(){t._removeClass(s,"slide")})):(this._addClass(r,"slide slide-up"),this._one(r[0],"transitionend",function(){t._removeClass(r,"slide"),r.forEach(function(e){t._closest(e,function(e){return"UL"===e.nodeName}).classList.add("hidden")})}),r.forEach(function(e){var n=Array.from(e.querySelectorAll(".toggleBtn"));t._removeClass(n,"fa-minus-square"),t._addClass(n,"fa-plus-square")})))}},{key:"_dispatchClickEvent",value:function(e){var t=e.target.classList;t.contains("topEdge")?this._clickTopEdge(e):t.contains("rightEdge")||t.contains("leftEdge")?this._clickHorizontalEdge(e):t.contains("bottomEdge-click")?this._clickBottomEdge(e):t.contains("toggleBtn-click")?this._clickToggleButton(e):this._clickNode(e)}},{key:"_onDragStart",value:function(e){var t=e.target,n=this.options,i=/firefox/.test(window.navigator.userAgent.toLowerCase());if(i&&e.dataTransfer.setData("text/html","hack for firefox"),this.chart.style.transform){var r=void 0,s=void 0;document.querySelector(".ghost-node")?(r=this.chart.querySelector(":scope > .ghost-node"),s=r.children[0]):(r=document.createElementNS("http://www.w3.org/2000/svg","svg"),r.classList.add("ghost-node"),s=document.createElementNS("http://www.w3.org/2000/svg","rect"),r.appendChild(s),this.chart.appendChild(r));var a=this.chart.style.transform.split(","),o=Math.abs(window.parseFloat("t2b"===n.direction||"b2t"===n.direction?a[0].slice(a[0].indexOf("(")+1):a[1]));r.setAttribute("width",t.offsetWidth),r.setAttribute("height",t.offsetHeight),s.setAttribute("x",5*o),s.setAttribute("y",5*o),s.setAttribute("width",120*o),s.setAttribute("height",40*o),s.setAttribute("rx",4*o),s.setAttribute("ry",4*o),s.setAttribute("stroke-width",1*o);var l=e.offsetX*o,d=e.offsetY*o;if("l2r"===n.direction?(l=e.offsetY*o,d=e.offsetX*o):"r2l"===n.direction?(l=t.offsetWidth-e.offsetY*o,d=e.offsetX*o):"b2t"===n.direction&&(l=t.offsetWidth-e.offsetX*o,d=t.offsetHeight-e.offsetY*o),i){var c=document.createElement("img");c.src="data:image/svg+xml;utf8,"+(new XMLSerializer).serializeToString(r),e.dataTransfer.setDragImage(c,l,d),s.setAttribute("fill","rgb(255, 255, 255)"),s.setAttribute("stroke","rgb(191, 0, 0)")}else e.dataTransfer.setDragImage(r,l,d)}var h=e.target,u=this._closest(h,function(e){return e.classList&&e.classList.contains("nodes")}).parentNode.children[0].querySelector(".node"),f=Array.from(this._closest(h,function(e){return"TABLE"===e.nodeName}).querySelectorAll(".node"));this.dragged=h,Array.from(this.chart.querySelectorAll(".node")).forEach(function(e){f.includes(e)||(n.dropCriteria?n.dropCriteria(h,u,e)&&e.classList.add("allowedDrop"):e.classList.add("allowedDrop"))})}},{key:"_onDragOver",value:function(e){e.preventDefault(),e.currentTarget.classList.contains("allowedDrop")||(e.dataTransfer.dropEffect="none")}},{key:"_onDragEnd",value:function(e){Array.from(this.chart.querySelectorAll(".allowedDrop")).forEach(function(e){e.classList.remove("allowedDrop")})}},{key:"_onDrop",value:function(e){var t=e.currentTarget,n=this.chart,i=this.dragged,r=this._closest(i,function(e){return e.classList&&e.classList.contains("nodes")}).parentNode.children[0].children[0];if(this._removeClass(Array.from(n.querySelectorAll(".allowedDrop")),"allowedDrop"),t.parentNode.parentNode.nextElementSibling){var s=window.parseInt(t.parentNode.colSpan)+2;if(t.parentNode.setAttribute("colspan",s),t.parentNode.parentNode.nextElementSibling.children[0].setAttribute("colspan",s),!i.querySelector(".horizontalEdge")){var a=document.createElement("i"),o=document.createElement("i");a.setAttribute("class","edge horizontalEdge rightEdge fa"),i.appendChild(a),o.setAttribute("class","edge horizontalEdge leftEdge fa"),i.appendChild(o)}var l=t.parentNode.parentNode.nextElementSibling.nextElementSibling,d=document.createElement("td"),c=document.createElement("td");d.setAttribute("class","leftLine topLine"),d.innerHTML="&nbsp;",l.insertBefore(d,l.children[1]),c.setAttribute("class","rightLine topLine"),c.innerHTML="&nbsp;",l.insertBefore(c,l.children[2]),l.nextElementSibling.appendChild(this._closest(i,function(e){return"TABLE"===e.nodeName}).parentNode);var h=this._siblings(this._closest(i,function(e){return"TABLE"===e.nodeName}).parentNode).map(function(e){return e.querySelector(".node")});if(1===h.length){var u=document.createElement("i"),f=document.createElement("i");u.setAttribute("class","edge horizontalEdge rightEdge fa"),h[0].appendChild(u),f.setAttribute("class","edge horizontalEdge leftEdge fa"),h[0].appendChild(f)}}else{var p=document.createElement("i");p.setAttribute("class","edge verticalEdge bottomEdge fa"),t.appendChild(p),t.parentNode.setAttribute("colspan",2);var v=this._closest(t,function(e){return"TABLE"===e.nodeName}),m=document.createElement("tr"),g=document.createElement("tr"),y=document.createElement("tr");m.setAttribute("class","lines"),m.innerHTML='<td colspan="2"><div class="downLine"></div></td>',v.appendChild(m),g.setAttribute("class","lines"),g.innerHTML='<td class="rightLine">&nbsp;</td><td class="leftLine">&nbsp;</td>',v.appendChild(g),y.setAttribute("class","nodes"),v.appendChild(y),Array.from(i.querySelectorAll(".horizontalEdge")).forEach(function(e){i.removeChild(e)});var b=this._closest(i,function(e){return"TABLE"===e.nodeName}).parentNode;y.appendChild(b)}var _=window.parseInt(r.colSpan);if(_>2){r.setAttribute("colspan",_-2),r.parentNode.nextElementSibling.children[0].setAttribute("colspan",_-2);var L=r.parentNode.nextElementSibling.nextElementSibling;L.children[1].remove(),L.children[1].remove();var E=Array.from(r.parentNode.parentNode.children[3].children).map(function(e){return e.querySelector(".node")});1===E.length&&(E[0].querySelector(".leftEdge").remove(),E[0].querySelector(".rightEdge").remove())}else r.removeAttribute("colspan"),r.querySelector(".node").removeChild(r.querySelector(".bottomEdge")),Array.from(r.parentNode.parentNode.children).slice(1).forEach(function(e){return e.remove()});var A=new CustomEvent("nodedropped.orgchart",{
detail:{draggedNode:i,dragZone:r.children[0],dropZone:t}});n.dispatchEvent(A)}},{key:"_createNode",value:function(e,t){var n=this,i=this.options;return new Promise(function(r,s){if(e.children){var a=!0,o=!1,l=void 0;try{for(var d,c=e.children[Symbol.iterator]();!(a=(d=c.next()).done);a=!0){d.value.parentId=e.id}}catch(e){o=!0,l=e}finally{try{!a&&c.return&&c.return()}finally{if(o)throw l}}}var h=document.createElement("div");delete e.children,h.dataset.source=JSON.stringify(e),e[i.nodeId]&&(h.id=e[i.nodeId]);var u=n.chart.dataset.inEdit,f=void 0;if(f=u?"addChildren"===u?" slide-up":"":t>=i.depth?" slide-up":"",h.setAttribute("class","node "+(i.colors[e.color]||"")+f),i.draggable&&h.setAttribute("draggable",!0),e.parentId&&h.setAttribute("data-parent",e.parentId),e.root&&h.classList.add("rootNode"),e.hasSubordinates){var p=document.createElement("div");p.classList.add("show-all"),i.onShowAllClick&&p.addEventListener("click",function(e){e.preventDefault(),e.stopPropagation(),i.onShowAllClick()});var v=document.createElement("i");v.classList.add("fa","fa-group"),p.appendChild(v);var m=document.createElement("i");m.classList.add("fa","fa-angle-double-up"),p.appendChild(m),h.prepend(p)}var g=document.createElement("div");if(g.classList.add("title"),g.innerHTML=e.root?e[i.rootNodeTitle]:e[i.nodeTitle],h.appendChild(g),!e.root&&i.showAvatars){h.classList.add("withAvatar");var y=document.createElement("div");if(y.classList.add("avatar"),e.avatarUrl&&e.avatarUrl.length>0)y.setAttribute("style","background-image: url("+e.avatarUrl+");");else{var b=e[i.firstLine],_=b[0],L="",E=b.indexOf(" ");E>-1&&(L=b[E+1]),y.innerHTML=_+L}h.appendChild(y)}if(!e.root&&i.firstLine){var A=document.createElement("div");if(A.classList.add("content"),A.innerHTML=e[i.firstLine],i.secondLine&&e[i.secondLine]&&e[i.secondLine].length>0){var S=document.createElement("div");S.classList.add("contentSecondLine"),S.innerHTML=e[i.secondLine].split(" : ").pop(),A.appendChild(S)}if(e.border_color){A.classList.add("with-border-legend");var C=e.border_color?"border-"+i.borderColors[e.border_color]:"",N=document.createElement("div");N.classList.add("border-legend",C),N.innerHTML=C.split("-").pop(),A.appendChild(N)}h.appendChild(A)}var k=e.relationship||"";if(i.verticalDepth&&t+2>i.verticalDepth||Number(k.substr(2,1)))if(t+1>=i.verticalDepth&&Number(k.substr(2,1))){var q=document.createElement("i"),w=t+1>=i.depth?"plus":"minus";q.setAttribute("class","toggleBtn toggleBtn-click fa fa-"+w+"-square"),h.appendChild(q)}else if(Number(k.substr(2,1))&&!e.root){var x=document.createElement("i"),T=t+1>=i.depth?"plus":"minus";x.setAttribute("class","toggleBtn edge bottomEdge bottomEdge-click fa fa-"+T+"-square"),h.appendChild(x)}h.addEventListener("click",n._dispatchClickEvent.bind(n)),i.draggable&&(h.addEventListener("dragstart",n._onDragStart.bind(n)),h.addEventListener("dragover",n._onDragOver.bind(n)),h.addEventListener("dragend",n._onDragEnd.bind(n)),h.addEventListener("drop",n._onDrop.bind(n))),i.createNode&&i.createNode(h,e),r(h)})}},{key:"buildHierarchy",value:function(e,t,n,i){var r=this,s=this.options,a=void 0,o=t.children,l=s.verticalDepth&&n+1>=s.verticalDepth;if(Object.keys(t).length>1&&(a=l?e:document.createElement("table"),l||e.appendChild(a),this._createNode(t,n).then(function(e){if(l)a.insertBefore(e,a.firstChild);else{var t=document.createElement("tr");t.innerHTML="\n            <td "+(o?'colspan="'+2*o.length+'"':"")+">\n            </td>\n          ",t.children[0].appendChild(e),a.insertBefore(t,a.children[0]?a.children[0]:null)}i&&i()}).catch(function(e){console.error("Failed to creat node",e)})),o){1===Object.keys(t).length&&(a=e);var d=void 0,c=s.verticalDepth&&n+2>=s.verticalDepth,h=r.chart.dataset.inEdit;if(d=h?"addSiblings"===h?"":" hidden":n+1>=s.depth?" hidden":"",!c){var u=document.createElement("tr");u.setAttribute("class","lines"+d),u.innerHTML='\n          <td colspan="'+2*o.length+'">\n            <div class="downLine"></div>\n          </td>\n        ',a.appendChild(u)}var f=document.createElement("tr");f.setAttribute("class","lines"+d),f.innerHTML='\n        <td class="rightLine">&nbsp;</td>\n        '+o.slice(1).map(function(){return'\n          <td class="leftLine topLine">&nbsp;</td>\n          <td class="rightLine topLine">&nbsp;</td>\n          '}).join("")+'\n        <td class="leftLine">&nbsp;</td>\n      ';var p=void 0;if(c)if(p=document.createElement("ul"),d&&p.classList.add(d.trim()),n+2===s.verticalDepth){var v=document.createElement("tr");v.setAttribute("class","verticalNodes"+d),v.innerHTML="<td></td>",v.firstChild.appendChild(p),a.appendChild(v)}else a.appendChild(p);else p=document.createElement("tr"),p.setAttribute("class","nodes"+d),a.appendChild(f),a.appendChild(p);o.forEach(function(e){var t=void 0;c?t=document.createElement("li"):(t=document.createElement("td"),t.setAttribute("colspan",2)),p.appendChild(t),r.buildHierarchy(t,e,n+1,i)})}}},{key:"_clickChart",value:function(e){!this._closest(e.target,function(e){return e.classList&&e.classList.contains("node")})&&this.chart.querySelector(".node.focused")&&this.chart.querySelector(".node.focused").classList.remove("focused")}},{key:"_clickExportButton",value:function(){var e=this.options,t=this.chartContainer,n=t.querySelector(":scope > .mask"),i=t.querySelector(".orgchart:not(.hidden)"),r="l2r"===e.direction||"r2l"===e.direction;n?n.classList.remove("hidden"):(n=document.createElement("div"),n.setAttribute("class","mask"),n.innerHTML='<i class="fa fa-circle-o-notch fa-spin spinner"></i>',t.appendChild(n)),t.classList.add("canvasContainer"),window.html2canvas(i,{width:r?i.clientHeight:i.clientWidth,height:r?i.clientWidth:i.clientHeight,onclone:function(e){var t=e.querySelector(".canvasContainer");t.style.overflow="visible",t.querySelector(".orgchart:not(.hidden)").transform=""}}).then(function(e){var n=t.querySelector(".oc-download-btn");t.querySelector(".mask").classList.add("hidden"),n.setAttribute("href",e.toDataURL()),n.click()}).catch(function(e){console.error("Failed to export the curent orgchart!",e)}).finally(function(){t.classList.remove("canvasContainer")})}},{key:"_loopChart",value:function(e){var t=this,n={id:e.querySelector(".node").id};return e.children[3]&&Array.from(e.children[3].children).forEach(function(e){n.children||(n.children=[]),n.children.push(t._loopChart(e.firstChild))}),n}},{key:"getHierarchy",value:function(){return this.chart.querySelector(".node").id?this._loopChart(this.chart.querySelector("table")):"Error: Nodes of orghcart to be exported must have id attribute!"}},{key:"_onPanStart",value:function(e){var t=e.currentTarget;if(this._closest(e.target,function(e){return e.classList&&e.classList.contains("node")})||e.touches&&e.touches.length>1)return void(t.dataset.panning=!1);t.style.cursor="move",t.dataset.panning=!0;var n=0,i=0,r=window.getComputedStyle(t).transform;if("none"!==r){var s=r.split(",");r.includes("3d")?(n=Number.parseInt(s[12],10),i=Number.parseInt(s[13],10)):(n=Number.parseInt(s[4],10),i=Number.parseInt(s[5],10))}var a=0,o=0;if(e.targetTouches){if(1===e.targetTouches.length)a=e.targetTouches[0].pageX-n,o=e.targetTouches[0].pageY-i;else if(e.targetTouches.length>1)return}else a=e.pageX-n,o=e.pageY-i;t.dataset.panStart=JSON.stringify({startX:a,startY:o}),t.addEventListener("mousemove",this._onPanning.bind(this)),t.addEventListener("touchmove",this._onPanning.bind(this))}},{key:"_onPanning",value:function(e){var t=e.currentTarget;if("false"!==t.dataset.panning){var n=0,i=0,r=JSON.parse(t.dataset.panStart),s=r.startX,a=r.startY;if(e.targetTouches){if(1===e.targetTouches.length)n=e.targetTouches[0].pageX-s,i=e.targetTouches[0].pageY-a;else if(e.targetTouches.length>1)return}else n=e.pageX-s,i=e.pageY-a;var o=window.getComputedStyle(t).transform;if("none"===o)o.includes("3d")?t.style.transform="matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, "+n+", "+i+", 0, 1)":t.style.transform="matrix(1, 0, 0, 1, "+n+", "+i+")";else{var l=o.split(",");o.includes("3d")?(l[12]=n,l[13]=i):(l[4]=n,l[5]=i+")"),t.style.transform=l.join(",")}}}},{key:"_onPanEnd",value:function(e){var t=this.chart;"true"===t.dataset.panning&&(t.dataset.panning=!1,t.style.cursor="default",document.body.removeEventListener("mousemove",this._onPanning),document.body.removeEventListener("touchmove",this._onPanning))}},{key:"_setChartScale",value:function(e,t){var n=[.25,.33,.5,.67,.75,.8,.9,1,1.1,1.25,1.5,1.75,2,2.5,3],i=n[7];if(0===e.style.transform.length){i=t?n[8]:n[6];var r=-1*(this.chart.clientWidth-this.chart.clientWidth*i)/2,s=-1*(this.chart.clientHeight-this.chart.clientHeight*i)/2;e.style.transform="matrix("+i+", 0, 0, "+i+", "+r+", "+s+")"}else{var a=JSON.parse(e.style.transform.replace(/^\w+\(/,"[").replace(/\)$/,"]")),o=n.indexOf(a[0]);i=t?n[o+1]:n[o-1];var l=parseFloat(a[4]+(this.chart.clientWidth-this.chart.clientWidth*n[o])/2),d=parseFloat(a[5]+(this.chart.clientHeight-this.chart.clientHeight*n[o])/2),c=parseFloat((this.chart.clientWidth-this.chart.clientWidth*i)/2),h=parseFloat((this.chart.clientHeight-this.chart.clientHeight*i)/2),u=l-c,f=d-h;e.style.transform="matrix("+i+", "+a[1]+", "+a[2]+", "+i+", "+u+", "+f+")"}}},{key:"_onWheeling",value:function(e){e.preventDefault();var t=e.deltaY>0?.8:1.2;this._setChartScale(this.chart,t)}},{key:"_getPinchDist",value:function(e){return Math.sqrt((e.touches[0].clientX-e.touches[1].clientX)*(e.touches[0].clientX-e.touches[1].clientX)+(e.touches[0].clientY-e.touches[1].clientY)*(e.touches[0].clientY-e.touches[1].clientY))}},{key:"_onTouchStart",value:function(e){var t=this.chart;if(e.touches&&2===e.touches.length){var n=this._getPinchDist(e);t.dataset.pinching=!0,t.dataset.pinchDistStart=n}}},{key:"_onTouchMove",value:function(e){var t=this.chart;if(t.dataset.pinching){var n=this._getPinchDist(e);t.dataset.pinchDistEnd=n}}},{key:"_onTouchEnd",value:function(e){var t=this.chart;if(t.dataset.pinching){t.dataset.pinching=!1;var n=t.dataset.pinchDistEnd-t.dataset.pinchDistStart;n>0?this._setChartScale(t,1):n<0&&this._setChartScale(t,-1)}}},{key:"name",get:function(){return this._name}}]),e}();exports.default=OrgChart;