// add node with redrawing
var firstAddedIds = tree.add({text:'FE development team1'}, parentId);
console.log(firstAddedIds); // ["tui-tree-node-10"]

// add node without redrawing
var secondAddedIds = tree.add([
   {text: 'FE development team2'},
   {text: 'FE development team3'}
], parentId, true);
console.log(secondAddedIds); // ["tui-tree-node-11", "tui-tree-node-12"]

tree.changeContextMenu([
     {title: 'menu1'},
     {title: 'menu2', disable: true},
     {title: 'menu3', menu: [
         {title: 'submenu1', disable: true},
         {title: 'submenu2'}
     ]}
]);

var nodeId = 'tui-tree-node-3';
tree.check(nodeId);

tree.close(nodeId, true);

tree.createChildNode('tui-tree-node-1');

tree.deselect('tui-tree-node-3');

tree
 .disableFeature('Selectable')
 .disableFeature('Draggable')
 .disableFeature('Editable')
 .disableFeature('Checkbox')
 .disableFeature('ContextMenu')
 .disableFeature('Ajax');

tree.each(function(node, nodeId) {
    console.log(node.getId() === nodeId); // true
}, parentId);

tree.eachAll(function(node, nodeId) {
    console.log(node.getId() === nodeId); // true
});

tree.editNode('tui-tree-node-1');

tree
 .enableFeature('Selectable', {
     selectedClassName: 'tui-tree-selected'
 })
 .enableFeature('Editable', {
     editableClassName: tree.classNames.textClass,
     dataKey: 'text',
     defaultValue: 'new node',
     inputClassName: 'myInput'
 })
 .enableFeature('Draggable', {
     useHelper: true,
     helperPos: {x: 5, y: 2},
     rejectedTagNames: ['UL', 'INPUT', 'BUTTON'],
     rejectedClassNames: ['notDraggable', 'notDraggable-2'],
     autoOpenDelay: 1500,
     isSortable: true,
     hoverClassName: 'tui-tree-hover'
     lineClassName: 'tui-tree-line',
     lineBoundary: {
         top: 10,
         bottom: 10
     }
 })
 .enableFeature('Checkbox', {
     checkboxClassName: 'tui-tree-checkbox'
 })
 .enableFeature('ContextMenu', {
     menuData: [
         {title: 'menu1', command: 'copy'},
         {title: 'menu2', command: 'paste'},
         {separator: true},
         {
             title: 'menu3',
             menu: [
                 {title: 'submenu1'},
                 {title: 'submenu2'}
             ]
         }
     }
 })
 .enableFeature('Ajax', {
     command: {
         read: {
             url: 'api/read',
             contentType: 'application/json',
             method: 'GET'
         },
         create: {
             url: 'api/create',
             contentType: 'application/json',
             method: 'POST'
         },
         update: {
             url: 'api/update',
             contentType: 'application/json',
             method: 'POST',
             params: {
                 paramA: 'a',
                 paramB: 'b'
             }
         },
         remove: {
             url: 'api/remove',
             contentType: 'application/json',
             method: 'POST',
             params: function(evt) {
                 return {
                     paramA: evt.a,
                     paramB: evt.b
                 };
             }
         },
         removeAllChildren: {
             url: function(evt) {
                 return 'api/remove_all/' + evt.nodeId,
             },
             contentType: 'application/json',
             method: 'POST'
         },
         move: {
             url: 'api/move',
             contentType: 'application/json',
             method: 'POST'
         }
     },
     parseData: function(command, responseData) {
         if (responseData) {
             return responseData;
         } else {
             return false;
         }
     }
 });

tree.finishEditing();

var allBottomCheckedList = tree.getBottomCheckedList(); // ['node2', 'node3', 'node5', 'node8']
var descendantsBottomCheckedList = tree.getBottomCheekedList('node6'); // ['node8']

// ├─ node1 (v)
// │  ├─ node2 (v)
// │  └─ node3 (v)
// ├─ node4 ( )
// │  └─ node5 (v)
// └─ node6 ( )
//    ├─ node7 (v)
//    │  └─ node8 (v)
//    └─ node9 ( )

var allCheckedList = tree.getCheckedList(); // ['node1', 'node2', 'node3' ,....]
var descendantsCheckedList = tree.getCheekedList('node6'); // ['node7', 'node8']

tree.getNodeIdFromElement(elementInNode); // 'tui-tree-node-3'

tree.getNodeIdPrefix(); // 'tui-tree-node-'

tree.getState(nodeId); // 'opened', 'closed',
                       // undefined if the node is nonexistent

// ├─ node1 (v)
// │  ├─ node2 (v)
// │  └─ node3 (v)
// ├─ node4 ( )
// │  └─ node5 (v)
// └─ node6 ( )
//    ├─ node7 (v)
//    │  └─ node8 (v)
//    └─ node9 ( )

var allTopCheckedList = tree.getTopCheckedList(); // ['node1', 'node5', 'node7']
var descendantsTopCheckedList = tree.getTopCheekedList('node6'); // ['node7']

var nodeId = 'tui-tree-node-3';
tree.check(nodeId);
console.log(tree.isChecked(nodeId)); // true

var nodeId = 'tui-tree-node-3';
tree.check(nodeId);
console.log(tree.isIndeterminate(nodeId)); // false

var nodeId = 'tui-tree-node-3';
tree.uncheck(nodeId);
console.log(tree.isUnchecked(nodeId)); // true

tree.move(myNodeId, newParentId); // mode node with redrawing
tree.move(myNodeId, newParentId, true); // move node without redrawing

tree.open(nodeId ,true);

tree.remove(myNodeId); // remove node with redrawing
tree.remove(myNodeId, true); // remove node without redrawing

tree.removeAllChildren(nodeId); // Redraws the node
tree.removeAllChildren(nodId, true); // Doesn't redraw the node

tree.setNodeData(nodeId, 'foo'); // auto refresh
tree.setNodeData(nodeId, 'foo', true); // not refresh

tree.resetAllData([
 {text: 'hello', children: [
     {text: 'foo'},
     {text: 'bar'}
 ]},
 {text: 'world'}
]);
tree.resetAllData([
 {text: 'hello world'}
], {
 nodeId: 'tui-tree-node-5',
 useAjax: true
});

// search from predicate
var leafNodeIds = tree.search(function(node, nodeId) {
    return node.isLeaf();
});
console.log(leafNodeIds); // ['tui-tree-node-3', 'tui-tree-node-5']

// search from data
var specialNodeIds = tree.search({
    isSpecial: true,
    foo: 'bar'
});
console.log(specialNodeIds); // ['tui-tree-node-5', 'tui-tree-node-10']
console.log(tree.getNodeData('tui-tree-node-5').isSpecial); // true
console.log(tree.getNodeData('tui-tree-node-5').foo); // 'bar'

tree.select('tui-tree-node-3');

var comparator = function(nodeA, nodeB) {
    var aValue = nodeA.getData('text'),
        bValue = nodeB.getData('text');

    if (!bValue || !bValue.localeCompare) {
        return 0;
    }
    return bValue.localeCompare(aValue);
};

// Sort with redrawing tree
tree.sort(comparator);

// Sort, but not redraw tree
tree.sort(comparator, true);

// Sort partially
tree.sort(comparator, false, parentId)

var nodeId = 'tui-tree-node-3';
tree.toggleCheck(nodeId);

var nodeId = 'tui-tree-node-3';
tree.uncheck(nodeId);

tree.on('afterDraw', function(evt) {
    if (tree.isMovingNode) {
        console.log('isMovingNode');
    }
    console.log('afterDraw: ' + evt.nodeId);
});

tree.on('beforeAjaxRequest', function(evt) {
    console.log('before ' + evt.command + ' request!');
    return false; // It cancels request
    // return true; // It fires request
});

tree
 .enableFeature('Editable')
 .on('beforeCreateChildNode', function(evt) {
     console.log(evt.value);
     console.log(evt.nodeId);
     console.log(evt.cause);
     return false; // It cancels
     // return true; // It execute next
 });

tree.on('beforeDraw', function(evt) {
    if (tree.isMovingNode) {
        console.log('isMovingNode');
    }
    console.log('beforeDraw: ' + evt.nodeId);
});

tree
 .enableFeature('Editable')
 .on('beforeEditNode', function(evt) {
     console.log(evt.value);
     console.log(evt.nodeId);
     console.log(evt.cause);
     return false; // It cancels
     // return true; // It execute next
 });

tree.on('beforeMove', function(evt) {
     console.log('dragging node: ' + evt.nodeId);
     console.log('new parent node: ' + evt.newParentId);
     console.log('original parent node: ' + tree.getParentId(evt.nodeId));

     return false; // Cancel "move" event
     // return true; // Fire "move" event
});

tree.on('beforeOpenContextMenu', function(evt) {
    console.log('nodeId: ' + evt.nodeId);
});

tree
 .enableFeature('Selectable')
 .on('beforeSelect', function(evt) {
     console.log('selected node: ' + evt.nodeId);
     console.log('previous selected node: ' + evt.prevNodeId);
     console.log('target element: ' + evt.target);
     return false; // It cancels "select"
     // return true; // It fires "select"
 });

tree.on('check', function(evt) {
    console.log('checked: ' + evt.nodeId);
});

tree.on('clickToggleBtn', function(evt) {
    console.log(evt.target);
});

tree
 .enableFeature('Selectable')
 .on('deselect', function(evt) {
     console.log('deselected node: ' + evt.nodeId);
 });

tree.on('errorAjaxResponse', function(evt) {
    console.log(evt.command + ' response is error!');
});

tree.on('failAjaxResponse', function(evt) {
    console.log(evt.command + ' response is fail!');
});

tree.on('move', function(evt) {
    var nodeId = evt.nodeId;
    var originalParentId = evt.originalParentId;
    var newParentId = evt.newParentId;
    var index = evt.index;

    console.log(nodeId, originalParentId, newParentId, index);
});

tree
 .enableFeature('Selectable')
 .on('select', function(evt) {
     console.log('selected node: ' + evt.nodeId);
     console.log('previous selected node: ' + evt.prevNodeId);
     console.log('target element: ' + evt.target);
 });

tree.on('selectContextMenu', function(evt) {
    var command = treeEvent.command; // key of context menu's data
    var nodeId = treeEvent.nodeId;

    console.log(evt.command, evt.nodeId);
});

tree.on('successAjaxResponse', function(evt) {
    console.log(evt.command + ' response is success!');
    if (data) {
          console.log('data:' + evt.data);
    }
});

tree.on('uncheck', function(evt) {
    console.log('unchecked: ' + evt.nodeId);
});