feat: post creation WIP

This commit is contained in:
Florian Sylvain
2024-05-16 19:30:33 +02:00
parent 29fce9a241
commit 24eefb743b
6 changed files with 182 additions and 11 deletions
+51
View File
@@ -0,0 +1,51 @@
root = "."
testdata_dir = "testdata"
tmp_dir = "tmp"
[build]
args_bin = []
bin = "tmp\\main.exe"
cmd = "go build -o ./tmp/main.exe ./main"
delay = 1000
exclude_dir = ["assets", "tmp", "vendor", "testdata"]
exclude_file = []
exclude_regex = ["_test.go"]
exclude_unchanged = false
follow_symlink = false
full_bin = ""
include_dir = []
include_ext = ["go", "tpl", "tmpl", "html"]
include_file = []
kill_delay = "0s"
log = "build-errors.log"
poll = false
poll_interval = 0
post_cmd = []
pre_cmd = []
rerun = false
rerun_delay = 500
send_interrupt = false
stop_on_error = false
[color]
app = ""
build = "yellow"
main = "magenta"
runner = "green"
watcher = "cyan"
[log]
main_only = false
time = false
[misc]
clean_on_exit = false
[proxy]
app_port = 0
enabled = false
proxy_port = 0
[screen]
clear_on_rebuild = false
keep_scroll = true
+2
View File
@@ -10,3 +10,5 @@ bin
# Environment # Environment
.env .env
tmp/
@@ -0,0 +1,65 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>GoCMS | Create post</title>
{{.Head}}
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<style>
form {
max-width: 24rem;
}
</style>
</head>
<body class="text-dark">
{{.Navbar}}
<div class="container mt-3 text-black-50">
<h1>Post - creation</h1>
<p>Create a new post</p>
<form action="create" method="post" class="d-flex align-items-center flex-column gap-3" id="createPostForm">
<div class="form-floating w-100">
<input type="text" class="form-control" id="name" name="name" placeholder="Chose the post name">
<label for="name">Name</label>
</div>
<button id="createPostButton" class="btn btn-primary w-100" disabled type="submit">
<span class="createPostFormButtonLoading visually-hidden spinner-border spinner-border-sm"
role="status"></span>
<span class="createPostFormButtonDefault">Create</span>
</button>
</form>
</div>
<script>
const button = document.querySelector("#createPostButton")
const inputs = document.querySelectorAll('input')
const form = document.querySelector("#createPostForm")
function formFieldsEmpty() {
return Array.from(inputs).some((input) => input.value === "")
}
function setButtonDisabled() {
button.disabled = formFieldsEmpty() ? "disabled" : ""
}
function setButtonLoading() {
button.classList.add("disabled")
button.querySelector(".createPostFormButtonDefault").classList.add("visually-hidden")
button.querySelector(".createPostFormButtonLoading").classList.remove("visually-hidden")
}
function onCreatePostFormSubmit(event) {
setButtonLoading()
event.target.submit()
}
function onInput(event) {
if (event.target.tagName === "INPUT") setButtonDisabled()
}
form.addEventListener('submit', onCreatePostFormSubmit)
window.addEventListener('input', onInput)
setButtonDisabled()
</script>
</body>
</html>
@@ -1,20 +1,42 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<title>GoCMS | Posts</title> <title>GoCMS | Posts</title>
{{.Head}} {{.Head}}
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
</head> </head>
<body class="text-dark"> <body class="text-dark">
{{.Navbar}} {{.Navbar}}
<div class="container mt-3 text-black-50"> <div class="container mt-3 text-black-50">
<h1>Posts</h1> <h1>Posts</h1>
<p>List of your posts</p> <p>List of your posts</p>
<table class="table table-striped"> <table class="table">
<thead> <thead>
</thead> <tr>
<tbody> <th scope="col">Name</th>
</tbody> <th scope="col">Creation Date</th>
</table> <th scope="col">Edition Date</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="4" class="text-center">
<form action="post/create" method="get">
<button class="btn btn-sm btn-link w-100 h-100" type="submit">Create a new post...</button>
</form>
</td>
</tr>
<tr>
<td>1</td>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
</tbody>
</table>
</div> </div>
</body> </body>
+2
View File
@@ -123,6 +123,8 @@ func NewPageRouter() http.Handler {
r.Get("/home", GetHomePage) r.Get("/home", GetHomePage)
r.Get("/post", GetPostsPage) r.Get("/post", GetPostsPage)
r.Get("/post/edit", GetPostEditPage) r.Get("/post/edit", GetPostEditPage)
r.Get("/post/create", GetPostCreatePage)
r.Post("/post/create", PostPostCreatePage)
}) })
return r return r
+29
View File
@@ -0,0 +1,29 @@
package api
import (
"html/template"
"net/http"
"regexp"
)
func PostPostCreatePage(w http.ResponseWriter, r *http.Request) {
_ = r.ParseForm()
postName := r.FormValue("name")
pattern := regexp.MustCompile("^[a-zA-Z0-9]{3,50}$")
isPostNameValid := pattern.MatchString(postName)
if !isPostNameValid {
r.Method = http.MethodGet
}
}
func GetPostCreatePage(w http.ResponseWriter, _ *http.Request) {
navbarTmpl, _ := Container.GetPageUseCase.GetPage("componentNavbar", nil)
postsTmpl, _ := Container.GetPageUseCase.GetPage("postCreate", map[string]interface{}{
"Navbar": template.HTML(navbarTmpl),
"Head": headTmpl,
})
_, _ = w.Write(postsTmpl)
}