jacob1123/budgeteer
1
1
Fork 0
Code Issues 12 Pull Requests 1 Packages Releases 1 Wiki Activity

Convert templates to partials

Browse Source
This commit is contained in:
Jan Bader 2021-12-02 15:00:53 +00:00
parent 67f7022b90
commit 77ae9d2dfd
16 changed files with 261 additions and 237 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
http/accounts.go
View File

@ -39,5 +39,5 @@ func (h *Handler) accounts(c *gin.Context) {
Accounts: accounts, Accounts: accounts,
} }
c.HTML(http.StatusOK, "accounts", d) c.HTML(http.StatusOK, "accounts.html", d)
} }

2
http/budget.go
View File

@ -48,5 +48,5 @@ func (h *Handler) budget(c *gin.Context) {
Transactions: transactions, Transactions: transactions,
} }
c.HTML(http.StatusOK, "budget", d) c.HTML(http.StatusOK, "budget.html", d)
} }

2
http/dashboard.go
View File

@ -25,7 +25,7 @@ func (h *Handler) dashboard(c *gin.Context) {
Token: token, Token: token,
Budgets: budgets, Budgets: budgets,
} }
c.HTML(http.StatusOK, "dashboard", d) c.HTML(http.StatusOK, "dashboard.html", d)
} }
type DashboardData struct { type DashboardData struct {

16
http/http.go
View File

@ -6,8 +6,6 @@ import (
"net/http" "net/http"
"time" "time"
"html/template"
"git.javil.eu/jacob1123/budgeteer" "git.javil.eu/jacob1123/budgeteer"
"git.javil.eu/jacob1123/budgeteer/bcrypt" "git.javil.eu/jacob1123/budgeteer/bcrypt"
"git.javil.eu/jacob1123/budgeteer/postgres" "git.javil.eu/jacob1123/budgeteer/postgres"
@ -34,8 +32,12 @@ const (
func (h *Handler) Serve() { func (h *Handler) Serve() {
router := gin.Default() router := gin.Default()
templ := template.Must(template.New("").Funcs(router.FuncMap).ParseFS(web.Templates, "*")) templates, err := NewTemplates(router.FuncMap)
router.SetHTMLTemplate(templ) if err != nil {
panic(err)
}
router.HTMLRender = templates
static, err := fs.Sub(web.Static, "static") static, err := fs.Sub(web.Static, "static")
if err != nil { if err != nil {
@ -43,7 +45,7 @@ func (h *Handler) Serve() {
} }
router.StaticFS("/static", http.FS(static)) router.StaticFS("/static", http.FS(static))
router.GET("/", func(c *gin.Context) { c.HTML(http.StatusOK, "index", nil) }) router.GET("/", func(c *gin.Context) { c.HTML(http.StatusOK, "index.html", nil) })
router.GET("/login", h.login) router.GET("/login", h.login)
router.GET("/register", h.register) router.GET("/register", h.register)
authenticatedFrontend := router.Group("") authenticatedFrontend := router.Group("")
@ -180,7 +182,7 @@ func (h *Handler) login(c *gin.Context) {
return return
} }
c.HTML(http.StatusOK, "login", nil) c.HTML(http.StatusOK, "login.html", nil)
} }
func (h *Handler) register(c *gin.Context) { func (h *Handler) register(c *gin.Context) {
@ -189,7 +191,7 @@ func (h *Handler) register(c *gin.Context) {
return return
} }
c.HTML(http.StatusOK, "register", nil) c.HTML(http.StatusOK, "register.html", nil)
} }
func logout(c *gin.Context) { func logout(c *gin.Context) {

45
http/templates.go Normal file
View File

@ -0,0 +1,45 @@
package http
import (
"fmt"
"html/template"
"io/fs"
"git.javil.eu/jacob1123/budgeteer/web"
"github.com/gin-gonic/gin/render"
)
type Templates struct {
templates map[string]*template.Template
}
func NewTemplates(funcMap template.FuncMap) (*Templates, error) {
templates, err := fs.Glob(web.Templates, "*.tpl")
if err != nil {
return nil, err
}
result := &Templates{
templates: make(map[string]*template.Template, 0),
}
pages, err := fs.Glob(web.Templates, "*.html")
for _, page := range pages {
allTemplates := append([]string{page}, templates...)
tpl, err := template.New(page).Funcs(funcMap).ParseFS(web.Templates, allTemplates...)
fmt.Printf("page: %s, templates: %v\n", page, templates)
if err != nil {
return nil, err
}
result.templates[page] = tpl
}
return result, nil
}
func (tpl *Templates) Instance(name string, obj interface{}) render.Render {
return render.HTML{
Template: tpl.templates[name],
Name: name,
Data: obj,
}
}

24
web/accounts.html
View File

@ -1,23 +1,17 @@
{{define "accounts"}} {{define "title"}}
<!DOCTYPE html> Accounts
<html> {{end}}
<head>
<title>Budgets</title>
{{template "head"}} {{define "new"}}
</head> {{end}}
<body>
<div class="container" id="head"> {{template "base" .}}
Budgeteer - {{.Token.GetName}}
</div> {{define "main"}}
<div class="container col-lg-12" id="content">
{{range .Accounts}} {{range .Accounts}}
<div class="budget-item"> <div class="budget-item">
<a href="account/{{.ID}}">{{.Name}}</a> <a href="account/{{.ID}}">{{.Name}}</a>
<span class="time"></span> <span class="time"></span>
</div> </div>
{{end}} {{end}}
</div>
</body>
</html>
{{end}} {{end}}

31
web/base.tpl Normal file
View File

@ -0,0 +1,31 @@
{{define "base"}}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link href="/static/css/bootstrap.min.css" rel="stylesheet" />
<link href="/static/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="/static/css/main.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://malsup.github.io/jquery.form.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/main.js"></script>
<title>{{template "title" .}} - Budgeteer</title>
{{block "more-head" .}}{{end}}
</head>
<body>
<div class="container" id="head">
{{template "title" .}}
</div>
<div class="container col-lg-12" id="content">
{{template "main" .}}
</div>
{{block "new" .}}{{end}}
</body>
</html>
{{end}}

0
web/budget-new.html → web/budget-new.tpl
View File

22
web/budget.html
View File

@ -1,15 +1,12 @@
{{define "budget"}} {{template "base" .}}
<!DOCTYPE html>
<html>
<head>
<title>Budgets</title>
{{template "head"}} {{define "title"}}Budget{{end}}
</head>
<body> {{define "new"}}
<div class="container" id="head"> {{template "transaction-new"}}
Budgeteer - {{.Token.GetName}} - {{.Budget.Name}} {{end}}
</div>
{{define "main"}}
<div class="container"><a href="/budget/{{.Budget.ID}}/accounts">Go to Accounts</a></div> <div class="container"><a href="/budget/{{.Budget.ID}}/accounts">Go to Accounts</a></div>
<div class="budget-item"> <div class="budget-item">
<a href="#newbudgetmodal" data-toggle="modal" data-target="#newbudgetmodal">New Budget</a> <a href="#newbudgetmodal" data-toggle="modal" data-target="#newbudgetmodal">New Budget</a>
@ -26,7 +23,4 @@
</tr> </tr>
{{end}} {{end}}
</table> </table>
{{template "transaction-new"}}
</body>
</html>
{{end}} {{end}}

26
web/dashboard.html
View File

@ -1,16 +1,14 @@
{{define "dashboard"}} {{define "title"}}
<!DOCTYPE html> Budgets
<html> {{end}}
<head>
<title>Budgets</title>
{{template "head"}} {{define "new"}}
</head> {{template "budget-new"}}
<body> {{end}}
<div class="container" id="head">
Budgeteer - {{.Token.GetName}} {{template "base" .}}
</div>
<div class="container col-lg-12" id="content"> {{define "main"}}
{{range .Budgets}} {{range .Budgets}}
<div class="budget-item"> <div class="budget-item">
<a href="budget/{{.ID}}">{{.Name}}</a> <a href="budget/{{.ID}}">{{.Name}}</a>
@ -21,8 +19,4 @@
<a href="#newbudgetmodal" data-toggle="modal" data-target="#newbudgetmodal">New Budget</a> <a href="#newbudgetmodal" data-toggle="modal" data-target="#newbudgetmodal">New Budget</a>
<span class="time"></span> <span class="time"></span>
</div> </div>
</div>
{{template "budget-new"}}
</body>
</html>
{{end}} {{end}}

13
web/head.html
View File

@ -1,13 +0,0 @@
{{define "head"}}
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link href="/static/css/bootstrap.min.css" rel="stylesheet" />
<link href="/static/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="/static/css/main.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://malsup.github.io/jquery.form.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/main.js"></script>
{{end}}

24
web/index.html
View File

@ -1,21 +1,17 @@
{{define "index"}} {{define "title"}}
<!DOCTYPE html> Start
<html> {{end}}
<head>
<title>Budgeteer</title>
{{template "head"}} {{define "new"}}
</head> {{end}}
<body>
<div class="container" id="head"> {{template "base" .}}
Budgeteer
</div> {{define "main"}}
<div class="container col-md-8 col-ld-8" id="content"> <div class="container col-md-8 col-ld-8" id="content">
Willkommen bei Budgeteer, der neuen App für's Budget! Willkommen bei Budgeteer, der neuen App für's Budget!
</div> </div>
<div class="container col-md-4" id="login"> <div class="container col-md-4" id="login">
<a href="/login">Login</a> <a href="/login">Login</a> or <a href="/login">register</a>
</div> </div>
</body>
</html>
{{end}} {{end}}

21
web/login.html
View File

@ -1,11 +1,8 @@
{{define "login"}} {{template "base" .}}
<!DOCTYPE html>
<html>
<head>
<title>Login</title>
{{template "head"}} {{define "title"}}Login{{end}}
{{define "more-head"}}
<script> <script>
$(document).ready(function() { $(document).ready(function() {
$('#invalidCredentials').hide(); $('#invalidCredentials').hide();
@ -19,12 +16,9 @@
}); });
}); });
</script> </script>
</head> {{end}}
<body>
<div class="container" id="head"> {{define "main"}}
Budgeteer
</div>
<div class="container col-lg-12" id="content">
<form id="loginForm" action="/api/v1/user/login" method="POST" class="center-block"> <form id="loginForm" action="/api/v1/user/login" method="POST" class="center-block">
<div class="form-group"> <div class="form-group">
<label for="username">User</label> <label for="username">User</label>
@ -41,7 +35,4 @@
<input type="submit" value="Login" class="btn btn-default" /> <input type="submit" value="Login" class="btn btn-default" />
</form> </form>
</div>
</body>
</html>
{{end}} {{end}}

22
web/register.html
View File

@ -1,11 +1,8 @@
{{define "register"}} {{define "title"}}Register{{end}}
<!DOCTYPE html>
<html>
<head>
<title>Registration</title>
{{template "head"}} {{template "base" .}}
{{define "more-head"}}
<script> <script>
function checkPasswordMatchUi() { function checkPasswordMatchUi() {
if(checkPasswordMatch()) if(checkPasswordMatch())
@ -17,7 +14,6 @@
function checkPasswordMatch() { function checkPasswordMatch() {
var password = $("#password").val(); var password = $("#password").val();
var confirmPassword = $("#password_confirm").val(); var confirmPassword = $("#password_confirm").val();
return password == confirmPassword; return password == confirmPassword;
} }
@ -41,12 +37,9 @@
}); });
}); });
</script> </script>
</head> {{end}}
<body>
<div class="container" id="head"> {{define "main"}}
Budgeteer
</div>
<div class="container col-lg-12" id="content">
<form id="loginForm" action="/api/v1/user/register" method="POST" class="center-block"> <form id="loginForm" action="/api/v1/user/register" method="POST" class="center-block">
<div class="form-group"> <div class="form-group">
<label for="email">E-Mail</label> <label for="email">E-Mail</label>
@ -72,7 +65,4 @@
<input type="submit" value="Login" class="form-control" /> <input type="submit" value="Login" class="form-control" />
</form> </form>
</div>
</body>
</html>
{{end}} {{end}}

2
web/templates.go
View File

@ -2,7 +2,7 @@ package web
import "embed" import "embed"
//go:embed *.html //go:embed *.html *.tpl
var Templates embed.FS var Templates embed.FS
//go:embed static //go:embed static

0
web/transaction-new.html → web/transaction-new.tpl
View File