Improve loading of table rows in editor

This commit is contained in:
Peter Stuifzand 2020-10-25 15:37:03 +01:00
parent 6c9b82493e
commit dd7ba5ec11

View File

@ -142,7 +142,7 @@ function renderGraphs() {
})
}
function createElement(tag, children) {
function el(tag, children = []) {
let el = document.createElement(tag)
_.each(children, item => {
el.appendChild(item)
@ -158,7 +158,7 @@ function Editor(holder, input) {
MD.options.html = true
let rendered = MD.renderInline(cellText)
let span = $("<span>"+rendered+"</span>")
let span = $("<span>" + rendered + "</span>")
MD.options.html = false
return span[0];
}
@ -175,45 +175,41 @@ function Editor(holder, input) {
editor.treeForId(id).then(tree => {
let [header, rows] = tree[0].children
let rowData = _.map(rows.children, row => {
let page = row.text.substring(2).substring(0, row.text.length-4)
return fetch('/'+page+'?format=metakv')
let page = row.text.substring(2).substring(0, row.text.length - 4)
return fetch('/' + page + '?format=metakv')
.then(res => res.json())
.then(res => [page, res.meta])
.then(res => res.meta)
.then(rowData => {
return el("tr", [
el("td", [renderInline(row.text)]),
..._.map(header.children, col => {
let td = el("td")
this.transform(rowData[_.snakeCase(_.trim(col.text))], $(td), id, editor)
return td
})
])
})
})
// FIXME: don't wait for promises here, but at the end
Promise.all(rowData).then(res => {
return _.fromPairs(res)
}).then(data => {
return createElement("table", [
createElement("thead", [
createElement("tr", [
createElement("th", [
document.createTextNode("Title")
]),
..._.map(header.children, col => {
return createElement("th", [
document.createTextNode(col.text)
])
})
]
),
]),
createElement("tbody",
_.map(rows.children, row => {
let page = row.text.substring(2).substring(0, row.text.length-4)
return createElement("tr", [
createElement("td", [renderInline(row.text)]),
..._.map(header.children, col => {
let td = createElement("td", []);
this.transform(data[page][col.text.toLowerCase()], $(td), id, editor)
return td
})
])
})
)
])
}).then(table => element.html(table))
Promise.all(rowData)
.then(trs => {
return el("table", [
el("thead", [
el("tr", [
el("th", [
document.createTextNode("Title")
]),
..._.map(header.children, col => {
return el("th", [
document.createTextNode(col.text)
])
})
]
),
]),
el("tbody", trs)
])
}).then(table => element.html(table))
})
return
} else if (converted.startsWith("```", 0) || converted.startsWith("$$", 0)) {