ui seemingly not a total mess at least
parent
bb02ec7ada
commit
8b566d32f8
|
|
@ -55,15 +55,12 @@
|
||||||
const title = document.getElementById("title").innerHTML ? document.getElementById("title").innerHTML : ""
|
const title = document.getElementById("title").innerHTML ? document.getElementById("title").innerHTML : ""
|
||||||
const body = easyMDE.value() ? easyMDE.value() : ""
|
const body = easyMDE.value() ? easyMDE.value() : ""
|
||||||
const id = easyMDE.meta.id ? easyMDE.meta.id : ""
|
const id = easyMDE.meta.id ? easyMDE.meta.id : ""
|
||||||
const pid = easyMDE.meta.pid ? easyMDE.meta.pid : ""
|
|
||||||
var method = "PUT"
|
var method = "PUT"
|
||||||
if (id == "")
|
if (id == "")
|
||||||
method = "POST"
|
method = "POST"
|
||||||
headers = {}
|
headers = {}
|
||||||
if (title)
|
if (title)
|
||||||
headers["Title"] = title
|
headers["Title"] = title
|
||||||
if (pid)
|
|
||||||
headers["Pid"] = pid
|
|
||||||
http(method, "/api/v0/files" + (id == "" ? "" : "/"+id), (body, status) => {
|
http(method, "/api/v0/files" + (id == "" ? "" : "/"+id), (body, status) => {
|
||||||
console.log(status, body)
|
console.log(status, body)
|
||||||
alert("todo")
|
alert("todo")
|
||||||
|
|
@ -76,40 +73,44 @@
|
||||||
}
|
}
|
||||||
http("GET", "/api/v0/files/"+id, (body, status, headers) => {
|
http("GET", "/api/v0/files/"+id, (body, status, headers) => {
|
||||||
if (status != 200) {
|
if (status != 200) {
|
||||||
throw Exception(`ERR loading file: ${status}: ${body}`)
|
raise `ERR loading file: ${status}: ${body}`
|
||||||
}
|
}
|
||||||
const pid = headers("pid") ? headers("pid") : ""
|
|
||||||
const title = headers("title") ? headers("title") : ""
|
const title = headers("title") ? headers("title") : ""
|
||||||
setMDE(id, pid, title, body)
|
setMDE(id, title, body)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
function drawNewFile(pid) {
|
function drawNewFile(pid) {
|
||||||
setMDE("", pid, "", "")
|
setMDE(pid + "/" + crypto.randomUUID().substr(0, 5), "", "")
|
||||||
}
|
|
||||||
function setMDE(id, pid, title, body) {
|
|
||||||
alert("TODO: set title as attr for prettier here")
|
|
||||||
document.getElementById("titlePath").innerHTML = `${pid ? "... / " : ""}<a href="#?f=${pid}"><input type="button" value="${pid}" onclick="drawFile('${pid}');"></a> / `
|
|
||||||
if (pid == "") {
|
|
||||||
document.getElementById("titlePath").innerHTML = "/"
|
|
||||||
}
|
}
|
||||||
|
function setMDE(id, title, body) {
|
||||||
|
if (id[0] == "/")
|
||||||
|
id = id.slice(1, id.length)
|
||||||
|
if (id[id.length-1] == "/")
|
||||||
|
id = id.slice(0, id.length-1)
|
||||||
|
var pids = id.split("/")
|
||||||
|
pids = pids.slice(0, pids.length-1)
|
||||||
|
|
||||||
|
var titlePath = "/"
|
||||||
|
for (var pid in pids)
|
||||||
|
titlePath += ` <a href="#?f=${pids[pid]}"><input type="button" value="${pids[pid]}" onclick="drawFile('${pids[pid]}');"/></a> /`
|
||||||
|
|
||||||
|
document.getElementById("titlePath").innerHTML = titlePath
|
||||||
document.getElementById("title").innerHTML = title
|
document.getElementById("title").innerHTML = title
|
||||||
easyMDE.value(body)
|
easyMDE.value(body)
|
||||||
easyMDE.meta = {
|
easyMDE.meta = {
|
||||||
id: id,
|
id: id,
|
||||||
pid: pid,
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function drawTree() {
|
function drawTree() {
|
||||||
function htmlifyBranch(pid, id, branch) {
|
function htmlifyBranch(id, branch) {
|
||||||
/* TODO width limit title */
|
|
||||||
var children = ""
|
var children = ""
|
||||||
for (var child in branch.Children)
|
for (var child in branch.Branches)
|
||||||
children += "\n" + htmlifyBranch(id, child, branch.Children[child])
|
children += "\n" + htmlifyBranch(id + "/" + child, branch.Branches[child])
|
||||||
return `
|
return `
|
||||||
<details open>
|
<details open>
|
||||||
<summary>
|
<summary>
|
||||||
<div>
|
<div>
|
||||||
<a href="#?f=${id}"><input type="button" value="${branch.Title}" onclick="drawFile('${id}');"/></a>
|
<a href="#?f=${id}"><input type="button" value="${branch.Leaf.Title.substr(0, 15)}" onclick="drawFile('${id}');"/></a>
|
||||||
<input type="button" value="+" onclick="drawNewFile('${id}');"/>
|
<input type="button" value="+" onclick="drawNewFile('${id}');"/>
|
||||||
</div>
|
</div>
|
||||||
</summary>
|
</summary>
|
||||||
|
|
@ -117,17 +118,11 @@
|
||||||
</details>
|
</details>
|
||||||
`
|
`
|
||||||
}
|
}
|
||||||
http("GET", "/api/v0/tree?pretty", (body, _) => {
|
http("GET", "/api/v0/tree", (body, status) => {
|
||||||
|
if (status != 200)
|
||||||
|
raise `bad status getting tree: ${status}: ${body}`
|
||||||
const tree = JSON.parse(body)
|
const tree = JSON.parse(body)
|
||||||
var innerHTML = ""
|
document.getElementById("tree").innerHTML = htmlifyBranch("", tree)
|
||||||
for(var id in tree) {
|
|
||||||
innerHTML += htmlifyBranch("", id, tree[id])
|
|
||||||
}
|
|
||||||
innerHTML = htmlifyBranch("", "", {
|
|
||||||
Title: "Files",
|
|
||||||
Children: {},
|
|
||||||
}).replace("</summary>", "</summary>"+innerHTML)
|
|
||||||
document.getElementById("tree").innerHTML = innerHTML
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
function http(method, remote, callback, body, headers) {
|
function http(method, remote, callback, body, headers) {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue