Jimp: Regression in blit function when srcx is non-zero

[akwizgran]

Expected Behavior

The blit function takes optional arguments srcx, srcy, srcw, srch to specify a region of the source image to blit. For example, if the source image is a 100w x 100h square and the destination is a 50w x 100h rectangle, it should be possible to blit the left half of the source image into the destination with dest.blit(src, 0, 0, 0, 0, 50, 100), or the right half with dest.blit(src, 0, 0, 50, 0, 50, 100).

This worked as expected in Jimp 0.2.28, but it no longer works in Jimp 0.4.0 (I haven't tested any other versions).

Current Behavior

Blitting the left half of the source image (with srcx = 0) works as expected, but blitting the right half (with srcx > 0) doesn't affect the desination image at all. The problem seems to involve the following check at line 68 of plugin-blit/dist/index.js:

if (x + sx >= 0 && y + sy >= 0 && maxw - x - sx > 0 && maxh - y - sy > 0)

This check causes all pixels to be skipped when blitting the right half of the source image. I'm not sure whether the problem is the check itself, or the values of sx and sy that are being passed to the scanQuiet() callback.

Context

• Jimp Version: 0.4.0 (bug does not exist in 0.2.28)
• Operating System: Linux
• Node version: 10.7.0

Thank you for this fantastic project!

[hipstersmoothie]

Hmm this seems to work the same in both for me

• @param {number} x the x position to blit the image (Must set this to effect where the image will blit to)
• @param {number} y the y position to blit the image
• @param {number} srcx (optional) the x position from which to crop the source image (if you provide a point halfway though t the image it crops there. doesn't effect x)
• @param {number} srcy (optional) the y position from which to crop the source image
• @param {number} srcw (optional) the width to which to crop the source image
• @param {number} srch (optional) the height to which to crop the source image

    const dest = await Jimp.read('./exampleImages/canyons.png');
    const src = await Jimp.read('./exampleImages/player.png');

    dest
      .blit(
        src,
        src.getWidth() / 2,
        0,
        src.getWidth() / 2,
        0,
        src.getWidth() / 2,
        src.getHeight()
      )
      .write('test.png', console.log);

[hipstersmoothie]

If you can provide me images and an example that'd be awesome!
@akwizgran

[t3rminus]

I'm going to add a +1 to this. My app had been silently producing blank images since 0.3.x, and nobody noticed, since the function was seldom-used. I was doing a partial re-write and started tearing my hair out over why it was spitting out blank images.

Reverting to 0.2.28 fixed things.

Heres a silly fiddle demonstrating the problem: https://jsfiddle.net/t3rminus/gbzne7v3/25/

It loads 3 images:
https://www.k3vin.net/fuzz/cat_butt.png
https://www.k3vin.net/fuzz/cat_head.png
https://www.k3vin.net/fuzz/cat_fuzz.png

Then blits them together, selecting a random horizontal slice of the originals, and repeating the "fuzz" middle section depending on how "long" you want your cat to be.

• First text box is the "length" of your longcat (number of times to repeat "fuzz" slice)
  
  
  
  • Second text field is an override for cat index (0-7, leave blank for random). It works when 0, but produces a blank result for any non-zero index. This index determines the srcx/srcy offset in the images to be blitted.
  
  

[hipstersmoothie]

@t3rminus that was super useful! I basically added your code as test cases. The cat example made me laugh. I've opened #613. Once merged I'll put a release together.

[hipstersmoothie]

Released in v0.5.0

[hipstersmoothie]

Seems to be working now https://jsfiddle.net/n7rd8by3/ 🎉