001
002
003
004
005
006
007
008
009
010
011
012
013
014
015
016
017
018
019
020
021
022
023
024
025
026
027
028
029
030
031
032
033
034
035
036
037
038
039
040
041
042
043
044
045
046
047
048
049
050
051
052
053
054
055
056
057
058
059
060
061
062
063
064
065
066
067
068
069
070
071
072
073
074
075
076
077
078
079
080
081
082
083
084
085
086
087
088
089
090
091
092
093
094
095
096
097
098
099
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127

// (2022.8.29, 차재복, Cha Jae Bok, http://www.ktword.co.kr)

// 노드 이동용 버튼 생성
// 호출 : [navi_base_edit.js] treeEdit()

function moveBtnShow (li, parentSpan, choice) {

        // 부모 수준 상승 버튼
        const leftBtn = document.createElement('button');
            editBtnAllStyle(leftBtn,'←');                           // navi_base_edit.js
        parentSpan.appendChild(leftBtn);
        // 형제 수준 앞으로 이동
        const upBtn = document.createElement('button');
            editBtnAllStyle(upBtn,'↑');                             // navi_base_edit.js
            upBtn.addEventListener('click', function(e) {
                // 기존 confirm 버튼 없을 때, confirm 버튼 생성
                if(!li.querySelector('.confirm'))
                    confirmBtnCreate(li, parentSpan, choice);        // navi_edit_move.js
                // 앞쪽 형제 여부 왁인 후, 교체
                if(li.previousElementSibling) 
                    li.parentNode.insertBefore(li,li.previousElementSibling);
                else alert('맨 앞입니다');
            });
        parentSpan.appendChild(upBtn);
        // 형제 수준 뒤로 이동
        const downBtn = document.createElement('button');
            editBtnAllStyle(downBtn,'↓');                           // navi_base_edit.js
            downBtn.addEventListener('click', function(e) {
                // 기존 confirm 버튼 없을 때, confirm 버튼 생성
                if(!li.querySelector('.confirm')) 
                    confirmBtnCreate(li, parentSpan, choice);       // navi_edit_move.js
                if(li.nextElementSibling) insertAfter(li.nextElementSibling,li);
                else alert('맨 끝입니다');
            });
        parentSpan.appendChild(downBtn);
        // 자식 수준 하강 버튼
        const rightBtn = document.createElement('button');
            editBtnAllStyle(rightBtn,'→');                          // navi_base_edit.js
        parentSpan.appendChild(rightBtn);

}


// 기능 : 이동 확정 confirm 버튼 생성
// 호출 : [navi_base_edit.js] moveBtnShow(li,parentSpan,choice)

function confirmBtnCreate(li, parentSpan, choice) {

    // 기존 열린 confirm 버튼들 제거, 기존 li 외곽선 제거, 원래 위치로 이동
//    const topLi = document.querySelector("li[data-type='source']");
//    const topLi = document.querySelector("li[data-type='word']");
    const topLi = li;
    const confirmButtons = topLi.querySelectorAll('.confirm');
    if(confirmButtons)
        confirmButtons.forEach( elem => { 
            const li = elem.closest('li');
            li.style.border = '';
            const parent = topLi.querySelector("ol[data-id='"+li.dataset.oldParentId+"']")
            const reference = topLi.querySelector("li[data-id='"+li.dataset.oldNextId+"']")
//            parent.insertBefore(li,reference)
            elem.remove();
        });

    // li 요소 스타일링
    li.style.border = '2px red solid';

    // 원래parent,원래직후id 기록
    li.dataset.oldParentId = li.dataset.parent;
    li.dataset.oldNextId = li.nextElementSibling ? li.nextElementSibling.dataset.id : null ;


    const confirmBtn = document.createElement('button');
        confirmBtn.setAttribute('class','confirm');
        // 스타일링
        editBtnAllStyle(confirmBtn,'Confirm','red');                // navi_base_edit.js
        // 이벤트리스너
        confirmBtn.addEventListener('click', function(e) {
            const type = this.closest('li').dataset.type;
            const currentId = this.closest('li').dataset.id;
            const currentNo = this.closest('li').dataset.no;
            const currentParentId = this.closest('li').parentNode.closest('li').dataset.id;
            const oldParentId = li.dataset.oldParentId;
            const oldNextId = li.dataset.oldNextId;

                // { type, choice, parent id, 'seq_matched' : {sequence # : id} }
                let i=1;
                let obj = { 'type' : type, 'choice' : choice, 'id' : currentParentId };
                let seq_matched_obj = {};
                const children = this.closest('ol').childNodes;
                children.forEach( elem => {
                    seq_matched_obj[i] = elem.dataset.id;
                    i = i + 1;
                });
                obj['seq_matched'] = seq_matched_obj; 

                const sendData = JSON.stringify(obj);

            const isConfirm = confirm('현재parent:'+currentParentId
                                    +',현재id:'+currentId+',현재no:'+currentNo
                                    +',원래parent:'+oldParentId+',원래직후id:'+oldNextId
                                    +'\n'+sendData);
            if(!isConfirm) return;

            const parms = { 'json' : true, 'obj' : obj};
            const url = '/test/navigation/naviUpdate_JSON.php';
            const method = 'post';
            ajaxPromise(url, method, parms)                  // common_utils.js
            .then(
                response => {
                    // (개발,디버깅중)
                    if(response.err_msg) alert(response.err_msg);

//                    console.log(response.query,'\n',response.typeStr,'\n',response.varStr,'\n',response.bind_stmt);
//                    alert('서버 응답');

                    li.style.border = '';
                    confirmBtn.remove();
                },
                error => {
                    alert(error);
                }
            );
        });

    insertAfter(parentSpan,confirmBtn);                     // common_utils.js
}