diff --git a/src/core/operations/AddTextToImage.mjs b/src/core/operations/AddTextToImage.mjs index 99ea7bd0..97b2f799 100644 --- a/src/core/operations/AddTextToImage.mjs +++ b/src/core/operations/AddTextToImage.mjs @@ -23,7 +23,7 @@ class AddTextToImage extends Operation { this.name = "Add Text To Image"; this.module = "Image"; - this.description = "Adds text onto an image.

Text can be horizontally or vertically aligned, or the position can be manually specified.
Variants of the Roboto font face are available in any size or colour.

Note: This may cause a degradation in image quality, especially when using font sizes larger than 72."; + this.description = "Adds text onto an image.

Text can be horizontally or vertically aligned, or the position can be manually specified.
Variants of the Roboto font face are available in any size or colour."; this.infoURL = ""; this.inputType = "ArrayBuffer"; this.outputType = "ArrayBuffer"; @@ -152,14 +152,12 @@ class AddTextToImage extends Operation { // Make Webpack load the png font images - const fontImages = [ + await Promise.all([ import(/* webpackMode: "eager" */ "../../web/static/fonts/bmfonts/Roboto72White.png"), import(/* webpackMode: "eager" */ "../../web/static/fonts/bmfonts/RobotoSlab72White.png"), import(/* webpackMode: "eager" */ "../../web/static/fonts/bmfonts/RobotoMono72White.png"), import(/* webpackMode: "eager" */ "../../web/static/fonts/bmfonts/RobotoBlack72White.png") - ]; - - await Promise.all(fontImages); + ]); const font = fontsMap[fontFace]; @@ -190,14 +188,18 @@ class AddTextToImage extends Operation { } }); - // Scale the image to a factor of 72, so we can print the text at any size - const scaleFactor = 72 / size; - if (size !== 72) { + // Create a temporary image to hold the rendered text + const textImage = new jimp(jimp.measureText(jimpFont, text), jimp.measureTextHeight(jimpFont, text)); + textImage.print(jimpFont, 0, 0, text); + + // Scale the rendered text image to the correct size + const scaleFactor = size / 72; + if (size !== 1) { // Use bicubic for decreasing size - if (size > 72) { - image.scale(scaleFactor, jimp.RESIZE_BICUBIC); + if (size > 1) { + textImage.scale(scaleFactor, jimp.RESIZE_BICUBIC); } else { - image.scale(scaleFactor, jimp.RESIZE_BILINEAR); + textImage.scale(scaleFactor, jimp.RESIZE_BILINEAR); } } @@ -207,14 +209,11 @@ class AddTextToImage extends Operation { xPos = 0; break; case "Center": - xPos = (image.getWidth() / 2) - (jimp.measureText(jimpFont, text) / 2); + xPos = (image.getWidth() / 2) - (textImage.getWidth() / 2); break; case "Right": - xPos = image.getWidth() - jimp.measureText(jimpFont, text); + xPos = image.getWidth() - textImage.getWidth(); break; - default: - // Adjust x position for the scaled image - xPos = xPos * scaleFactor; } switch (vAlign) { @@ -222,25 +221,15 @@ class AddTextToImage extends Operation { yPos = 0; break; case "Middle": - yPos = (image.getHeight() / 2) - (jimp.measureTextHeight(jimpFont, text) / 2); + yPos = (image.getHeight() / 2) - (textImage.getHeight() / 2); break; case "Bottom": - yPos = image.getHeight() - jimp.measureTextHeight(jimpFont, text); + yPos = image.getHeight() - textImage.getHeight(); break; - default: - // Adjust y position for the scaled image - yPos = yPos * scaleFactor; } - image.print(jimpFont, xPos, yPos, text); - - if (size !== 72) { - if (size > 72) { - image.scale(1 / scaleFactor, jimp.RESIZE_BILINEAR); - } else { - image.scale(1 / scaleFactor, jimp.RESIZE_BICUBIC); - } - } + // Blit the rendered text image onto the original source image + image.blit(textImage, xPos, yPos); let imageBuffer; if (image.getMIME() === "image/gif") {