scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-01 02:38:43 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve tests for native blend modes.

Browse source 
Each mode needs to be tested separately, since some browsers implement only a subset (WebKit).
This commit is contained in:
Jürg Lehni 2013-06-26 14:59:07 -07:00
parent b8d773e129
commit 1126c699d2
1 changed files with 21 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
src/canvas/BlendMode.js
View file

@ -219,19 +219,28 @@ var BlendMode = new function() {
// if globalCompositeOperation is actually sticky is not enough, as Chome 27
// pretends for blend-modes to work, but does not actually apply them.
var ctx = CanvasProvider.getContext(1, 1);
// Multiply #300 (51) and #a00 (170) and see if we get #200 (34)
ctx.fillStyle = '#300';
ctx.fillRect(0, 0, 1, 1);
ctx.globalCompositeOperation = 'multiply';
ctx.fillStyle = '#a00';
ctx.fillRect(0, 0, 1, 1);
var data = ctx.getImageData(0, 0, 1, 1).data;
// If data[0] is 34, the mode has worked. Now feature-detect all modes that
// the browser claims to support.
this.nativeModes = data[0] === 34 && Base.each(modes, function(func, mode) {
// Blend #330000 (51) and #aa0000 (170). Multiplying should lead to
// #220000 (34)
function testMode(mode) {
ctx.save();
// For darken we need to reverse color parameters in order to test mode.
var darken = mode === 'darken',
ok = false;
ctx.fillStyle = darken ? '#300' : '#a00';
ctx.fillRect(0, 0, 1, 1);
ctx.globalCompositeOperation = mode;
this[mode] = ctx.globalCompositeOperation === mode;
}, {});
if (ctx.globalCompositeOperation === mode) {
ctx.fillStyle = darken ? '#a00' : '#300';
ctx.fillRect(0, 0, 1, 1);
ok = ctx.getImageData(0, 0, 1, 1).data[0] !== darken ? 170 : 51;
}
ctx.restore();
return ok;
}
this.nativeModes = testMode('multiply') && Base.each(modes,
function(func, mode) {
this[mode] = testMode(mode);
}, {});
CanvasProvider.release(ctx);
this.process = function(mode, srcContext, dstContext, alpha, offset) {