/**
 * Created by wisestone on 2018-05-10.
 */
'use strict';

define(['app', 'angular', 'd3'],
    function (app, angular, d3) {
        app.directive('jsWorkflow', ["$log", "$rootScope", "IssueStatus", "$resourceProvider", "SweetAlert", '$filter', '$injector', '$controller',
            function ($log, $rootScope, IssueStatus, $resourceProvider, SweetAlert, $filter, $injector, $controller) {
                return {
                    scope : {
                        issueStatusList : '=issueStatusList',
                        vm : '=ngModel',
                        isolationWorkflow : '=isolationWorkflow',
                        firstStatusExist : "=firstStatusExist",
                        middleStatusExist : "=middleStatusExist",
                        lastStatusExist : "=lastStatusExist",
                        departments : "=departments"
                    },
                    restrict : 'E',
                    replace : true,
                    templateUrl : 'custom_components/js-workflow/js-workflow.html',
                    controller : function ($scope, $element, $attrs) {
                        //  함수 모음
                        $scope.fn = {
                            initializeLayout : initializeLayout,    //  기초 레이아웃을 설정한다.
                            makeNodeAndLink : makeNodeAndLink,  //  노드와 링크 정보를 생성한다.
                            forceLayout : forceLayout,  //  워크플로우 다이어그램을 그린다.
                            initCircleColor : initCircleColor,  //  노드 색상을 초기화한다.
                            initLinkColor : initLinkColor,  //  전이선 색상을 초기화한다.
                            makeNode : makeNode,    //  노드를 만든다.
                            makeLink : makeLink,    //  전이선을 만든다.
                            makeDragEvent : makeDragEvent,  //  드래그 이벤트 생성
                            makeGridLine : makeGridLine,    //  표시되는 선을 생성한다.
                            executeForce : executeForce,    //  포스 레이아웃 실행
                            setLink : setLink,  //  링크를 셋팅한다.
                            setNode : setNode,  //  노드를 셋팅한다.
                            setNodeTexts : setNodeTexts,    //  노드 텍스트를 셋팅한다.
                            targetClick : targetClick,  //  타겟을 클릭했을 때 색상을 변경한다.
                            tick : tick,    //  다이어그램에서 도형을 움직일 때 실행
                            startDiagram : startDiagram,    //  다이어그램을 그리기 시작한다.
                            getIssueStatusList : getIssueStatusList,    //  전체 이슈 상태를 가져온다.
                            addStatus : addStatus,  //  이슈 상태를 다이어그램에 추가한다.
                            addTransition : addTransition,  //  전이선을 다이어그램에 추가한다.
                            getAvailableStartStatus : getAvailableStartStatus,   //  시작하는 이슈 상태의 선택 목록을 가져온다.
                            getAvailableNextStatus : getAvailableNextStatus,    //  이동할 이슈 상태의 선택 목록을 가져온다.
                            setLastStatusPosition : setLastStatusPosition,  //  상태 마지막 위치 정보 저장
                            setLastTransitionPosition : setLastTransitionPosition,  //  전이선 마지막 위치 정보 저장
                            updateClientChangePosition : updateClientChangePosition,    //  클라이언트에서 변경한 위치 정보를 클라이언트에서 관리하는 데이터에 업데이트한다.
                            checkIsolationWorkflowAndExceptionGenerate : checkIsolationWorkflowAndExceptionGenerate,    //  고립된 이슈 상태가 없는 워크플로우인지 확인한다. - 고립되었을 경우에는 저장 금지
                            checkRequireIssueStatusTypeExceptionGenerate : checkRequireIssueStatusTypeExceptionGenerate,    //  상태 속성 별로 1개씩 존재하는지 확인한다. - 부족할 경우 저장 금지
                            generatorTransitionId : generatorTransitionId,  //  전이선 임시 id 얻기
                            removeWorkflowTransition : removeWorkflowTransition,    //  전이선을 삭제한다.
                            removeIssueStatus : removeIssueStatus,  //  이슈 상태를 제거한다.
                            defaultAddIssueStatusId : defaultAddIssueStatusId,   //  이슈 상태 추가 셀렉트 박스에서 첫번째 옵션 항목을 기본 선택되게 한다.
                            checkReadyType : checkReadyType,    //  다이어그램안에 상태 속성 '대기'인 이슈 상태가 존재하는지 확인한다.
                            getOptionColor : getOptionColor,  //  이슈 상태의 색상 정보를 가져온다.
                            changeDepartment : changeDepartment,
                            removeDepartment : removeDepartment
                        };

                        //  변수 모음
                        $scope.vm.targetIssueStatusList = [];
                        $scope.vm.issueStatuses = [];   //  선택 가능한 이슈 상태 목록
                        $scope.vm.addIssueStatusId = null;   //  추가하는 이슈 상태 아이디
                        $scope.vm.issueStatusVos = []; // 화면에 있는 이슈 상태 목록
                        $scope.vm.width = 0;  //  넓이
                        $scope.vm.height = 0;  //  높이
                        $scope.vm.svg = null;   //  svg 정보
                        $scope.vm.rect = null;  //  다이어그램이 그려지는 사각형 정보
                        $scope.vm.nodes = [];   //  원 정보 모음
                        $scope.vm.links = [];   //  링크 정보 모음
                        $scope.vm.activeTarget = null;  //  현재 선택한 대상 정보
                        $scope.vm.drag = null;
                        $scope.vm.force = null;
                        $scope.vm.node = null;
                        $scope.vm.link = null;
                        $scope.vm.nodeTexts = null; //  원에 표시되는 텍스트
                        $scope.vm.sourceStatusId = null;    //  출발하는 이슈 상태 아이디
                        $scope.vm.targetStatusId = null;    //  연결하는 이슈 상태 아이디
                        $scope.vm.transitionIdGenerator = 100;  //  전이선 임시 id 값

                        $scope.vm.departments = []; // 부서 목록
                        $scope.vm.departmentName = "" // 선택된 부서 이름

                        angular.extend(this, $controller('autoCompleteController', {$scope : $scope, $injector : $injector}));

                        $scope.$watch("issueStatusList", function (newValue) {
                            if ($rootScope.isDefined(newValue)) {
                                $scope.fn.startDiagram();
                                setWorkflowDepartments();
                            }
                        })

                        // 저장된 담당부서 설정하기
                        function setWorkflowDepartments() {
                            var workflowDepartmentVos = [];

                            angular.forEach($scope.issueStatusList, function (issueStatus) {
                                angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                    if (issueStatusVo.id === issueStatus.id) {
                                        var issueStatusWorkflowDepartments = {
                                            workflowDepartmentVos : workflowDepartmentVos,
                                            workflowDepartmentName : ""
                                        }
                                        issueStatusVo = Object.assign(issueStatusVo, issueStatusWorkflowDepartments);
                                    }
                                });
                            })
                        }

                        //  이슈 상태 추가 셀렉트 박스에서 첫번째 옵션 항목을 기본 선택되게 한다.
                        function defaultAddIssueStatusId() {
                            if ($scope.vm.issueStatuses.length > 0) {
                                $scope.vm.addIssueStatusId = String($scope.vm.issueStatuses[0].id);
                            }
                            else {
                                $scope.vm.addIssueStatusId = null;
                            }
                        }

                        //  다이어그램을 그리기 시작한다.
                        function startDiagram() {
                            $("#svgContent").empty();

                            $scope.fn.getIssueStatusList();

                            $scope.vm.width = $(".workflowbox").width();  //  넓이
                            $scope.vm.height = $(".workflowbox").height();  //  높이

                            $scope.vm.activeTarget = null;  //  타겟 초기화
                            $scope.fn.initCircleColor(null, true);  //  마지막 선택 노드 색상 초기화
                            $scope.fn.forceLayout();   //  다이어그램 에디터 그리기 시작
                            $scope.fn.checkRequireIssueStatusTypeExceptionGenerate();   //  상태 속성 별로 1개씩 존재하는지 확인한다. - 부족할 경우 저장 금지
                            $scope.fn.checkIsolationWorkflowAndExceptionGenerate(); //  고립된 이슈 상태가 없는 워크플로우인지 확인한다. - 고립되었을 경우에는 저장 금지
                        }

                        //  전이선 임시 id 얻기
                        function generatorTransitionId() {
                            return "transition" + $scope.vm.transitionIdGenerator++;
                        }

                        //  상태 마지막 위치 정보 저장
                        function setLastStatusPosition(issueStatus) {
                            issueStatus.xLocation = $scope.vm.nodes[issueStatus.name].x;
                            issueStatus.yLocation = $scope.vm.nodes[issueStatus.name].y;
                        }

                        //  전이선 마지막 위치 정보 저장
                        function setLastTransitionPosition(workflowTransition, index) {
                            workflowTransition.correctX = $scope.vm.links[index].correctX;
                            workflowTransition.correctY = $scope.vm.links[index].correctY;
                            workflowTransition.direct = $scope.vm.links[index].direct;
                        }

                        //  클라이언트에서 변경한 위치 정보를 클라이언트에서 관리하는 데이터에 업데이트한다.
                        function updateClientChangePosition() {
                            //  서버에서 내려온 데이터에 전이선 변경 정보를 업데이트한다.
                            angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                angular.forEach(issueStatusVo.workflowTransitionVos, function (workflowTransition) {
                                    for (var count in $scope.vm.links) {
                                        if ($scope.vm.links[count].id == workflowTransition.id) {
                                            $scope.fn.setLastTransitionPosition(workflowTransition, count);
                                            break;
                                        }
                                    }
                                });

                                $scope.fn.setLastStatusPosition(issueStatusVo);
                            });
                        }

                        //  시작하는 이슈 상태의 선택 목록을 가져온다.
                        function getAvailableStartStatus() {
                            var availableStatus = [];

                            angular.forEach($scope.vm.issueStatusVos, function (startStatus) {
                                if ($scope.vm.targetStatusId != startStatus.id) {
                                    switch (startStatus.issueStatusType) {
                                        case 'READY' :
                                            startStatus.issueStatusTypeKr = '대기'
                                            break;
                                        case 'OPEN' :
                                            startStatus.issueStatusTypeKr = '진행'
                                            break;
                                        case 'CLOSE' :
                                            startStatus.issueStatusTypeKr = '종료'
                                            break;
                                    }
                                    availableStatus.push(startStatus);
                                }
                            });

                            availableStatus.sort(function (a, b) {
                                return a.name > b.name ? 1 : 0
                            });

                            return availableStatus;
                        }

                        //  이동할 이슈 상태의 선택 목록을 가져온다.
                        function getAvailableNextStatus() {
                            $scope.vm.targetIssueStatusList = [];
                            $scope.vm.targetStatusId = null;

                            if (!$rootScope.isDefined($scope.vm.sourceStatusId)) {
                                return;
                            }

                            var excludeIds = [];

                            angular.forEach($scope.vm.issueStatusVos, function (issueStatus) {
                                //  선택한 노드가 있을 때
                                if ($scope.vm.sourceStatusId == issueStatus.id) {
                                    angular.forEach(issueStatus.workflowTransitionVos, function (workflowTransition) {
                                        excludeIds.push(workflowTransition.targetStatusId);
                                    });
                                }
                            });

                            //  현재 선택한 대상도 제외대상에 추가
                            excludeIds.push($scope.vm.sourceStatusId);

                            angular.forEach($scope.vm.issueStatusVos, function (issueStatus) {
                                var notAvailable = false;

                                for (var count in excludeIds) {
                                    if (excludeIds[count] == issueStatus.id) {
                                        notAvailable = true;
                                        break;
                                    }
                                }

                                if (!notAvailable) {
                                    $scope.vm.targetIssueStatusList.push(issueStatus);
                                }
                            });

                            $scope.vm.targetIssueStatusList.sort(function (a, b) {
                                return a.name > b.name ? 1 : 0
                            });
                        }

                        //  다이어그램안에 상태 속성 '대기'인 이슈 상태가 존재하는지 확인한다.
                        function checkReadyType(addIssueStatusId) {
                            var addIssueStatus = null;

                            for (var count in $scope.vm.issueStatuses) {
                                if ($scope.vm.issueStatuses[count].id == addIssueStatusId) {
                                    addIssueStatus = $scope.vm.issueStatuses[count];
                                    break;
                                }
                            }

                            $log.debug("$scope.vm.issueStatuses 확인 : ", $scope.vm.issueStatuses);
                            $log.debug("$scope.vm.issueStatusVos 확인 : ", $scope.vm.issueStatusVos);
                            $log.debug("addIssueStatusId 확인 : ", addIssueStatusId);
                            $log.debug("addIssueStatus 확인 : ", addIssueStatus);

                            //  추가하려는 이슈 상태의 상태 속성 확인
                            if ($rootScope.isDefined(addIssueStatus)) {
                                if (addIssueStatus.issueStatusType === "READY") {
                                    var readyCount = 0;

                                    angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                        if (issueStatusVo.issueStatusType === "READY") {
                                            readyCount++;
                                        }
                                    });

                                    $log.debug("readyCount 확인 : ", readyCount);

                                    if (readyCount > 0) {
                                        return false;
                                    }
                                }
                            }

                            return true;
                        }

                        //  이슈 상태의 색상 정보를 가져온다
                        function getOptionColor(list, id) {
                            var color = "#353535";  //  기본색은 검은색.

                            for (var count in list) {
                                if (String(list[count].id) === id) {
                                    color = list[count].color;
                                    break;
                                }
                            }

                            return color;
                        }


                        //  이슈 상태를 다이어그램에 추가한다.
                        function addStatus() {
                            if ($rootScope.isDefined($scope.vm.addIssueStatusId)) {
                                //  클라이언트 변경 사항 $scope.vm.issueStatusVos 에 저장
                                $scope.fn.updateClientChangePosition();

                                //  상태 속성이 대기인 이슈 상태가 이미 존재할 경우에는 상태를 넣을 수 없어야 한다.
                                if (!$scope.fn.checkReadyType($scope.vm.addIssueStatusId)) {
                                    SweetAlert.error($filter("translate")("managementWorkflow.failedToPutIssueStatus"), $filter("translate")("managementWorkflow.onlyOneInTheWorkflow")); // "이슈 상태 넣기 실패", "워크플로우에는 상태 속성 '대기'인 이슈는 1개만 존재해야 합니다."
                                    return;
                                }

                                //  추가할 이슈 상태를 넣는다.
                                for (var count in $scope.vm.issueStatuses) {
                                    var issueStatus = $scope.vm.issueStatuses[count];

                                    if (issueStatus.id == $scope.vm.addIssueStatusId) {
                                        issueStatus.workflowTransitionVos = [];
                                        issueStatus.xLocation = Math.random() * ($scope.vm.width - 50);
                                        issueStatus.yLocation = Math.random() * ($scope.vm.height - 50);

                                        $scope.vm.issueStatusVos.push(issueStatus);

                                        // 담당 부서 추가
                                        addWorkflowDepartment(issueStatus);
                                        break;
                                    }
                                }
                                //  이슈 상태를 추가하면 시작점을 초기화해준다. -> 종점 업데이트를 위해
                                $scope.vm.sourceStatusId = null;

                                $scope.fn.defaultAddIssueStatusId();
                                $scope.fn.startDiagram();


                            }
                        }

                        //  이슈 상태를 제거한다.
                        function removeIssueStatus(targetIssueStatus) {
                            $scope.fn.initCircleColor(null, true);  //  전체 노드 색상 초기화

                            var tempWorkflowStatusVos = [];

                            //  삭제 대상 상태 제거
                            angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                if (issueStatusVo.id != targetIssueStatus.id) {
                                    $scope.fn.setLastStatusPosition(issueStatusVo);
                                    tempWorkflowStatusVos.push(issueStatusVo);
                                }
                            });

                            $scope.vm.issueStatusVos = angular.copy(tempWorkflowStatusVos);

                            //  삭제 대상 상태 정보를 갖고있는 전이 제거
                            angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                var tempWorkflowTransitionVos = [];

                                angular.forEach(issueStatusVo.workflowTransitionVos, function (workflowTransition) {
                                    if (workflowTransition.sourceStatusId != targetIssueStatus.id && workflowTransition.targetStatusId != targetIssueStatus.id) {
                                        //  보정 값 업데이트 하기
                                        for (var count in $scope.vm.links) {
                                            if ($scope.vm.links[count].id == workflowTransition.id) {
                                                $scope.fn.setLastTransitionPosition(workflowTransition, count);
                                                break;
                                            }
                                        }

                                        tempWorkflowTransitionVos.push(workflowTransition);
                                    }
                                });

                                issueStatusVo.workflowTransitionVos = tempWorkflowTransitionVos;
                            });

                            //  선택 대상 정보 초기화
                            $scope.vm.activeTarget = null;

                            //  클라이언트 변경 사항 $scope.vm.issueStatusVos 에 저장
                            $scope.fn.updateClientChangePosition();

                            $scope.fn.startDiagram();

                            removeWorkflowDepartment(targetIssueStatus);
                        }

                        //  전이선을 다이어그램에 추가한다.
                        function addTransition() {
                            if (!$rootScope.isDefined($scope.vm.targetStatusId)) {
                                return;
                            }

                            //  클라이언트 변경 사항 $scope.vm.issueStatusVos 에 저장
                            $scope.fn.updateClientChangePosition();

                            var insertWorkflowTransition = {
                                id : $scope.fn.generatorTransitionId(),
                                sourceStatusId : "",
                                sourceStatusName : "",
                                targetStatusId : "",
                                targetStatusName : "",
                                correctX : null,
                                correctY : null,
                                direct : false,
                                type : "02",
                                colorClass : "linkBlue",
                                workflowTransition : null
                            };

                            //  source, target 이름 추출
                            for (var count in $scope.vm.issueStatusVos) {
                                var issueStatus = $scope.vm.issueStatusVos[count];

                                if ($scope.vm.sourceStatusId == issueStatus.id) {
                                    insertWorkflowTransition.sourceStatusId = issueStatus.id;
                                    insertWorkflowTransition.sourceStatusName = issueStatus.name;
                                }

                                if ($scope.vm.targetStatusId == issueStatus.id) {
                                    insertWorkflowTransition.targetStatusId = issueStatus.id;
                                    insertWorkflowTransition.targetStatusName = issueStatus.name;
                                }
                            }

                            for (var count in $scope.vm.issueStatusVos) {
                                var issueStatus = $scope.vm.issueStatusVos[count];

                                if ($scope.vm.sourceStatusId == issueStatus.id) {
                                    issueStatus.workflowTransitionVos.push(insertWorkflowTransition);

                                    $scope.vm.sourceStatusId = null;
                                    $scope.vm.targetStatusId = null;

                                    $scope.fn.startDiagram();
                                    break;
                                }
                            }
                        }

                        //  전이선을 삭제한다.
                        function removeWorkflowTransition(targetWorkflowTransition) {
                            $scope.fn.initLinkColor(null, true);    //  전이선 색상 전체 초기화

                            //  삭제 대상 전이 제거
                            angular.forEach($scope.vm.issueStatusVos, function (issueStatus) {
                                var tempWorkflowTransitionVos = [];

                                issueStatus.xLocation = $scope.vm.nodes[issueStatus.name].x;
                                issueStatus.yLocation = $scope.vm.nodes[issueStatus.name].y;

                                angular.forEach(issueStatus.workflowTransitionVos, function (workflowTransition) {

                                    if (workflowTransition.id != targetWorkflowTransition.id) {
                                        //  보정 값 업데이트 하기
                                        for (var count in $scope.vm.links) {
                                            if ($scope.vm.links[count].id == workflowTransition.id) {
                                                workflowTransition.correctX = $scope.vm.links[count].correctX;
                                                workflowTransition.correctY = $scope.vm.links[count].correctY;
                                                workflowTransition.direct = $scope.vm.links[count].direct;
                                                break;
                                            }
                                        }

                                        tempWorkflowTransitionVos.push(workflowTransition);
                                    }
                                });

                                issueStatus.workflowTransitionVos = tempWorkflowTransitionVos;
                            });

                            //  선택 대상 정보 초기화
                            $scope.vm.activeTarget = null;

                            //  클라이언트 변경 사항 $scope.vm.issueStatusVos 에 저장
                            $scope.fn.updateClientChangePosition();

                            $scope.fn.startDiagram();
                        }

                        //  고립된 이슈 상태가 없는 워크플로우인지 확인한다. - 고립되었을 경우에는 저장 금지
                        function checkIsolationWorkflowAndExceptionGenerate() {
                            var firstCheck = false;
                            var middleCheck = false;
                            var lastCheck = true;
                            var connectCheck = false;    //  source/target 연결 찾을 경우 값 변경
                            var transitionList = [];

                            //  전체 전이선을 추출한다.
                            angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                angular.forEach(issueStatusVo.workflowTransitionVos, function (workflowTransition) {
                                    transitionList.push(workflowTransition);
                                });
                            });

                            //  시작 상태 정상 확인
                            angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {

                                switch (issueStatusVo.issueStatusType) {
                                    case "READY" :
                                        for (var count in transitionList) {
                                            if (transitionList[count].sourceStatusId == issueStatusVo.id) {
                                                firstCheck = true;
                                                break;
                                            }
                                        }
                                        break;

                                    case "OPEN" :
                                        var normalSourceCheck = false;  //  일반 상태일 때 source 연결 여부 확인
                                        var normalTargetCheck = false;  //  일반 상태일 때 target 연결 여부 확인
                                        middleCheck = true;

                                        for (var count in transitionList) {
                                            if (transitionList[count].sourceStatusId == issueStatusVo.id) {
                                                normalSourceCheck = true;
                                            }

                                            if (transitionList[count].targetStatusId == issueStatusVo.id) {
                                                normalTargetCheck = true;
                                            }
                                        }

                                        if (!normalSourceCheck || !normalTargetCheck) {
                                            connectCheck = true;
                                        }
                                        break;

                                    case "CLOSE" :
                                        //  '종료'인 상태에 다른 상태가 있는지 확인
                                        //  한번도 없는걸 찾는다.

                                        //  이번 상태를 타겟으로 하는 전이선 정보가 있는지 확인한다.
                                        //  있으면 그냥 통과
                                        //  없으면 문제 발생
                                        var tempLastCheck = false;

                                        for (var count in transitionList) {
                                            if (transitionList[count].targetStatusId == issueStatusVo.id) {
                                                tempLastCheck = true;
                                                break;
                                            }
                                        }
                                        //  없으면 문제 발생
                                        if (!tempLastCheck) {
                                            lastCheck = false;
                                        }

                                        break;
                                }
                            });

                            //  고립된 상태가 존재하는지 확인한다.
                            if (!firstCheck || !middleCheck || !lastCheck || connectCheck) {
                                $scope.isolationWorkflow = true;
                            }
                            else {
                                $scope.isolationWorkflow = false;
                            }
                        }

                        //  상태 속성 별로 1개씩 존재하는지 확인한다. - 부족할 경우 저장 금지
                        function checkRequireIssueStatusTypeExceptionGenerate() {
                            $scope.firstStatusExist = true;
                            $scope.middleStatusExist = true;
                            $scope.lastStatusExist = true;

                            angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                switch (issueStatusVo.issueStatusType) {
                                    case "READY" :
                                        $scope.firstStatusExist = false;
                                        break;
                                    case "OPEN" :
                                        $scope.middleStatusExist = false;
                                        break;
                                    case "CLOSE" :
                                        $scope.lastStatusExist = false;
                                        break;
                                }
                            });
                        }

                        //  전체 이슈 상태를 가져온다.
                        function getIssueStatusList() {
                            $scope.vm.issueStatuses = [];

                            IssueStatus.findAll($resourceProvider.getContent({},
                                $resourceProvider.getPageContent(0, 0))).then(function (result) {

                                if (result.data.message.status === "success") {
                                    angular.forEach(result.data.data, function (issueStatus) {
                                        var exist = false;

                                        for (var count in $scope.vm.issueStatusVos) {
                                            if ($scope.vm.issueStatusVos[count].id == issueStatus.id) {
                                                exist = true;
                                                break;
                                            }
                                        }

                                        if (!exist) {
                                            switch (issueStatus.issueStatusType) {
                                                case 'READY' :
                                                    issueStatus.issueStatusTypeKr = '대기'
                                                    break;
                                                case 'OPEN' :
                                                    issueStatus.issueStatusTypeKr = '진행'
                                                    break;
                                                case 'CLOSE' :
                                                    issueStatus.issueStatusTypeKr = '종료'
                                                    break;
                                            }
                                            $scope.vm.issueStatuses.push(issueStatus);
                                        }
                                    });

                                    //  이슈 상태 추가 셀렉트 박스에서 첫번째 옵션 항목을 기본 선택되게 한다.
                                    $scope.fn.defaultAddIssueStatusId();
                                }
                                else {
                                    SweetAlert.error($filter("translate")("common.failedToIssueStatusListLookup"), result.data.message.message); // "이슈 상태 목록 조회 실패"
                                }
                            });
                        }

                        //  노드 색상을 초기화한다.
                        function initCircleColor(target, all) {
                            d3.selectAll("circle").each(function () {
                                var circle = d3.select(this)[0][0]["__data__"];

                                if (all) {
                                    d3.select(this).style("fill", circle.originalColor);
                                }
                                else {
                                    if (circle.id != target.id) {
                                        d3.select(this).style("fill", circle.originalColor);
                                    }
                                }
                            });
                        }

                        //  전이선 색상을 초기화한다.
                        function initLinkColor(target, all) {
                            d3.selectAll(".link").each(function () {
                                var link = d3.select(this)[0][0]["__data__"];

                                //  전체 초기화일경우
                                if (all) {
                                    d3.select(this).classed("linkGreen", false);
                                    d3.select(this).classed(link.colorClass, true);
                                }
                                else {
                                    if (link.id != target.id) {
                                        d3.select(this).classed("linkGreen", false);
                                        d3.select(this).classed(link.colorClass, true);
                                    }
                                }

                                d3.select(this).attr("marker-end", "url(#licensing)");
                            });
                        }

                        // function  getWorkflowDepartments() {
                        //     $scope.vm.departments = [];
                        //
                        //     if ($scope.vm.activeTarget != null) {
                        //         return issueStatus.workflowDepartments;
                        //     }
                        //     return null;
                        // }

                        // 담당부서 설정
                        function setWorkflowDepartment(targetIssueStatus) {
                            if (targetIssueStatus != null) {
                                angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                    if (issueStatusVo.id === targetIssueStatus.id) {
                                        $scope.vm.departmentName = issueStatusVo.workflowDepartmentName;
                                        $scope.vm.departments = [];
                                        angular.forEach(issueStatusVo.workflowDepartmentVos, function (workflowDepartment) {
                                            $scope.vm.departments.push(workflowDepartment.departmentVo);
                                        });
                                    }
                                });
                            }
                        }

                        //  선택 한 부서 제거
                        function removeDepartment(index) {
                            if (index < $scope.vm.departments.length) {
                                $scope.vm.departments.splice(index, 1);
                                changeDepartment();
                            }
                        }

                        function changeDepartment() {
                            if ($scope.vm.activeTarget != null) {
                                var targetIssueStatus = $scope.vm.activeTarget.issueStatus;

                                // null 체크
                                if (targetIssueStatus != null) {
                                    var myIssueStatus = null;
                                    angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                        if (issueStatusVo.id === targetIssueStatus.id) {
                                            myIssueStatus = issueStatusVo;
                                        }
                                    });

                                    if (myIssueStatus != null) {
                                        if ($scope.vm.departments != null) {
                                            var workflowDepartments = [];

                                            angular.forEach($scope.vm.departments, function (department) {
                                                var workflowDepartment = {
                                                    departmentVo : department
                                                }
                                                workflowDepartments.push(workflowDepartment);
                                            });
                                            myIssueStatus.workflowDepartmentVos = workflowDepartments;
                                        }
                                    }
                                }
                            }
                        }

                        // 담당부서 추가
                        function addWorkflowDepartment(targetIssueStatus)
                        {
                            if ($scope.departments != null && $scope.departments.length > 0) {
                                var workflowDepartmentVos = [];
                                angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo) {
                                    if (issueStatusVo.id === targetIssueStatus.id) {
                                        var issueStatusWorkflowDepartments = {
                                            workflowDepartmentVos : workflowDepartmentVos,
                                            workflowDepartmentName : ""
                                        }
                                        issueStatusVo = Object.assign(issueStatusVo, issueStatusWorkflowDepartments);
                                    }
                                });
                            }
                        }

                        // 담당부서 삭제
                        function removeWorkflowDepartment(targetIssueStatus)
                        {
                            if ($scope.vm.workflowDepartmentVos != null && $scope.vm.workflowDepartmentVos.length > 0) {
                                $scope.vm.workflowDepartmentVos = $scope.vm.workflowDepartmentVos.filter((el) => el.issueStatus.id === targetIssueStatus.id);
                            }
                        }

                        //  타겟을 클릭했을 때 색상을 변경한다.
                        //  담당 부서를 불러온다
                        function targetClick(target) {
                            $scope.vm.activeTarget = angular.copy(target[0][0]["__data__"]);

                            setWorkflowDepartment($scope.vm.activeTarget.issueStatus);
                            // node 일경우
                            if ($scope.vm.activeTarget.type == "01") {
                                //  노드, 링크 전체 초기화
                                $scope.fn.initCircleColor($scope.vm.activeTarget, false);
                                $scope.fn.initLinkColor(null, true);

                                //  대상 노드 색 변경
                                target.style("fill", "#1DDB16");
                            }
                            else if ($scope.vm.activeTarget.type == "02") {
                                //  노드, 링크 전체 초기화
                                $scope.fn.initCircleColor(null, true);
                                $scope.fn.initLinkColor($scope.vm.activeTarget, false);
                                //  대상 링크 색 변경
                                target.classed("linkGreen", true);
                                target.classed($scope.vm.activeTarget.colorClass, false);
                                target.attr("marker-end", "url(#greenLicensing)");
                            }

                            if ($scope.$root.$$phase != '$apply' && $scope.$root.$$phase != '$digest') {
                                $scope.$apply();
                            }
                        }

                        //  다이어그램에서 도형을 움직일 때 실행
                        function tick() {
                            //IE mark bug fix
                            $scope.vm.link.each(function () {
                                this.parentNode.insertBefore(this, this);
                            });

                            $scope.vm.link.attr("d", function (d) {
                                //svg 영역 내에 표시
                                if (d.target.x > $scope.vm.width) {
                                    d.target.x = ($scope.vm.width - 31);
                                }
                                else if (d.target.x < 30) {
                                    d.target.x = 30;
                                }

                                if (d.source.x > $scope.vm.width) {
                                    d.source.x = ($scope.vm.width - 31);
                                }
                                else if (d.source.x < 30) {
                                    d.source.x = 30;
                                }

                                if (d.target.y > $scope.vm.height) {
                                    d.target.y = ($scope.vm.height - 31);
                                }
                                else if (d.target.y < 30) {
                                    d.target.y = 30;
                                }

                                if (d.source.y > $scope.vm.height) {
                                    d.source.y = ($scope.vm.height - 31);
                                }
                                else if (d.source.y < 30) {
                                    d.source.y = 30;
                                }

                                if (d.correctX == null) {
                                    d.correctX = d.source.x;
                                }

                                if (d.correctY == null) {
                                    d.correctY = d.source.y;
                                }

                                //  직선화 유지 상태 일 경우
                                if (d.direct) {
                                    d.correctX = d.source.x;
                                    d.correctY = d.source.y;
                                }

                                return "M" + d.source.x + "," + d.source.y + " Q" + d.correctX + ", " + d.correctY + " " + d.target.x + ", " + d.target.y;
                            });

                            $scope.vm.node.attr("transform", function (d) {
                                if (d.x > $scope.vm.width) {
                                    d.x = ($scope.vm.width - 31);
                                }
                                else if (d.x < 30) {
                                    d.x = 30;
                                }

                                if (d.y > $scope.vm.height) {
                                    d.y = ($scope.vm.height - 31);
                                }
                                else if (d.y < 30) {
                                    d.y = 30;
                                }

                                return "translate(" + d.x + "," + d.y + ")";
                            });

                            $scope.vm.nodeTexts.attr("transform", function (d) {
                                return "translate(" + d.x + "," + d.y + ")";
                            });

                            //  on 이벤트가 과다하게 발생하는 현상을 방지
                            $scope.vm.force.stop();
                        }

                        //  노드를 만든다.
                        function makeNode(issueStatus, sXLocation, sYLocation) {
                            var xLocation = 0;
                            var yLocation = 0;
                            var color = "FAED7D";

                            //  x좌표
                            if (issueStatus.xLocation == 0 || issueStatus.xLocation == null) {
                                xLocation = sXLocation;
                            }
                            else {
                                xLocation = issueStatus.xLocation;
                            }
                            //  y좌표
                            if (issueStatus.yLocation == 0 || issueStatus.yLocation == null) {
                                yLocation = sYLocation;
                            }
                            else {
                                yLocation = issueStatus.yLocation;
                            }

                            if (issueStatus.color != null) {
                                color = issueStatus.color;
                            }

                            return {
                                id : issueStatus.id,
                                name : issueStatus.name,
                                x : xLocation,
                                y : yLocation,
                                color : color,
                                issueStatusType : issueStatus.issueStatusType,
                                originalColor : issueStatus.color,
                                fixed : true,
                                type : "01",     //  수정 모드시 구분
                                issueStatus : issueStatus
                            }
                        }

                        //  전이선을 만든다.
                        function makeLink(workflowTransition) {
                            return {
                                id : workflowTransition.id,
                                source : workflowTransition.sourceStatusName,
                                target : workflowTransition.targetStatusName,
                                correctX : workflowTransition.correctX,
                                correctY : workflowTransition.correctY,
                                direct : workflowTransition.direct,
                                type : "02",
                                colorClass : "linkBlue",
                                workflowTransition : workflowTransition
                            }
                        }


                        //  1. 서버에서 데이터가 내려올때 사용된 이슈 상태 전체 목록과 각 이슈 상태의 전이선 정보가 내려와야 한다.

                        //  노드와 링크 정보를 생성한다.
                        function makeNodeAndLink() {
                            $scope.vm.nodes = [];  //  원 정보 모음
                            $scope.vm.links = [];  //  링크 정보 모음

                            var startX = 50;    //  새로운 도형의 X축 위치
                            var startY = 50;    //  새로운 도형의 Y축 위치

                            //  노드와 링크 정보를 만든다.
                            angular.forEach($scope.vm.issueStatusVos, function (issueStatusVo, index) {
                                $scope.vm.nodes[issueStatusVo.name] = $scope.fn.makeNode(issueStatusVo, startX, startY);

                                angular.forEach(issueStatusVo.workflowTransitionVos, function (workflowTransition) {
                                    $scope.vm.links.push($scope.fn.makeLink(workflowTransition));
                                });

                                //  기본 좌표가 없을 경우 계속 60씩 증가
                                startX += 60;

                                if (index % 2 == 0) {
                                    startY += 30;
                                }
                                else {
                                    startY += 30;
                                }
                            });

                            angular.forEach($scope.vm.links, function (link) {
                                if (link.source == $scope.vm.nodes[link.source].name) {
                                    link.source = $scope.vm.nodes[link.source];
                                }

                                if (link.target == $scope.vm.nodes[link.target].name) {
                                    link.target = $scope.vm.nodes[link.target];
                                }
                            });
                        }

                        //  기초 레이아웃을 설정한다.
                        function initializeLayout() {
                            $scope.vm.svg = d3.select("#svgContent")
                                .append("svg")
                                .attr("width", $scope.vm.width)
                                .attr("height", $scope.vm.height);

                            $scope.vm.rect = $scope.vm.svg.append("rect")
                                .attr("width", $scope.vm.width)
                                .attr("height", $scope.vm.height)
                                .attr("fill", "white")
                                .on("click", function (d) {
                                    //  원 색상 초기화
                                    $scope.fn.initCircleColor(null, true);
                                    //  링크 색상 초기화
                                    $scope.fn.initLinkColor(null, true);
                                    //  현재 선택한 대상 정보
                                    $scope.vm.activeTarget = null;

                                    if ($scope.$root.$$phase != '$apply' && $scope.$root.$$phase != '$digest') {
                                        $scope.$apply();
                                    }
                                });
                        }

                        //  드래그 이벤트 생성
                        function makeDragEvent() {
                            //  드래그
                            $scope.vm.drag = d3.behavior.drag().on("drag", function (d) {
                                d.direct = false;    //  링크 드래그시 직선화 유지 해제
                                d.correctX += d3.event.dx;
                                d.correctY += d3.event.dy;

                                $scope.fn.tick();
                            });
                        }

                        //  표시되는 선을 생성한다.
                        function makeGridLine() {
                            //  기본 표시되는 선
                            $scope.vm.svg.append("marker")
                                .attr("orient", "auto")
                                .attr("markerHeight", 4)
                                .attr("markerWidth", 4)
                                .attr("refX", 18)
                                .attr("viewBox", "0 -5 10 10")
                                .attr("id", "licensing")
                                .append("path")
                                .attr("d", function () {
                                    return "M0,-5 L10,0 L0,5";
                                });

                            //  선을 눌러서 활성화되었을때
                            $scope.vm.svg.append("marker")
                                .attr("orient", "auto")
                                .attr("markerHeight", 5)
                                .attr("markerWidth", 5)
                                .attr("refX", 16)
                                .attr("viewBox", "0 -5 10 10")
                                .attr("id", "greenLicensing")
                                .append("path")
                                .attr("d", function () {
                                    return "M0,-5 L10,0 L0,5";
                                });
                        }

                        //  포스 레이아웃 실행
                        function executeForce() {
                            $scope.vm.force = d3.layout.force()
                                .nodes(d3.values($scope.vm.nodes))
                                .links($scope.vm.links)
                                .size([$scope.vm.width, $scope.vm.height])
                                .on("tick", $scope.fn.tick)
                                .start();
                        }

                        //  링크를 셋팅한다.
                        function setLink() {
                            var linkMenu = [{
                                title : $filter("translate")("managementWorkflow.removeMetastaticLine"), // 전이선 제거
                                action : function (element) {
                                    $scope.fn.removeWorkflowTransition(d3.select(element)[0][0]);
                                }
                            }];

                            $scope.vm.link = $scope.vm.svg.append("svg:g")
                                .selectAll(".link")
                                .data($scope.vm.force.links())
                                .enter()
                                .append("path")
                                .attr("class", function (d) {
                                    return "link " + d.colorClass;
                                })
                                .attr("id", function (d, i) {
                                    return "link_" + i;
                                })
                                .attr("marker-end", function (d) {
                                    return "url(#licensing)";
                                })
                                .attr("cursor", "pointer")
                                .on("contextmenu", d3.contextMenu(linkMenu))
                                .on("click", function () {
                                    $scope.fn.targetClick(d3.select(this));
                                });
                        }

                        //  노드를 셋팅한다.
                        function setNode() {
                            var nodeMenu = [{
                                title : $filter("translate")("managementWorkflow.removeIssueStatus"), // "이슈 상태 제거"
                                action : function (element) {
                                    $scope.fn.removeIssueStatus(d3.select(element)[0][0]);
                                    //  이슈 상태가 제거되었을 때 시작점, 종점 초기화를 위해서..
                                    $scope.vm.sourceStatusId = null;
                                    $scope.fn.getAvailableNextStatus();
                                }
                            }];

                            $scope.vm.node = $scope.vm.svg.append("svg:g")
                                .selectAll("circle")
                                .data($scope.vm.force.nodes())
                                .enter()
                                .append("circle")
                                .attr("class", "node")
                                .style("fill", function (d) {
                                    return d.color;
                                })
                                .style("cursor", "pointer")
                                .attr("r", 15)
                                .on("contextmenu", d3.contextMenu(nodeMenu))
                                .on("click", function () {
                                    $scope.fn.targetClick(d3.select(this));
                                });
                        }

                        //  노드 텍스트를 셋팅한다.
                        function setNodeTexts() {
                            $scope.vm.nodeTexts = $scope.vm.svg.append("svg:g")
                                .selectAll("text")
                                .data($scope.vm.force.nodes())
                                .enter()
                                .append("text")
                                .attr("class", "label")
                                .attr("fill", "black")
                                .attr("dy", 30)
                                .style("font-size", "12px")
                                .style("text-anchor", "middle")
                                .text(function (d) {
                                    var name = "";
                                    if (d.name != null) {
                                        if (d.name.length > 10) {
                                            name = d.name.substring(0, 10) + "...";
                                        }
                                        else {
                                            name = d.name;
                                        }
                                    }

                                    return name;
                                });
                        }

                        //  워크플로우 계획 다이어그램을 그린다.
                        function forceLayout() {
                            $scope.fn.initializeLayout($scope.vm.width, $scope.vm.height);
                            $scope.fn.makeNodeAndLink();
                            $scope.fn.makeDragEvent();
                            $scope.fn.makeGridLine();
                            $scope.fn.executeForce($scope.vm.width, $scope.vm.height);
                            $scope.fn.setLink();
                            $scope.fn.setNode();
                            $scope.fn.setNodeTexts();

                            $scope.vm.link.call($scope.vm.drag);
                            $scope.vm.node.call($scope.vm.force.drag);

                        }


                    },
                    link : function (scope, element, attrs) {

                    }
                }
            }])
    });