Fixed issue in PIXI.canUseNewCanvasBlendModes which would create false positives in browsers that supported multiply in Canvas path/fill ops, but not for drawImage (Samsung S5 for example). Now uses more accurate magenta / yellow mix test.

This commit is contained in:
photonstorm 2015-02-03 16:16:25 +00:00
parent d6ea8fb956
commit 260490fe06
2 changed files with 19 additions and 7 deletions

View file

@ -77,6 +77,7 @@ Version 2.3.0 - "Tarabon" - in dev
* SoundManager.unlock checks for audio `start` support and falls back to `noteOn` if not found.
* Sprite.frame and AnimationManager.frame wouldn't return the correct index if a sprite sheet was being used unless it had first been set via the setter.
* Error in diffX and diffY calculation in Tilemap.paste (thanks @amelia410 #1446)
* Fixed issue in PIXI.canUseNewCanvasBlendModes which would create false positives in browsers that supported `multiply` in Canvas path/fill ops, but not for `drawImage` (Samsung S5 for example). Now uses more accurate magenta / yellow mix test.
For changes in previous releases please see the extensive [Version History](https://github.com/photonstorm/phaser/blob/master/CHANGELOG.md).

View file

@ -166,7 +166,7 @@ PIXI.unpackColorRGB = function(r, g, b)//r, g, b, a)
*/
/**
* Checks whether the Canvas BlendModes are supported by the current browser
* Checks whether the Canvas BlendModes are supported by the current browser for drawImage
*
* @method canUseNewCanvasBlendModes
* @return {Boolean} whether they are supported
@ -174,16 +174,27 @@ PIXI.unpackColorRGB = function(r, g, b)//r, g, b, a)
PIXI.canUseNewCanvasBlendModes = function()
{
if (typeof document === 'undefined') return false;
var pngHead = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABAQMAAADD8p2OAAAAA1BMVEX/';
var pngEnd = 'AAAACklEQVQI12NgAAAAAgAB4iG8MwAAAABJRU5ErkJggg==';
var magenta = new Image();
magenta.src = pngHead + 'AP804Oa6' + pngEnd;
var yellow = new Image();
yellow.src = pngHead + '/wCKxvRF' + pngEnd;
var canvas = document.createElement('canvas');
canvas.width = 1;
canvas.width = 6;
canvas.height = 1;
var context = canvas.getContext('2d');
context.fillStyle = '#000';
context.fillRect(0,0,1,1);
context.globalCompositeOperation = 'multiply';
context.fillStyle = '#fff';
context.fillRect(0,0,1,1);
return context.getImageData(0,0,1,1).data[0] === 0;
context.drawImage(magenta, 0, 0);
context.drawImage(yellow, 2, 0);
var data = context.getImageData(2,0,1,1).data;
return (data[0] === 255 && data[1] === 0 && data[2] === 0);
};
/**