SandpointsEditPage/src/App.svelte

102 lines
3.2 KiB
Svelte

<script>
import { onMount } from 'svelte';
let v = "loading...";
let path = "loading...";
function generateFrontMatter(frontmatter, path, relpermalink, protocol) {
let dvm = document.querySelector('form')
var hiddenRelPath = document.createElement('input')
hiddenRelPath.setAttribute('type', 'hidden')
hiddenRelPath.setAttribute('name', 'relpermalink')
hiddenRelPath.value = relpermalink
dvm.prepend(hiddenRelPath)
var hiddenPath = document.createElement('input')
hiddenPath.setAttribute('type', 'hidden')
hiddenPath.setAttribute('name', 'relpath')
hiddenPath.value = path
dvm.prepend(hiddenPath)
var hiddenProtocol = document.createElement('input')
hiddenProtocol.setAttribute('type', 'hidden')
hiddenProtocol.setAttribute('name', 'protocol')
hiddenProtocol.value = protocol
dvm.prepend(hiddenProtocol)
Object.keys(frontmatter).forEach((fm)=>{
if (Array.isArray(frontmatter[fm])) {
console.log("Array:", frontmatter[fm])
frontmatter[fm].reverse().forEach((i)=>{
var input = document.createElement('input')
input.setAttribute('type', 'text')
input.setAttribute('name', `${fm}[]`)
input.value = i
dvm.prepend(input)
})
let label = document.createElement('label')
label.setAttribute('for', `${fm}[]`)
label.innerHTML = fm + ": "
dvm.prepend(label)
} else {
var input = document.createElement('input')
console.log(fm, frontmatter[fm])
let l = true
if (["draft", "iscjklanguage"].includes(fm)){
if (frontmatter[fm] == false) {
input.setAttribute('type', 'hidden')
l = false
} else {
input.setAttribute('type', 'text')
}
}
input.setAttribute('name', fm)
input.value = frontmatter[fm]
dvm.prepend(input)
if (l == true) {
let label = document.createElement('label')
label.setAttribute('for', fm)
label.innerHTML = fm + ": "
dvm.prepend(label)
}
}
})
}
function dispatchHash() {
var el = document.createElement('script');
el.onload = ()=> {
console.log("loading...")
v = repo.content;
if (v.startsWith("\n")) {
v = v.substring(1)
}
path = repo.path;
console.log(JSON.stringify(repo))
generateFrontMatter(repo.frontmatter, path, repo.relpermalink, document.location.protocol.substring(0,4))
}
el.src = `../js/repo/${location.hash.substring(1)}.js`
document.body.appendChild(el)
}
onMount(()=> {
dispatchHash()
})
$: hashChanged = ()=> dispatchHash();
</script>
<svelte:window on:hashchange={hashChanged} />
<main id="sandpoints">
<form>
<label for="content">Content:</label>
<textarea bind:value={v} oninput='this.style.height = "";this.style.height = this.scrollHeight + 3 + "px"'></textarea>
{#if document.location.protocol.substring(0,4) != "file"}
<label for="publish">Publish</label>
<input type="checkbox" id="publish" name="publish" />
{/if}
<label for="offline">Offline</label>
<input type="checkbox" id="offline" name="offline" />
<button id="sandpointsButton">COMMIT/SAVE</button>
</form>
</main>