diff --git a/remix-debugger/src/ui/TreeView.js b/remix-debugger/src/ui/TreeView.js index d137d8261b..8765e75d13 100644 --- a/remix-debugger/src/ui/TreeView.js +++ b/remix-debugger/src/ui/TreeView.js @@ -46,6 +46,8 @@ class TreeView { this.view = null this.nodeIsExpanded = {} this.nodes = {} + this.labels = {} + this.carets = {} } render (json) { @@ -91,13 +93,11 @@ class TreeView { var isExpanded = self.nodeIsExpanded[keyPath] var list = yo`` this.nodes[keyPath] = list - list.style.display = isExpanded !== undefined ? (isExpanded ? 'block' : 'none') : (expand ? 'block' : 'none') + this.labels[keyPath] = label + this.carets[keyPath] = caret caret.className = list.style.display === 'none' ? 'fa fa-caret-right' : 'fa fa-caret-down' label.onclick = function () { - caret.className = caret.className === 'fa fa-caret-right' ? 'fa fa-caret-down' : 'fa fa-caret-right' - list.style.display = list.style.display === 'none' ? 'block' : 'none' - self.nodeIsExpanded[keyPath] = list.style.display === 'block' - self.event.trigger('nodeClick', [keyPath, list]) + self.expand(keyPath) } li.appendChild(list) } else { @@ -106,6 +106,14 @@ class TreeView { return li } + expand (path) { + if (this.labels[path]) { + this.carets[path].className = this.carets[path].className === 'fa fa-caret-right' ? 'fa fa-caret-down' : 'fa fa-caret-right' + this.nodes[path].style.display = this.nodes[path].style.display === 'none' ? 'block' : 'none' + this.event.trigger('nodeClick', [path, this.nodes[path]]) + } + } + nodeAt (path) { return this.nodes[path] }