drag files into article

This commit is contained in:
Niko Abeler 2024-02-21 21:21:58 +01:00
parent 2f81bf8678
commit 4941b5d027
3 changed files with 91 additions and 6 deletions

View File

@ -2,4 +2,68 @@
<input type="text" name="title" value="{{.Title}}" />
<label for="content">Content</label>
<textarea name="content" rows="16">{{.Content}}</textarea>
<textarea
id="contentField"
ondrop="dropHandler(event);"
ondragover="dragOverHandler(event);"
name="content"
rows="16"
>{{.Content}}</textarea>
<script>
const contentField = document.getElementById("contentField")
function processFile(file) {
console.log(`name = ${file.name}`);
console.log(`size = ${file.size}`);
console.log(`type = ${file.type}`);
console.log(file)
const formData = new FormData()
formData.append("file", file)
fetch(
"/admin/api/binaries",
{
method: "POST",
body: formData
}
).then((resp) => {
return resp.json()
}).then(data => {
if (file.type.split("/")[0] == "image") {
contentField.value += `\n![](${data.location})`
} else {
contentField.value += `\n[${file.name}](${data.location})`
}
})
}
function dropHandler(ev) {
console.log("File(s) dropped");
ev.preventDefault();
if (ev.dataTransfer.items) {
// Use DataTransferItemList interface to access the file(s)
[...ev.dataTransfer.items].forEach((item, i) => {
// If dropped items aren't files, reject them
if (item.kind === "file") {
const file = item.getAsFile();
processFile(file)
}
});
} else {
// Use DataTransfer interface to access the file(s)
[...ev.dataTransfer.files].forEach((file, i) => {
processFile(file)
});
}
}
function dragOverHandler(ev) {
console.log("File(s) in drop zone");
ev.preventDefault();
}
</script>

View File

@ -69,6 +69,9 @@ func NewWebApp(
admin.Post("/binaries/delete", binaryManageHandler.HandleDelete)
admin.Post("/interactions/:id/delete/", adminInteractionHandler.HandleDelete)
adminApi := admin.Group("/api")
adminApi.Post("/binaries", binaryManageHandler.HandleUploadApi)
// Editor
editor := app.Group("/editor")
editor.Use(middleware.NewAuthMiddleware(authorService).Handle)

View File

@ -3,6 +3,7 @@ package web
import (
"owl-blogs/app"
"owl-blogs/app/repository"
"owl-blogs/domain/model"
"owl-blogs/render"
"sort"
"strings"
@ -46,31 +47,48 @@ func (h *BinaryManageHandler) Handle(c *fiber.Ctx) error {
}
func (h *BinaryManageHandler) HandleUpload(c *fiber.Ctx) error {
func (h *BinaryManageHandler) saveFileUpload(c *fiber.Ctx) (*model.BinaryFile, error) {
file, err := c.FormFile("file")
if err != nil {
return err
return nil, err
}
reader, err := file.Open()
if err != nil {
return err
return nil, err
}
defer reader.Close()
content := make([]byte, file.Size)
_, err = reader.Read(content)
if err != nil {
return err
return nil, err
}
binary, err := h.service.Create(file.Filename, content)
if err != nil {
return err
return nil, err
}
return binary, nil
}
func (h *BinaryManageHandler) HandleUpload(c *fiber.Ctx) error {
binary, err := h.saveFileUpload(c)
if err != nil {
return err
}
return c.Redirect("/media/" + binary.Id)
}
func (h *BinaryManageHandler) HandleUploadApi(c *fiber.Ctx) error {
binary, err := h.saveFileUpload(c)
if err != nil {
return err
}
return c.JSON(map[string]string{
"location": "/media/" + binary.Id,
})
}
func (h *BinaryManageHandler) HandleDelete(c *fiber.Ctx) error {
id := c.FormValue("file")
binary, err := h.service.FindById(id)