Disable color correction in Firefox programatically per image?

Question

this question is in close relation to Firefox 3.5 color correction hack?

The situation I have is that there's a canvas game of mine, and the images that are used in it carry additional information about their shape, connection points etc. This information is stored in the PNG image itself, using meaningful colours (eg RGB(255,255,0) for connection point).

Loading element and painting on the canvas creates Image object, img.src is set, and in img.load function I preprocess image data reading the sensitive information (and removing sensitive pixels from the image data before painting to canvas).

The problem: In FF, the pixel which was supposed to be 255,255,0 is actually 255,254,0. I don't have problems with FF color correction (I don't care if the displayed image has right colors, or slightly modified), but I'd expect that getting image data gives me uncorrected data. I'm looking for a solution which would not involve changing images on the server. Is there some way? Eg. img.setColorProfile(), or img.disableColorCorrection(), or img.getImageData(disableColorCorrection) or img.getImageData(colorProfile)?

Answer 1

The problem might have do more with image loading than image drawing.

I think the proper solution is to strip out color profile information from the images (which you seem to want to aovid). If possible server another image resources for Firefox if you cannot need to have the original data intact.

http://f6design.com/journal/2006/12/01/fixing-png-gamma/

Also, you could decode PNG immages in pure Javascript if the server is co-operate and allows CORS and AJAX loading of the images. You decode the image in Javascript using png.js and create a source <canvas> from the image data (instead of <img>). This way it's you in the control what RGB values comes out from each PNG pixel.

https://github.com/devongovett/png.js