test

go.mod

@@ -1,3 +1,10 @@
 module go.balki.me/collage-maker
 
 go 1.20
+
+require (
+	github.com/oliamb/cutter v0.2.2
+	go.oneofone.dev/resize v1.0.1
+)
+
+require golang.org/x/image v0.1.0 // indirect

go.sum

@@ -0,0 +1,30 @@
+github.com/oliamb/cutter v0.2.2 h1:Lfwkya0HHNU1YLnGv2hTkzHfasrSMkgv4Dn+5rmlk3k=
+github.com/oliamb/cutter v0.2.2/go.mod h1:4BenG2/4GuRBDbVm/OPahDVqbrOemzpPiG5mi1iryBU=
+github.com/yuin/goldmark v1.4.13/go.mod h1:6yULJ656Px+3vBD8DxQVa3kxgyrAnzto9xy5taEt/CY=
+go.oneofone.dev/resize v1.0.1 h1:HjpVar/4pxMGrjO44ThaMX1Q5UOBw0KxzbxxRDZPQuA=
+go.oneofone.dev/resize v1.0.1/go.mod h1:zGFmn7q4EUZVlnDmxqf+b0mWpxsTt0MH2yx6ng8tpq0=
+golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w=
+golang.org/x/crypto v0.0.0-20210921155107-089bfa567519/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc=
+golang.org/x/image v0.1.0 h1:r8Oj8ZA2Xy12/b5KZYj3tuv7NG/fBz3TwQVvpJ9l8Rk=
+golang.org/x/image v0.1.0/go.mod h1:iyPr49SD/G/TBxYVB/9RRtGUT5eNbo2u4NamWeQcD5c=
+golang.org/x/mod v0.6.0-dev.0.20220419223038-86c51ed26bb4/go.mod h1:jJ57K6gSWd91VN4djpZkiMVwK6gcyfeH4XE8wZrZaV4=
+golang.org/x/net v0.0.0-20190620200207-3b0461eec859/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
+golang.org/x/net v0.0.0-20210226172049-e18ecbb05110/go.mod h1:m0MpNAwzfU5UDzcl9v0D8zg8gWTRqZa9RBIspLL5mdg=
+golang.org/x/net v0.0.0-20220722155237-a158d28d115b/go.mod h1:XRhObCWvk6IyKnWLug+ECip1KBveYUHfp+8e9klMJ9c=
+golang.org/x/sync v0.0.0-20190423024810-112230192c58/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
+golang.org/x/sync v0.0.0-20220722155255-886fb9371eb4/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
+golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
+golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
+golang.org/x/sys v0.0.0-20210615035016-665e8c7367d1/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.0.0-20220520151302-bc2c85ada10a/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.0.0-20220722155257-8c9f86f7a55f/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
+golang.org/x/term v0.0.0-20210927222741-03fcf44c2211/go.mod h1:jbD1KX2456YbFQfuXm/mYQcufACuNUgVhRMnK/tPxf8=
+golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
+golang.org/x/text v0.3.3/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
+golang.org/x/text v0.3.7/go.mod h1:u+2+/6zg+i71rQMx5EYifcz6MCKuco9NR6JIITiCfzQ=
+golang.org/x/text v0.4.0/go.mod h1:mrYo+phRRbMaCq/xk9113O4dZlRixOauAjOtrjsXDZ8=
+golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
+golang.org/x/tools v0.0.0-20191119224855-298f0cb1881e/go.mod h1:b+2E5dAYhXwXZwtnZ6UAqBI28+e2cm9otk0dWdXHAEo=
+golang.org/x/tools v0.1.12/go.mod h1:hNGJHUnrk76NpqgfD5Aqm5Crs+Hm0VOH/i9J2+nxYbc=
+golang.org/x/xerrors v0.0.0-20190717185122-a985d3407aa7/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=

index.html

@@ -34,14 +34,20 @@
             function showCrop() {
                 for(cpie of crops) {
                     console.log(cpie.get())
+                    console.log(cpie.element.clientWidth)
+                    console.log(cpie.element.clientHeight)
                 }
             }
 
         </script>
+        <!--
+                width: 3264px;
+                height: 4224px;
+        -->
         <style>
             .container {
-                height: 11in;
                 width: 8.5in;
+                height: 11in;
                 overflow: hidden;
                 margin: auto;
                 border: 1px solid;

main.go

@@ -6,9 +6,32 @@ import (
 	"image/draw"
 	"image/jpeg"
 	"os"
+
+	"github.com/oliamb/cutter"
+	"go.oneofone.dev/resize"
 )
 
+/**
+"431"
+"697"
+"2514"
+"2047"
+zoom: 0.392
+816
+528
+-------------
+"153"
+"9"
+"1331"
+"772"
+zoom: 0.6949
+816
+528
+*/
+
 func main() {
+	const width = 816 * 4
+	const height = 528 * 4
 	imgFile1, err := os.Open("img1.jpg")
 	if err != nil {
 		fmt.Println(err)
@@ -26,12 +49,39 @@ func main() {
 		fmt.Println(err)
 	}
 
+	img1, err = cutter.Crop(img1, cutter.Config{
+		Width:  2514 - 431,
+		Height: 2047 - 697,
+		Anchor: image.Point{431, 697},
+		Mode:   cutter.TopLeft, // optional, default value
+	})
+
+	if err != nil {
+		panic(err)
+	}
+
+	img1 = resize.Resize(width, height, img1, resize.Lanczos3)
+
+	img2, err = cutter.Crop(img2, cutter.Config{
+		Width:  1331 - 153,
+		Height: 772 - 9,
+		Anchor: image.Point{153, 9},
+		Mode:   cutter.TopLeft, // optional, default value
+	})
+
+	if err != nil {
+		panic(err)
+	}
+
+	img2 = resize.Resize(width, height, img2, resize.Lanczos3)
+
 	//starting position of the second image (bottom left)
-	sp2 := image.Point{img1.Bounds().Dx(), 0}
+	//sp2 := image.Point{img1.Bounds().Dx(), 0}
 	//new rectangle for the second image
-	r2 := image.Rectangle{sp2, sp2.Add(img2.Bounds().Size())}
+	//r2 := image.Rectangle{sp2, sp2.Add(img2.Bounds().Size())}
 	//rectangle for the big image
-	r := image.Rectangle{image.Point{0, 0}, r2.Max}
+	r := image.Rectangle{image.Point{0, 0}, image.Point{width, height + height}}
+	r2 := image.Rectangle{image.Point{0, height + 1}, image.Point{width, height + height}}
 	rgba := image.NewRGBA(r)
 
 	draw.Draw(rgba, img1.Bounds(), img1, image.Point{0, 0}, draw.Src)

standard.go

@@ -0,0 +1,24 @@
+package main
+
+type Resolution struct {
+	X uint
+	Y uint
+}
+
+// increased by factor 1.5
+// https://www.adorama.com/alc/pixels-and-printing-size-matters/
+
+var Letter = Resolution{
+	X: 3264,
+	Y: 4224,
+}
+
+var FiveXSeven = Resolution{
+	X: 2250,
+	Y: 3150,
+}
+
+var FourXSix = Resolution{
+	X: 1800,
+	Y: 2700,
+}

template.html

@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <link rel="icon" href="data:;base64,iVBORw0KGgo=" />
+        <style>
+.paper {
+    width: 8.5in;
+    height: 11in;
+    overflow: hidden;
+    margin: auto;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: space-around;
+    background-color: gainsboro;
+}
+.img1, .img2 {
+    width: 7in;
+    height: 5in;
+}
+.img1 {
+    background-color: blue;
+}
+
+.img2 {
+    background-color: yellow;
+}
+        </style>
+    </head>
+    <body>
+        <div class="paper">
+            <div class="img1"></div>
+            <div class="img2"></div>
+        </div>
+    </body>
+</html>