Possible to compare two images in Javascript?
image, javascript
Solution
I guess you could. Psuedocode:
- Check if the images have the same width and height. If not, they can't be the same.
- Create a canvas that will fit both images side-by-side.
- Draw the images on the canvas.
- Compare them pixel-for-pixel. This can be done fairly easily using code borrowed from getPixel from HTML Canvas?
- Remember to break out of loops as soon as a single pixel doesn't match.
- Your worst-case runtime will be O(wh), which occurs when the images are actually equal.
Problem
Is there a way to compare two image files that have different filenames? So I am looking to see if they are equal with javascript. Is this possible? The use for this: I have a gallery of images that needs to pop up in the lightbox. When the lightbox opens, I am hooking into the callback to check for the duplicate images and when found, remove them from the lightbox gallery so users are not seeing repeated images.