feat: fileserver + logging + styling

This commit is contained in:
2025-05-18 17:00:07 +02:00
parent f382ccc008
commit fa30f66b6b
8 changed files with 160 additions and 31 deletions

View File

@ -4,10 +4,13 @@ import (
"fmt"
"log"
"net/http"
"os"
"path/filepath"
"gitea.local/admin/hspguard/internal/repository"
"gitea.local/admin/hspguard/internal/user"
"github.com/go-chi/chi/v5"
"github.com/go-chi/chi/v5/middleware"
)
type APIServer struct {
@ -24,6 +27,11 @@ func NewAPIServer(addr string, db *repository.Queries) *APIServer {
func (s *APIServer) Run() error {
router := chi.NewRouter()
router.Use(middleware.Logger)
workDir, _ := os.Getwd()
staticDir := http.Dir(filepath.Join(workDir, "static"))
FileServer(router, "/static", staticDir)
router.Route("/api/v1", func(r chi.Router) {
userHandler := user.NewUserHandler()

View File

@ -0,0 +1,28 @@
package api
import (
"net/http"
"strings"
"github.com/go-chi/chi/v5"
)
func FileServer(r chi.Router, path string, root http.FileSystem) {
if strings.ContainsAny(path, "{}*") {
panic("FileServer does not permit any URL parameters.")
}
if path != "/" && path[len(path)-1] != '/' {
r.Get(path, http.RedirectHandler(path+"/", 301).ServeHTTP)
path += "/"
}
path += "*"
r.Get(path, func(w http.ResponseWriter, r *http.Request) {
rctx := chi.RouteContext(r.Context())
pathPrefix := strings.TrimSuffix(rctx.RoutePattern(), "/*")
fs := http.StripPrefix(pathPrefix, http.FileServer(root))
fs.ServeHTTP(w, r)
})
}

View File

@ -14,11 +14,11 @@ func NewUserHandler() *UserHandler {
}
func (h *UserHandler) RegisterRoutes(router chi.Router) {
router.Get("/login", h.handleLogin)
router.Get("/register", h.handleRegister)
router.Get("/login", h.loginPage)
router.Get("/register", h.registerPage)
}
func (h *UserHandler) handleLogin(w http.ResponseWriter, r *http.Request) {
func (h *UserHandler) loginPage(w http.ResponseWriter, r *http.Request) {
data := map[string]any{
"Title": "Login",
}
@ -26,7 +26,7 @@ func (h *UserHandler) handleLogin(w http.ResponseWriter, r *http.Request) {
web.RenderTemplate(w, "login", data)
}
func (h *UserHandler) handleRegister(w http.ResponseWriter, r *http.Request) {
func (h *UserHandler) registerPage(w http.ResponseWriter, r *http.Request) {
data := map[string]any{
"Title": "Register",
}

80
static/css/styles.css Normal file
View File

@ -0,0 +1,80 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html, body {
height: 100%;
font-family: Inter, Arial, sans-serif;
background-color: #f2f2f2;
}
.container {
display: flex;
flex-direction: column;
min-height: 100vh;
justify-content: center;
align-items: center;
padding: 2rem;
position: relative;
background: #ffffff;
background: linear-gradient(0deg,rgba(255, 255, 255, 1) 90%, rgba(30, 144, 255, 1) 100%);
}
.modal-box {
background-color: white;
padding: 2rem;
border-radius: 8px;
border: 1px solid #ddd;
max-width: 400px;
width: 100%;
z-index: 1;
}
.modal-title {
font-size: 28px;
font-weight: 600;
margin-bottom: 15px;
}
.input-group {
display: flex;
flex-direction: row;
align-items: stretch;
border: 1px solid #ccc;
border-radius: 5px;
margin-bottom: 10px;
}
.input-icon {
padding: 10px;
}
.input-field {
flex: 1;
border: none;
}
.icon-wrapper {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
}
.icon {
width: 64px;
height: 64px;
}
.footer {
position: absolute;
bottom: 1rem;
text-align: center;
color: #999;
font-size: 0.9rem;
}

BIN
static/icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.5 KiB

View File

@ -4,15 +4,18 @@
<head>
<meta charset="UTF-8" />
<title>{{ .Title }}</title>
<link rel="stylesheet" href="/static/css/styles.css" >
</head>
<body>
<header>
<h1>{{ .Title }}</h1>
</header>
<main>
<!-- <header> -->
<!-- <h1>{{ .Title }}</h1> -->
<!-- </header> -->
<div class="container">
<main class="modal-box">
{{ block "content" . }}{{ end }}
</main>
{{ template "footer" . }}
</div>
</body>
</html>
{{ end }}

View File

@ -1,4 +1,4 @@
{{ define "footer" }}
<footer><p>© 2025 HSP Guard</p></footer>
<footer class="footer"><p>&copy; 2025 HSP Guard</p></footer>
{{ end }}

View File

@ -1,21 +1,31 @@
{{ define "content" }}
<form method="POST" action="/api/v1/register">
<label for="email">
Full Name:
<input type="text" name="full_name" required>
</label>
<label for="email">
Email:
<input type="email" name="email" required>
</label>
<br>
<label for="email">
Password:
<input type="password" name="password" required>
</label>
<br>
<div class="icon-wrapper">
<img src="/static/icon.png" alt="icon" class="icon">
</div>
<h1 class="modal-title">
Create an account to enter homelab
</h1>
<form method="POST" action="/api/v1/register">
<div class="input-group">
<div class="input-icon">
&copy;
</div>
<input class="input-field" type="text" name="full_name" placeholder="Full Name" required>
</div>
<div class="input-group">
<div class="input-icon">
@
</div>
<input class="input-field" type="email" name="email" placeholder="Email" required>
</div>
<div class="input-group">
<div class="input-icon">
P
</div>
<input class="input-field" type="password" name="password" placeholder="Password" required>
</div>
<button type="submit">
Register
</button>
</form>
</form>
{{ end }}