// (2020.12.29, 차재복, Cha Jae Bok, cjbword@gmailcom)
// DOM tree element 내 셋팅 정보
// ol : class = tree, type = (word,file,manual,db_table 4종), id = (subtree 산하 children의 fetch를 위한 id)
// li : child = (자식 노드 수), id = (현재 id)
// bullet : class = bullet (이벤트), class = nobullet
// name : class = title
// colon : class = colon
// desc : class = desc
function src_files(current) {
// let out = current.nextElementSibling;
let type = current.dataset.type;
let out = document.createElement('ol');
// 이미 데이터 가져왔었으면, show/hide(toggle)
if(out.hasChildNodes()) {
if(getComputedStyle(out).getPropertyValue('display') == 'block') out.style.display = 'none';
else out.style.display = 'block';
return;
}
// 데이터 가져오기 및 ol 생성
fetchDataCreateOl(out);
}
function fetchDataCreateOl(out) {
// ajax promise 호출 (서버로부터 데이터 가져오기)
let id = out.dataset.id;
let type = out.dataset.type;
// let sub_type = out.dataset.sub_type;
// let url = '../navigation/naviFetch.php?type='+type+'&sub_type='+sub_type+'&id='+id;
let url = '../navigation/naviFetch.php?type='+type+'&id='+id;
let method = 'get';
ajaxPromise(url, method) // common_utils.js
// 가져온 결과에 대한 데이터 가공
.then(
response => {
// (개발,디버깅중)
// console.log(response.data);
if(response.err_msg) alert(response.err_msg);
let ol = ol_create(response.data, type, id);
out.appendChild(ol);
out.style.display = 'block';
},
error => {
alert(error);
}
);
}
function ol_create(childrenData, type, id) {
// childrenData[i] : (parent, id, name, child)
// type = (word,file,manual,table 4종)
// ol 생성
let ol = document.createElement('ol');
ol.setAttribute('class','tree');
ol.dataset.id = id;
// 현재 생성된 ol 하에 li 요소들 생성
for(let index in childrenData) {
// li 생성
let li = li_create(childrenData[index], type);
/*
// http query 내 해당 id 존재하면, 펼쳐짐
const cur_id = li.dataset.id, child = li.dataset.child;
if(glob_var.path2node && glob_var.path2node.includes(cur_id) && child > 0) {
li.firstElementChild.innerText = '▽';
subtree_create (cur_id, li);
}
*/
// ol 요소에 매 li 마다 자식 노드로 붙임
ol.appendChild(li);
}
return ol;
}
function li_create(liData, type) {
// liData : (parent, id, name, child)
// type = (word,file,manual,table 4종)
// 필드 구분 : bullet, name, (name_type 추가 구상중), colon, desc, moreShow, edit
// li 생성
let li = document.createElement('li');
li.dataset.type = type;
li.dataset.id = liData.id;
// bullet span 생성
let bullet = document.createElement('span');
if(liData.child > 0) {
bullet.setAttribute('class','bullet');
bullet.innerHTML = '▷';
} else {
bullet.setAttribute('class','nobullet');
bullet.innerHTML = '▷';
}
li.appendChild(bullet);
// name span 생성
let name = document.createElement('span');
name.setAttribute('class','title');
let text = document.createTextNode(liData.name);
name.appendChild(text);
li.appendChild(name);
// colon span 생성
let colon = document.createElement('span');
colon.setAttribute('class','colon');
if(liData.desc) colon.innerHTML = ' : ';
else colon.innerHTML = ' ';
li.appendChild(colon);
// desc span 생성
let desc = document.createElement('span');
desc.setAttribute('class','desc');
if(liData.desc) desc.innerHTML = liData.desc;
else desc.innerHTML = '';
li.appendChild(desc);
// moreShow
moreShow(li, liData, type); // navi_base_moreShow.js
// edit
if(glob_var.user_type == '종합관리자') {
let btn = itemEdit(li, liData, type); // navi_base_edit.js
li.appendChild(btn);
}
// li 내 특정 요소(span.bullet)에 이벤트 생성
event4li(li);
return li;
}
function event4li(li) {
// bullet 요소에 이벤트 설정함
let bullet = li.querySelector('span.bullet');
if(!bullet) return;
bullet.addEventListener('click', function(e) {
// child ol
let childOl = this.parentNode.querySelector('ol.tree');
if (this.innerText == '▷') {
this.innerText = '▽';
// 자식 ol 이미 생성되었으면 단지 보이게 만 함
if (childOl) childOl.style.display = 'block';
// 자식 ol 생성 안되었으면 생성시킴
else fetchDataCreateOl(li);
} else if (this.innerText == '▽') {
this.innerText = '▷';
childOl.style.display = 'none';
}
});
}