wip change to pages
bel
parent
1fcd1e28dc
commit
aff325960f
|
|
@ -0,0 +1,19 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<header>
|
||||||
|
<title>{{ .Title }}</title>
|
||||||
|
{{ template "imports" . }}
|
||||||
|
</header>
|
||||||
|
<body class="lr_fullscreen tb_fullscreen" onload="init(); return false;">
|
||||||
|
<br>
|
||||||
|
<div class="rows">
|
||||||
|
{{ template "searchbar" . }}
|
||||||
|
<div class="columns thic_flex tb_buffer">
|
||||||
|
{{ template "filetree" . }}
|
||||||
|
<div class="thic_flex lr_fullscreen" style="margin-left: 1em; width: 5px;">
|
||||||
|
{{ template "editor" . }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,170 @@
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.css">
|
||||||
|
<style>
|
||||||
|
.EasyMDEContainer button {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
}
|
||||||
|
.monospace {
|
||||||
|
font-family: Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
|
||||||
|
}
|
||||||
|
.lil_btn {
|
||||||
|
width: initial;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
input, label, textarea {
|
||||||
|
margin: initial;
|
||||||
|
}
|
||||||
|
.editor-toolbar > button.preview {
|
||||||
|
color: #08c;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script>
|
||||||
|
function deleteFile() {
|
||||||
|
if (!confirm("would you like to delete this file?"))
|
||||||
|
return
|
||||||
|
const id = easyMDE.meta.id
|
||||||
|
if (!id || id.length == 0)
|
||||||
|
return
|
||||||
|
http("DELETE", "/api/v0/files/" + id, (body, status) => {
|
||||||
|
if (status != 200) {
|
||||||
|
alert(`failed to delete file ${id}: ${status}: ${body}`)
|
||||||
|
throw `failed to delete file ${id}: ${status}: ${body}`
|
||||||
|
}
|
||||||
|
drawTree()
|
||||||
|
var pid = id.slice(0, id.lastIndexOf("/"))
|
||||||
|
if (pid) {
|
||||||
|
drawFile(pid)
|
||||||
|
} else {
|
||||||
|
disableMDE()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
var saveFeedbackInterval = null
|
||||||
|
function pushFile() {
|
||||||
|
const title = document.getElementById("title").innerHTML ? document.getElementById("title").innerHTML : ""
|
||||||
|
const body = easyMDE.value() ? easyMDE.value() : ""
|
||||||
|
const id = easyMDE.meta.id ? easyMDE.meta.id : ""
|
||||||
|
headers = {}
|
||||||
|
if (title)
|
||||||
|
headers["Title"] = title
|
||||||
|
http("PUT", "/api/v0/files/" + id, (body, status) => {
|
||||||
|
if (status != 200) {
|
||||||
|
alert(`failed to push file ${id}: ${status}: ${body}`)
|
||||||
|
throw `failed to push file ${id}: ${status}: ${body}`
|
||||||
|
}
|
||||||
|
drawTree()
|
||||||
|
//drawFile(id)
|
||||||
|
document.getElementById("saveFeedback").innerHTML = "success!"
|
||||||
|
if (saveFeedbackInterval) {
|
||||||
|
clearTimeout(saveFeedbackInterval)
|
||||||
|
}
|
||||||
|
saveFeedbackInterval = setTimeout(() => {document.getElementById("saveFeedback").innerHTML = ""}, 5000)
|
||||||
|
}, body, headers)
|
||||||
|
}
|
||||||
|
|
||||||
|
function drawFile(id) {
|
||||||
|
if (!id || id.length < 1) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
http("GET", "/api/v0/files/"+id, (body, status, headers) => {
|
||||||
|
if (status != 200) {
|
||||||
|
throw `ERR loading file: ${status}: ${body}`
|
||||||
|
}
|
||||||
|
const title = headers("title") ? headers("title") : ""
|
||||||
|
setMDE(id, title, body)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function drawNewFile(pid) {
|
||||||
|
setMDE(pid + "/" + crypto.randomUUID().substr(0, 5), "", "")
|
||||||
|
if (easyMDE.isPreviewActive()) {
|
||||||
|
easyMDE.togglePreview()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function enableMDE() {
|
||||||
|
document.getElementById("searchResults").className = "mia";
|
||||||
|
document.getElementById("article").className = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
function disableMDE() {
|
||||||
|
document.getElementById("article").className = "mia";
|
||||||
|
document.getElementById("searchResults").className = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
var liveLeafTimeout = null
|
||||||
|
|
||||||
|
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 i = 0; i < pids.length; i++) {
|
||||||
|
const fullPid = pids.slice(0, i+1)
|
||||||
|
titlePath = `/ <input type="button" class="lil_btn" value="${idsToTitle(fullPid)}" onclick="drawFile('${fullPid.join("/")}');"/> /`
|
||||||
|
}
|
||||||
|
if (pids.length > 1) {
|
||||||
|
titlePath = "/ ... "+titlePath
|
||||||
|
}
|
||||||
|
|
||||||
|
enableMDE()
|
||||||
|
document.getElementById("titlePath").innerHTML = titlePath
|
||||||
|
document.getElementById("title").innerHTML = title
|
||||||
|
easyMDE.value(body)
|
||||||
|
easyMDE.meta = {
|
||||||
|
id: id,
|
||||||
|
}
|
||||||
|
if (!easyMDE.isPreviewActive()) {
|
||||||
|
easyMDE.togglePreview()
|
||||||
|
var previews = document.getElementsByClassName("preview")
|
||||||
|
}
|
||||||
|
const previouslyHighlighted = document.getElementsByClassName("live_leaf")
|
||||||
|
for (var i in previouslyHighlighted)
|
||||||
|
if (previouslyHighlighted && previouslyHighlighted[i] && previouslyHighlighted[i].classList)
|
||||||
|
previouslyHighlighted[i].classList.remove("live_leaf")
|
||||||
|
if (liveLeafTimeout)
|
||||||
|
clearTimeout(liveLeafTimeout)
|
||||||
|
liveLeafTimeout = setTimeout(() => {
|
||||||
|
const toHighlight = document.getElementsByClassName(btoa("/"+id))
|
||||||
|
for (var i = 0; i < toHighlight.length; i++) {
|
||||||
|
if (toHighlight && toHighlight[i] && toHighlight[i].classList)
|
||||||
|
toHighlight[i].classList.add("live_leaf")
|
||||||
|
}
|
||||||
|
}, 100)
|
||||||
|
navigateToQuery("f", id)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<article id="article">
|
||||||
|
<h1 class="columns">
|
||||||
|
<span class="r_buffer">
|
||||||
|
<form action="#" onsubmit="pushFile(); return false;"> <!-- TODO -->
|
||||||
|
<input class="button-info lil_btn" type="submit" value="SAVE"/>
|
||||||
|
</form>
|
||||||
|
</span>
|
||||||
|
<span id="titlePath">
|
||||||
|
{{ if ne .PID "" }}
|
||||||
|
<a href="/ui/files/{{ .PID }}">{{ .PTitle }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</span>
|
||||||
|
<span id="title" class="thic_flex" contenteditable>{{ .Title }}</span>
|
||||||
|
<span class="l_buffer">
|
||||||
|
<form action="#" onsubmit="return confirm('are you sure?') && deleteFile();"> <!-- TODO -->
|
||||||
|
<input class="button-error lil_btn" type="submit" value="DELETE"/>
|
||||||
|
</form>
|
||||||
|
</span>
|
||||||
|
</h1>
|
||||||
|
<div id="saveFeedback" style="min-height: 1.2em; text-align: right;">
|
||||||
|
</div>
|
||||||
|
<!-- todo: each line no is an anchor -->
|
||||||
|
<div class="monospace">
|
||||||
|
<textarea id="my-text-area"></textarea>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
@ -0,0 +1,6 @@
|
||||||
|
<div>
|
||||||
|
<!-- TODO {{ .Branches }} -->
|
||||||
|
{{ range $key, $value := .Branches }}
|
||||||
|
<!-- TODO {{ $key }}{{ $value }} -->
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.css">
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.js"></script>
|
||||||
|
<script src="https://cdn.jsdelivr.net/highlight.js/latest/highlight.min.js"></script>
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/highlight.js/latest/styles/github.min.css">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/turretcss/dist/turretcss.min.css" crossorigin="anonymous">
|
||||||
|
<!-- todo css
|
||||||
|
<link rel="stylesheet" href="https://cdn.concisecss.com/concise.min.css">
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/light.css">
|
||||||
|
<link rel="stylesheet" href="https://cdn.simplecss.org/simple.min.css">
|
||||||
|
-->
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
<form class="columns" action="/ui/search" method="GET">
|
||||||
|
<input class="thic_flex" type="text" name="searchbox" placeholder="space delimited search regexp"/>
|
||||||
|
<input class="info lil_btn" type="submit" value="search"/>
|
||||||
|
</form>
|
||||||
Loading…
Reference in New Issue