alex/LocalAGI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

generate elem with go

Browse Source
This commit is contained in:
Ettore Di Giacinto
2024-04-14 00:31:24 +02:00
parent 7c0f615952
commit 80508001c7
7 changed files with 75 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
example/webui/elements.go
View File

@@ -3,24 +3,33 @@ package main
import (
"fmt"
"strings"
elem "github.com/chasefleming/elem-go"
"github.com/chasefleming/elem-go/attrs"
)
// TODO: switch to https://github.com/chasefleming/elem-go
func chatDiv(content string, color string) string {
return fmt.Sprintf(`<div class="p-2 my-2 rounded bg-%s-600">%s</div>`, color, htmlIfy(content))
div := elem.Div(attrs.Props{
// attrs.ID: "container",
attrs.Class: fmt.Sprintf("p-2 my-2 rounded bg-%s-600", color),
},
elem.Raw(htmlIfy(content)),
)
return div.Render()
}
func loader() string {
return `<div class="loader"></div>`
return elem.Div(attrs.Props{
attrs.Class: "loader",
}).Render()
}
func disabledElement(id string, disabled bool) string {
if disabled {
return `<script> document.getElementById('` + id + `').disabled = true;</script>`
}
return `<script> document.getElementById('` + id + `').disabled = false;</script>`
return elem.Script(nil,
elem.If(disabled,
elem.Raw(`document.getElementById('`+id+`').disabled = true`),
elem.Raw(`document.getElementById('`+id+`').disabled = false`),
)).Render()
}
func htmlIfy(s string) string {

4
example/webui/views/agents.html
View File

@@ -69,12 +69,12 @@
</a>
</td>
<td class="px-6 py-4 whitespace-nowrap text-center text-sm font-medium">
<button hx-put="/start/{{.}}" class="text-indigo-500 hover:text-indigo-400">
<button hx-put="/start/{{.}}">
Start
</button>
</td>
<td class="px-6 py-4 whitespace-nowrap text-center text-sm font-medium">
<button hx-put="/pause/{{.}}" class="text-indigo-500 hover:text-indigo-400">
<button hx-put="/pause/{{.}}">
Pause
</button>
</td>

44
example/webui/views/knowledgebase.html
View File

@@ -3,50 +3,8 @@
<head>
<title>KnowledgeBase</title>
{{template "views/partials/header"}}
<script src="https://unpkg.com/htmx.org"></script>
<script src="https://unpkg.com/htmx.org/dist/ext/sse.js"></script>
<script src="https://unpkg.com/hyperscript.org@0.9.12"></script>
<style>
.section-box {
background-color: #2a2a2a; /* Darker background for the form */
padding: 20px;
margin-bottom: 20px;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
body {
background-color: #1a1a1a; /* Lighter overall background */
color: #ffffff;
font-family: sans-serif;
padding: 20px;
}
input, button {
width: 100%;
padding: 10px;
margin-top: 5px;
border-radius: 5px;
border: none;
}
input[type="text"], input[type="file"] {
background-color: #333333;
color: white;
}
button {
background-color: #4a76a8; /* Blue color for buttons */
color: white;
cursor: pointer;
}
button:hover {
background-color: #5a86b8;
}
</style>
</head>
<body>
<body class="bg-gray-900 p-4 text-white font-sans">
{{template "views/partials/menu"}}
<header class="text-center mb-8">
<h1 class="text-3xl md:text-5xl font-bold">Knowledgebase (items: {{.KnowledgebaseItemsCount}})</h1>

37
example/webui/views/partials/header.html
View File

@@ -10,4 +10,41 @@
body {
font-family: 'Roboto', sans-serif;
}
.section-box {
background-color: #2a2a2a; /* Darker background for the form */
padding: 20px;
margin-bottom: 20px;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
body {
background-color: #1a1a1a; /* Lighter overall background */
color: #ffffff;
font-family: sans-serif;
padding: 20px;
}
input, button {
width: 100%;
padding: 10px;
margin-top: 5px;
border-radius: 5px;
border: none;
}
input[type="text"], input[type="file"] {
background-color: #333333;
color: white;
}
button {
background-color: #4a76a8; /* Blue color for buttons */
color: white;
cursor: pointer;
}
button:hover {
background-color: #5a86b8;
}
</style>

9
example/webui/views/settings.html
View File

@@ -50,6 +50,15 @@
</header>
<div class="max-w-4xl mx-auto">
<div class="section-box">
<button hx-put="/start/{{.Name}}" class="text-indigo-500 hover:text-indigo-400">
Start
</button>
<button hx-put="/pause/{{.Name}}" class="text-indigo-500 hover:text-indigo-400">
Pause
</button>
</div>
<div class="section-box">
<h2>Export</h2>
<a href="/settings/export/{{.Name}}" >Export</a>