New image resize algo

jobs/anime-images/anime-images.go

@@ -65,12 +65,14 @@ func work(anime *arn.Anime) error {
 	medium := path.Join(os.Getenv("GOPATH"), "/src/github.com/animenotifier/notify.moe/images/anime/medium/")
 	small := path.Join(os.Getenv("GOPATH"), "/src/github.com/animenotifier/notify.moe/images/anime/small/")
 
-	largeSize := 250
+	largeSizeX := 250
-	mediumSize := 142
+	largeSizeY := 0
-	smallSize := 55
 
-	mediumSizeBonusLowDPI := 8
+	mediumSizeX := 142
-	smallSizeBonusLowDPI := 5
+	mediumSizeY := 200
+
+	smallSizeX := 55
+	smallSizeY := 78
 
 	webpQuality := 70
 	jpegQuality := 70
@@ -119,26 +121,30 @@ func work(anime *arn.Anime) error {
 			&outputs.ImageFile{
 				Directory: large,
 				BaseName:  anime.ID,
-				Size:      largeSize,
+				Width:     largeSizeX,
+				Height:    largeSizeY,
 				Quality:   jpegQuality + qualityBonusLowDPI,
 			},
 			&outputs.ImageFile{
 				Directory: large,
 				BaseName:  anime.ID + "@2",
-				Size:      largeSize * 2,
+				Width:     largeSizeX * 2,
+				Height:    largeSizeY * 2,
 				Quality:   jpegQuality,
 			},
 			&outputs.ImageFile{
 				Directory: large,
 				BaseName:  anime.ID,
-				Size:      largeSize,
+				Width:     largeSizeX,
+				Height:    largeSizeY,
 				Format:    "webp",
 				Quality:   webpQuality + qualityBonusLowDPI,
 			},
 			&outputs.ImageFile{
 				Directory: large,
 				BaseName:  anime.ID + "@2",
-				Size:      largeSize * 2,
+				Width:     largeSizeX * 2,
+				Height:    largeSizeY * 2,
 				Format:    "webp",
 				Quality:   webpQuality,
 			},
@@ -147,26 +153,30 @@ func work(anime *arn.Anime) error {
 			&outputs.ImageFile{
 				Directory: medium,
 				BaseName:  anime.ID,
-				Size:      mediumSize + mediumSizeBonusLowDPI,
+				Width:     mediumSizeX,
+				Height:    mediumSizeY,
 				Quality:   jpegQuality + qualityBonusLowDPI + qualityBonusMedium,
 			},
 			&outputs.ImageFile{
 				Directory: medium,
 				BaseName:  anime.ID + "@2",
-				Size:      mediumSize * 2,
+				Width:     mediumSizeX * 2,
+				Height:    mediumSizeY * 2,
 				Quality:   jpegQuality,
 			},
 			&outputs.ImageFile{
 				Directory: medium,
 				BaseName:  anime.ID,
-				Size:      mediumSize + mediumSizeBonusLowDPI,
+				Width:     mediumSizeX,
+				Height:    mediumSizeY,
 				Format:    "webp",
 				Quality:   webpQuality + qualityBonusLowDPI + qualityBonusMedium,
 			},
 			&outputs.ImageFile{
 				Directory: medium,
 				BaseName:  anime.ID + "@2",
-				Size:      mediumSize * 2,
+				Width:     mediumSizeX * 2,
+				Height:    mediumSizeY * 2,
 				Format:    "webp",
 				Quality:   webpQuality,
 			},
@@ -175,26 +185,30 @@ func work(anime *arn.Anime) error {
 			&outputs.ImageFile{
 				Directory: small,
 				BaseName:  anime.ID,
-				Size:      smallSize + smallSizeBonusLowDPI,
+				Width:     smallSizeX,
+				Height:    smallSizeY,
 				Quality:   jpegQuality + qualityBonusLowDPI + qualityBonusSmall,
 			},
 			&outputs.ImageFile{
 				Directory: small,
 				BaseName:  anime.ID + "@2",
-				Size:      smallSize * 2,
+				Width:     smallSizeX * 2,
+				Height:    smallSizeY * 2,
 				Quality:   jpegQuality,
 			},
 			&outputs.ImageFile{
 				Directory: small,
 				BaseName:  anime.ID,
-				Size:      smallSize + smallSizeBonusLowDPI,
+				Width:     smallSizeX,
+				Height:    smallSizeY,
 				Format:    "webp",
 				Quality:   webpQuality + qualityBonusLowDPI + qualityBonusSmall,
 			},
 			&outputs.ImageFile{
 				Directory: small,
 				BaseName:  anime.ID + "@2",
-				Size:      smallSize * 2,
+				Width:     smallSizeX * 2,
+				Height:    smallSizeY * 2,
 				Format:    "webp",
 				Quality:   webpQuality,
 			},

pages/anime/anime.scarlet

@@ -109,7 +109,6 @@
 	margin-top 0.5rem
 
 .anime-cover-image
-	// width 142px
 	width 250px
 	height auto
 	border-radius 3px

pages/soundtracks/soundtracks.scarlet

@@ -35,7 +35,7 @@
 
 .sound-track-anime-image
 	width 142px
-	height 201px
+	height 200px
 
 .music-buttons
 	display flex

styles/anime-grid.scarlet

@@ -3,7 +3,7 @@
 
 .anime-grid-cell
 	grid-cell
-	scale-up
+	saturate-up
 	shadow-up
 
 .anime-grid-image

styles/grid.scarlet

@@ -6,15 +6,13 @@ mixin grid-cell
 	position relative
 
 	width 142px
-	height 16vw
+	height 200px
-	min-width 90px
+	// min-width 90px
-	min-height 127px
+	// min-height 127px
-	max-width 142px
-	max-height 201px
 	border-radius 3px
 
-	background-size cover
+	// background-size cover
-	background-position 50% 50%
+	// background-position 50% 50%
 
 	margin 0.5rem