go-form-demo/controller/template.go
2025-07-30 14:00:18 +02:00

190 lines
3.8 KiB
Go

package controller
import (
"html/template"
"net/http"
"github.com/yassinebenaid/godump"
"gitnet.fr/deblan/go-form-demo/form"
"gitnet.fr/deblan/go-form/theme"
)
func UsingTemplate(w http.ResponseWriter, r *http.Request) {
w.Header().Set("Content-Type", "text/html; charset=utf-8")
var dumped any
// New instances of datas
themeValue := form.NewTheme()
contactValue := form.Contact{}
// Theme form handler
themeSelectorForm := form.CreateThemeSelectorForm()
themeSelectorForm.HandleRequest(r)
if themeSelectorForm.IsSubmitted() && themeSelectorForm.IsValid() {
themeSelectorForm.Bind(themeValue)
}
// Contact form handler
contactForm := form.CreateContactForm(themeValue.Value == "Bootstrap5")
if r.Method == contactForm.Method {
contactForm.HandleRequest(r)
if contactForm.IsSubmitted() && contactForm.IsValid() {
contactForm.Bind(&contactValue)
// For debugging
var dump godump.Dumper
dump.Theme = godump.Theme{}
dumped = dump.Sprint(contactValue)
}
}
render := theme.NewRenderer(themes[themeValue.Value])
tpl, _ := template.New("page").
Funcs(render.FuncMap()).
Parse(pageTemplates[themeValue.Value])
tpl.Execute(w, map[string]any{
"ContactForm": contactForm,
"ThemeSelectorForm": themeSelectorForm,
"IsSent": dumped != nil,
"Dump": dumped,
})
}
var pageTemplates = map[string]string{
"Html5": `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Form</title>
<style>
body {
background: #434c64;
}
#theme-form * {
display: inline-block;
margin-right: 5px;
}
#contact-form > div {
margin-bottom: 16px;
}
#contact-form input:not([type=submit]),
#contact-form select,
#contact-form textarea {
margin-bottom: 16px;
margin-top: 5px;
display: block;
width: 100%;
font-size: 16px;
}
input:not([type=submit]), select, textarea {
padding: 3px 7px;
border-radius: 4px;
box-sizing: border-box;
border: 1px solid #333;
background: #fff;
}
.help {
color: #999;
margin-top: -9px;
}
.required::after {
content: "*";
color: red;
display: inline-block;
padding-left: 3px;
}
.page {
font-family: Verdana;
max-width: 1200px;
margin: 20px auto;
border: 1px solid #ccc;
background: #ffffffee;
border-radius: 10px;
padding: 20px;
font-size: 14px;
}
ul, li {
color: red;
padding: 0;
margin: 3px 0;
list-style: none;
}
</style>
</head>
<body>
<div class="page">
{{ if .IsSent }}
<p>
<strong>OK!</strong>
<pre>{{ .Dump }}</pre>
</p>
{{ else }}
{{ form .ThemeSelectorForm }}
<h1>Contact form</h1>
{{ form .ContactForm }}
{{ end }}
</div>
</body>
</html>`,
"Bootstrap5": `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-LN+7fdVzj6u52u30Kp6M/trliBMCMKTyK833zpbD+pXdCLuTusPj697FH4R/5mcr" crossorigin="anonymous">
<title>Form</title>
<style>
#theme-form * {
display: inline-block;
width: auto;
margin-right: 5px;
}
#contact-form > div {
margin-bottom: 7px;
}
.required::after {
content: "*";
color: red;
display: inline-block;
padding-left: 3px;
}
</style>
</head>
<body>
<div class="container p-3">
{{ if .IsSent }}
<div class="alert alert-success my-2">
<strong>OK!</strong>
<pre>{{ .Dump }}</pre>
</div>
{{ else }}
{{ form .ThemeSelectorForm }}
<h1 class="mt-3">Contact form</h1>
{{ form .ContactForm }}
{{ end }}
</div>
</body>
</html>`,
}
var themes = map[string]map[string]theme.RenderFunc{
"Html5": theme.Html5,
"Bootstrap5": theme.Bootstrap5,
}