This is the template project that's checked out and configured when you run the bando-up command from ljsthw-bandolier. This is where the code really lives.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
bandolier-template/admin/pages/DocsBrowser.svelte

90 lines
2.2 KiB

<script>
import { push, link } from 'svelte-spa-router';
import Validator from 'Validator';
import { onMount } from 'svelte';
import Layout from '$/client/Layout.svelte';
import Icon from '$/client/components/Icon.svelte';
import Blockstart from "$/client/components/Blockstart.svelte";
import Code from "$/client/components/Code.svelte";
import api from "$/client/api.js";
let index = {};
let docs_data;
let url;
export let params;
const load_docs = async (to_load) => {
const [status, data] = await api.get(`/docs/api/${to_load}.json`);
docs_data = status === 200 ? data : {};
url = to_load;
window.scrollTo(0, 0);
}
const load_index = async () => {
const [status, data] = await api.get("/docs/api/index.json");
index = status === 200 ? data : {};
}
onMount(async () => {
await load_index();
});
$: console.log("params", params);
$: if(params.wild && params.wild !== url) {
load_docs(params.wild);
}
</script>
<style>
sidebar {
max-width: 300px;
}
</style>
<Layout centered={ true } fullwidth={ true }>
<Blockstart>
<block class="horizontal">
<sidebar>
<top><h4><a href="/" use:link><Icon name="chevrons-up" /> Docs</a></h4></top>
<items>
{#each Object.keys(index) as item}
<a class:active={ item === url } href="/docs/{item}" use:link>{item}</a>
{/each}
</items>
</sidebar>
<right style="--pad: 0.5rem;">
{#if docs_data}
{#each docs_data.exports as exp}
<h1>{ url }</h1>
<h2>{exp.name}</h2>
{#if exp.comment}
<pre>
{ exp.comment.value }
</pre>
{/if}
{#if exp.isa === "class"}
{#each exp.methods as method}
<h4>{ method.name }</h4>
{#if exp.comment}
<pre>
{ exp.comment.value }
</pre>
{/if}
<Code content={ method.code } language="javascript" />
{/each}
{:else}
<Code content={ exp.code } language="javascript" />
{/if}
{/each}
{/if}
</right>
</block>
</Blockstart>
</Layout>