216 lines
4.4 KiB
Plaintext
216 lines
4.4 KiB
Plaintext
package components
|
|
|
|
import (
|
|
"github.com/alecthomas/chroma/lexers"
|
|
"git.myrkvi.com/myrkvi/bin/models"
|
|
)
|
|
|
|
func getLanguages() []string {
|
|
names := lexers.Names(false)
|
|
names = append([]string{"Determine from source"}, names...)
|
|
|
|
return names
|
|
}
|
|
|
|
templ ChooseSyntax(name string) {
|
|
<select class="max-w-full bg-amber-50" name={ name } id={ name }>
|
|
for i, lang := range getLanguages() {
|
|
if i == 0 {
|
|
<option value="">{ lang }</option>
|
|
} else {
|
|
<option>{ lang }</option>
|
|
}
|
|
}
|
|
</select>
|
|
}
|
|
|
|
templ FileUpload(text, name, id string) {
|
|
<span>
|
|
<label
|
|
role="button"
|
|
for={ id }
|
|
class="transition ease-in-out
|
|
px-1 outline outline-1
|
|
outline-slate-600 hover:outline-2
|
|
hover:bg-green-300 duration-300 mx-2
|
|
active:bg-green-600
|
|
focus:outline-2"
|
|
|
|
>
|
|
{ text }
|
|
</label>
|
|
<span class="mx-2" id={ id + "-span" }>No file chosen</span>
|
|
<input
|
|
type="file"
|
|
name={ name }
|
|
id={ id }
|
|
hidden
|
|
_={ `on change
|
|
set text to #` + id + `-span
|
|
then log me.files
|
|
then log text
|
|
then if me.files.length > 0
|
|
put me.files[0].name into text's innerText
|
|
else
|
|
put 'No file chosen' into text's innerText
|
|
end` }
|
|
/>
|
|
</span>
|
|
}
|
|
|
|
templ BoostButton(label, to string) {
|
|
<span hx-boost="true">
|
|
<a
|
|
tabindex="0"
|
|
role="button"
|
|
class="transition ease-in-out
|
|
px-1 outline outline-1
|
|
outline-slate-600 hover:outline-2
|
|
hover:bg-green-300 duration-300
|
|
active:bg-green-600
|
|
foucs:outline-2"
|
|
href={ templ.SafeURL(to) }
|
|
>
|
|
{ label }
|
|
</a>
|
|
</span>
|
|
}
|
|
|
|
templ GetButton(label, to, target, swap string) {
|
|
<span
|
|
tabindex="0"
|
|
role="button"
|
|
class="transition ease-in-out
|
|
px-1 outline outline-1
|
|
outline-slate-600 hover:outline-2
|
|
hover:bg-green-300 duration-300
|
|
active:bg-green-600
|
|
foucs:outline-2"
|
|
hx-get={ to }
|
|
if target != "" {
|
|
hx-target={ target }
|
|
}
|
|
if swap != "" {
|
|
hx-swap={ swap }
|
|
}
|
|
>
|
|
{ label }
|
|
</span>
|
|
}
|
|
|
|
templ SubmitFormButton(label string) {
|
|
<input
|
|
type="submit"
|
|
value={ label }
|
|
class="transition ease-in-out
|
|
px-1 outline outline-1
|
|
outline-slate-600 hover:outline-2
|
|
hover:bg-green-300 duration-300
|
|
active:bg-green-600
|
|
focus:outline-2
|
|
hover:cursor-pointer"
|
|
/>
|
|
}
|
|
|
|
templ NavMenu(items []models.MenuItem, current int, swapOob bool) {
|
|
<nav
|
|
id="page-nav"
|
|
class="flex flex-col sm:flex-row justify-around"
|
|
if swapOob {
|
|
hx-swap-oob="true"
|
|
}
|
|
hx-boost="true">
|
|
for i, item := range items {
|
|
if i == current {
|
|
<span class="px-2 sm:px-0 sm:mx-2 sm:my-2
|
|
border-t-0 border-r-4
|
|
sm:border-t-4 sm:border-r-0
|
|
border-black cursor-pointer">
|
|
<b>{ item.Label }</b>
|
|
</span>
|
|
} else {
|
|
<a
|
|
class="px-2 sm:px-0 sm:mx-2 my-2
|
|
border-t-0 border-r-4
|
|
sm:border-t-4 sm:border-r-0
|
|
border-amber-300"
|
|
href={ templ.URL(item.Href) }
|
|
>
|
|
{ item.Label }
|
|
</a>
|
|
}
|
|
}
|
|
</nav>
|
|
}
|
|
|
|
templ CombineTempls(comps ...templ.Component) {
|
|
for _, comp := range comps {
|
|
{! comp }
|
|
}
|
|
}
|
|
|
|
templ ErrorMessage(msg, id string) {
|
|
<div
|
|
id={ id }
|
|
hx-swap-oob="true"
|
|
class="my-4 text-rose-600"
|
|
>
|
|
{ msg }
|
|
</div>
|
|
}
|
|
|
|
templ ToastError(message string) {
|
|
<div
|
|
class="relative px-4 py-2 bg-rose-400 opacity-0
|
|
border border-rose-600 rounded-lg m-1"
|
|
_="init transition my opacity to 1 over 250ms"
|
|
>
|
|
<span
|
|
tabindex="0"
|
|
role="button" aria-label="Close the toast message"
|
|
class="absolute top-0 right-1 cursor-pointer select-none"
|
|
_="on click set prnt to my parentElement
|
|
then transition element prnt's opacity to 0 over 500ms
|
|
then remove my parentElement"
|
|
>
|
|
<sup>🞬</sup>
|
|
</span>
|
|
{ message }
|
|
</div>
|
|
}
|
|
|
|
templ ToastSuccess(message string) {
|
|
<div
|
|
class="relative px-4 py-2 bg-emerald-400 opacity-0
|
|
border border-emerald-600 rounded-lg m-1"
|
|
_="init transition my opacity to 1 over 250ms"
|
|
>
|
|
<span
|
|
tabindex="0"
|
|
role="button" aria-label="Close the toast message"
|
|
class="absolute top-0 right-1 cursor-pointer select-none"
|
|
_="on click set prnt to my parentElement
|
|
then transition element prnt's opacity to 0 over 500ms
|
|
then remove my parentElement"
|
|
>
|
|
<sup>🞬</sup>
|
|
</span>
|
|
{ message }
|
|
</div>
|
|
}
|
|
|
|
templ SwapOOB(swapspec string, component templ.Component) {
|
|
<div hx-swap-oob={ swapspec }>
|
|
{! component }
|
|
</div>
|
|
}
|
|
|
|
templ SetTitle(title string) {
|
|
<title id="title" hx-swap-oob="true">
|
|
if title == "" {
|
|
bin
|
|
} else {
|
|
{ title } - bin
|
|
}
|
|
</title>
|
|
} |