1 node_element = require './node_element'
2 NodeElement = node_element.NodeElement
4 util = require './util'
5 html_escape = util.html_escape
11 class ElementsRenderer
12 constructor: (tree_widget) ->
13 @tree_widget = tree_widget
15 @opened_icon_element = @createButtonElement(tree_widget.options.openedIcon)
16 @closed_icon_element = @createButtonElement(tree_widget.options.closedIcon)
18 render: (from_node) ->
19 if from_node and from_node.parent
20 @renderFromNode(from_node)
25 $element = @tree_widget.element
28 @createDomElements($element[0], @tree_widget.tree.children, true, true, 1)
30 renderFromNode: (node) ->
32 $previous_li = $(node.element)
35 li = @createLi(node, node.getLevel())
36 @attachNodeData(node, li)
39 $previous_li.after(li)
46 @createDomElements(li, node.children, false, false, node.getLevel() + 1)
48 createDomElements: (element, children, is_root_node, is_open, level) ->
49 ul = @createUl(is_root_node)
50 element.appendChild(ul)
53 li = @createLi(child, level)
56 @attachNodeData(child, li)
58 if child.hasChildren()
59 @createDomElements(li, child.children, false, child.is_open, level + 1)
63 attachNodeData: (node, li) ->
65 $(li).data('node', node)
67 createUl: (is_root_node) ->
72 class_string = 'jqtree-tree'
75 if @tree_widget.options.rtl
76 class_string += ' jqtree-rtl'
78 ul = document.createElement('ul')
79 ul.className = "jqtree_common #{ class_string }"
81 ul.setAttribute('role', role)
85 createLi: (node, level) ->
86 is_selected = @tree_widget.select_node_handler and @tree_widget.select_node_handler.isNodeSelected(node)
89 li = @createFolderLi(node, level, is_selected)
91 li = @createNodeLi(node, level, is_selected)
93 if @tree_widget.options.onCreateLi
94 @tree_widget.options.onCreateLi(node, $(li))
98 createFolderLi: (node, level, is_selected) ->
99 button_classes = @getButtonClasses(node)
100 folder_classes = @getFolderClasses(node, is_selected)
103 icon_element = @opened_icon_element
105 icon_element = @closed_icon_element
108 li = document.createElement('li')
109 li.className = "jqtree_common #{ folder_classes }"
110 li.setAttribute('role', 'presentation')
113 div = document.createElement('div')
114 div.className = "jqtree-element jqtree_common"
115 div.setAttribute('role', 'presentation')
120 button_link = document.createElement('a')
121 button_link.className = button_classes
123 button_link.appendChild(
124 icon_element.cloneNode(false)
127 button_link.setAttribute('role', 'presentation')
128 button_link.setAttribute('aria-hidden', 'true')
130 if @tree_widget.options.buttonLeft
131 div.appendChild(button_link)
135 @createTitleSpan(node.name, level, is_selected, node.is_open, is_folder=true)
138 if not @tree_widget.options.buttonLeft
139 div.appendChild(button_link)
143 createNodeLi: (node, level, is_selected) ->
144 li_classes = ['jqtree_common']
147 li_classes.push('jqtree-selected')
149 class_string = li_classes.join(' ')
152 li = document.createElement('li')
153 li.className = class_string
154 li.setAttribute('role', 'presentation')
157 div = document.createElement('div')
158 div.className = "jqtree-element jqtree_common"
159 div.setAttribute('role', 'presentation')
165 @createTitleSpan(node.name, level, is_selected, node.is_open, is_folder=false)
170 createTitleSpan: (node_name, level, is_selected, is_open, is_folder) ->
171 title_span = document.createElement('span')
173 classes = "jqtree-title jqtree_common"
176 classes += " jqtree-title-folder"
178 title_span.className = classes
180 title_span.setAttribute('role', 'treeitem')
181 title_span.setAttribute('aria-level', level)
183 title_span.setAttribute('aria-selected', util.getBoolString(is_selected))
184 title_span.setAttribute('aria-expanded', util.getBoolString(is_open))
187 title_span.setAttribute('tabindex', 0)
189 title_span.innerHTML = @escapeIfNecessary(node_name)
193 getButtonClasses: (node) ->
194 classes = ['jqtree-toggler', 'jqtree_common']
197 classes.push('jqtree-closed')
199 if @tree_widget.options.buttonLeft
200 classes.push('jqtree-toggler-left')
202 classes.push('jqtree-toggler-right')
204 return classes.join(' ')
206 getFolderClasses: (node, is_selected) ->
207 classes = ['jqtree-folder']
210 classes.push('jqtree-closed')
213 classes.push('jqtree-selected')
216 classes.push('jqtree-loading')
218 return classes.join(' ')
220 escapeIfNecessary: (value) ->
221 if @tree_widget.options.autoEscape
222 return html_escape(value)
226 createButtonElement: (value) ->
227 if typeof value == 'string'
228 # convert value to html
229 div = document.createElement('div')
230 div.innerHTML = value
232 return document.createTextNode(div.innerHTML)
237 module.exports = ElementsRenderer