upload support for new images

This commit is contained in:
Balakrishnan Balasubramanian 2024-08-01 22:33:29 -04:00
parent 9200bd16db
commit d4446c1f24
5 changed files with 102 additions and 0 deletions

2
README.md Normal file
View File

@ -0,0 +1,2 @@
# Collage Maker

45
main.go
View File

@ -34,6 +34,11 @@ var (
webFS embed.FS
)
const (
kb = 1024
mb = 1024 * kb
)
func main() {
flag.StringVar(&imagesDir, "images-dir", "images", "Sets the images dir")
flag.StringVar(&collageDir, "collages-dir", "collages", "Sets the collages dir")
@ -110,6 +115,46 @@ func main() {
slog.Error("Failed to write collageFile", "error", err)
}
})
http.HandleFunc("/upload", func(w http.ResponseWriter, r *http.Request) {
err := func() error {
err := r.ParseMultipartForm(500 * mb)
if err != nil {
return err
}
files, ok := r.MultipartForm.File["photos"]
if !ok {
return fmt.Errorf("photos not found in request")
}
for i, f := range files {
imgFile, err := f.Open()
if err != nil {
return err
}
defer imgFile.Close()
imagePath := path.Join(imagesDir, fmt.Sprintf("img%d.jpg", i+1))
os.Remove(imagePath)
if err != nil {
return err
}
op, err := os.Create(imagePath)
if err != nil {
return err
}
defer op.Close()
_, err = io.Copy(op, imgFile)
if err != nil {
return err
}
}
return nil
}()
if err != nil {
slog.Error("Image upload failed", "error", err)
w.WriteHeader(http.StatusBadRequest)
return
}
http.Redirect(w, r, "/", http.StatusSeeOther)
})
addrType, server, done, err := anyhttp.Serve(listenAddr, idle.WrapHandler(nil))
if err != nil {
slog.Error("anyhttp Serve failed", "error", err)

View File

@ -10,7 +10,36 @@
justify-content: space-around;
flex-direction: column;
flex: 25%;
overflow: scroll;
}
.img-container {
/** margin: 30px; **/
display: flex;
gap: 1rem;
flex-wrap: wrap;
justify-content: center;
}
.img-container img {
width: 100px;
height: 100px;
border: 5px solid #999;
}
.img-container p {
text-align: center;
font-size: 2rem;
}
.toolbar {
height: 30px;
display: flex;
gap: 1rem;
justify-content: center;
align-items: flex-start;
}
.selected-img {
border: 5px solid lightgreen !important;
}
.imagebox {
padding: 2rem;
flex: 75%;

View File

@ -24,6 +24,20 @@
<option value="foursix-landscape" > 4 × 6 (Landscape) </option>
</select>
</label>
<div>
<div class="toolbar">
<button>Left</button>
<button>Right</button>
</div>
<div class="img-container">
<div> <img src="images/img1.jpg"/> </div>
<div> <img class="selected-img" src="images/img2.jpg"/> </div>
<div> <img src="images/img3.jpg"/> </div>
<div> <img src="images/img4.jpg"/> </div>
<div> <img src="images/img5.jpg"/> </div>
<div> <img src="images/img6.jpg"/> </div>
</div>
</div>
<ul class="templates">

12
web/upload.html Normal file
View File

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<!-- DEVONLY --> <script src="http://localhost:35729/livereload.js"></script>
</head>
<body>
<form action="/upload" method="POST" enctype="multipart/form-data">
<input name="photos" type=file multiple accept="image/*" />
<input type=submit>
</form>
</body>
</html>