peter/wiki
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Build newItem with createElement
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Peter Stuifzand 2020-10-31 23:29:01 +01:00
parent cdc7f1a30c
commit b4a9077c9c
1 changed files with 28 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
list-editor/index.js
View File

@ -162,18 +162,36 @@ function editor(root, inputData, options) {
} }
function newItem(value) { function newItem(value) {
let el = $('<div class="list-item">') let el = document.createElement('div')
.attr('data-id', value.id) el.classList.add('list-item')
.data('indented', value.indented) el.setAttribute('data-id', value.id)
.css('margin-left', (value.indented * 32) + 'px') el.style.marginLeft = (value.indented * 32) + 'px'
let line = $('<div class="line">')
let content = $('<div class="content">') let $el = $(el).data('indented', value.indented)
let line = document.createElement('div')
line.classList.add('line')
let content = document.createElement('div')
content.classList.add('content')
line.prepend(content) line.prepend(content)
options.transform(value.text, content, value.id, EDITOR)
line.prepend($('<span class="marker"></span>')) options.transform(value.text, $(content), value.id, EDITOR)
line.prepend($('<span class="fold">&#9654;</span>'))
let marker = document.createElement('span')
marker.classList.add('marker')
let fold = document.createElement('span')
fold.classList.add('fold')
fold.innerHTML = '&#9654;'
line.prepend(marker)
line.prepend(fold)
el.prepend(line) el.prepend(line)
return el;
return $el;
} }
// TODO: build an actual tree of list items // TODO: build an actual tree of list items