bin/pages.templ

177 lines
4.2 KiB
Plaintext

package main
import "fmt"
templ page(inner templ.Component, menu []MenuItem, currentMenu int, args interface{}) {
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="/static/htmx.min.js"></script>
<script src="/static/_hyperscript.min.js"></script>
<link rel="stylesheet" href="/static/tailwind.css" />
<title>bin</title>
</head>
<body class="mt-12 mx-16 xl:mx-72 lg:mx-64 md:mx-32 sm:mx-24 bg-amber-50">
<header class="flex flex-row justify-between my-16">
<h1 class="text-5xl">bin</h1>
@NavMenu(menu, currentMenu, false)
</header>
<main id="main-content">
{! inner }
</main>
<div class="fixed left-0 bottom-1 flex flex-row justify-center w-screen pointer-events-none">
<div id="toast" class="w-fit pointer-events-auto">
</div>
</div>
</body>
</html>
}
var defaultMenu []MenuItem = []MenuItem{
{
label: "home",
href: "/",
},
{
label: "new",
href: "/new",
},
{
label: "about",
href: "/about",
},
}
templ indexFull() {
@page(
indexPartial(),
defaultMenu,
0,
nil,
)
}
templ indexPartial() {
<h2 class="text-xl">Welcome to <i>bin</i></h2>
<p>bin is a simple paste bin.</p>
<br />
@boostButton("new", "/new")
}
templ newFull(wantsText bool) {
@page(
newPartial(wantsText),
defaultMenu,
1,
nil,
)
}
const placeholderCode string = `#include <stdio.h>
int main(int argc, char *argv[]) {
printf("Hello, world!\n");
return 0;
}`
templ newPartial(wantsText bool) {
<h2 class="text-xl">submit a new file</h2>
<form
hx-post="/new"
hx-encoding="multipart/form-data"
method="POST"
hx-target="#main-content"
>
<div class="my-2 grid grid-cols-1 sm:grid-cols-3 md:grid-cols-5 gap-4 max-w-sm md:max-w-lg">
<label class="col-span-1" for="name">
file name:
</label>
<input
class="col-span-2 md:col-span-4 justify-self-start
outline-2 bg-amber-50
hover:outline-slate-400 hover:outline-dotted
focus:outline-slate-600 focus:outline-dashed
active:outline-green-600"
type="text"
name="name"
id="name"
placeholder="foo.txt"
_="on change set #description's @placeholder to `some stuff about ${my value} ...`"
/>
<label for="lang" class="col-span-1">language:</label>
<div class="col-span-2 md:col-span-4">@chooseSyntax("lang")</div>
<label class="col-span-1" for="description">description:</label>
<textarea
class="col-span-2 md:col-span-4 resize-none hover:resize justify-self-start
w-full outline-2 bg-amber-50
hover:outline-slate-400 hover:outline-dotted
focus:outline-slate-600 focus:outline-dashed
active:outline-green-600"
name="description"
id="description"
rows="3"
placeholder="some stuff about foo.txt ..."
/>
</div>
if wantsText {
@newTextSubmit()
<input type="text" name="wantsText" hidden value="true" />
} else {
@newFileUpload()
}
@submitFormButton("submit")
</form>
}
templ binFull(file File) {
@page(
binPartial(file),
defaultMenu,
-1,
nil,
)
}
templ binPartial(file File) {
<div>
<h1 class="text-xl my-2 inline-block">{ file.Filename }
if file.Language != "" {
<sup class="text-base mx-4">({ file.Language })</sup>
}
</h1>
<p class="italic mx-1 my-2">{ file.Description }</p>
<pre class="my-4">{ file.Data }</pre>
<div class="relative h-full">
<form
class="absolute -bottom-32"
hx-post={ "/b/" + file.PageKey + "/delete" }
hx-confirm="Are you sure you want to delete this?"
>
<input
name="adminKey"
id="adminKey"
type="text"
class="mr-4 w-24 bg-amber-50
hover:outline-slate-400 hover:outline-dotted
focus:outline-slate-600 focus:outline-dashed
active:outline-green-600"
placeholder="deletion key"
value={ file.AdminKey }
/>
@submitFormButton("delete")
if file.AdminKey != "" {
<a class="text-blue-500 mx-4" href={ templ.URL(fmt.Sprintf("/b/%s?delcode=%s", file.PageKey, file.AdminKey))}><sup>permalink with deletion key</sup></a>
}
<p class="opacity-0 my-1 max-w-md" _="init if #adminKey's value is not '' log then show me with *opacity">
this is your deletion key! <br /> you will need to store it if you want to delete the file.
</p>
</form>
</div>
</div>
}