Skip to content

Commit d4f3c48

Browse files
committed
Replaces lightness and rgb options with lightboost and diffColor (PR 52#issuecomment-101045835)
1 parent 54fe17a commit d4f3c48

File tree

3 files changed

+48
-58
lines changed

3 files changed

+48
-58
lines changed

imagediff.js

Lines changed: 19 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -196,9 +196,9 @@
196196
for (i = 0; i < length; i += 4) {
197197
var pixelA = Array.prototype.slice.call(aData, i, i+3);
198198
var pixelB = Array.prototype.slice.call(bData, i, i+3);
199-
var diffPixel = diffPixels(pixelA, pixelB, options);
199+
var pixelC = diffPixels(pixelA, pixelB, options);
200200
for (var rgbIndex = 0; rgbIndex < 4; rgbIndex++) {
201-
cData[i+rgbIndex] = diffPixel[rgbIndex];
201+
cData[i+rgbIndex] = pixelC[rgbIndex];
202202
}
203203
}
204204

@@ -244,9 +244,9 @@
244244
j = 4 * (row * b.width + column);
245245
var pixelA = Array.prototype.slice.call(cData, i, i+3);
246246
var pixelB = Array.prototype.slice.call(bData, j, j+3);
247-
var diffPixel = diffPixels(pixelA, pixelB, options);
247+
var pixelC = diffPixels(pixelA, pixelB, options);
248248
for (var rgbIndex = 0; rgbIndex < 4; rgbIndex++) {
249-
cData[i+rgbIndex] = diffPixel[rgbIndex];
249+
cData[i+rgbIndex] = pixelC[rgbIndex];
250250
}
251251
}
252252
}
@@ -267,37 +267,32 @@
267267

268268
/**
269269
* Differentiates two rgb pixels by subtracting color values.
270-
* The light value for each color marks the difference gap.
270+
* @see https://github.com/HumbleSoftware/js-imagediff/pull/52
271271
*
272-
* @see https://github.com/HumbleSoftware/js-imagediff/issues/34
273272
* @param {Object} options
274-
* options.lightness: light added to color value, increasing differences visibility
275-
* options.rgb : array used to specify rgb balance instead of lightness
276-
* options.stack: stack differences on top of the original image, preserving common pixels
273+
* options.lightboost: increases differences visibility with a light boost.
274+
* options.diffColor: a rgb array used to specify differences color instead of light gap.
275+
* options.stack: stacks differences on top of the original image, preserving common pixels.
277276
*
278277
* @returns {Array} pixel rgba values between 0 and 255.
279278
*/
280279
function diffPixels(pixelA, pixelB, options) {
281-
var lightness = options && options.lightness || 25;
282-
if (options && options.lightness === 0) lightness = 0;
283-
var diffColor = options && options.rgb || [lightness,lightness,lightness];
284-
var stack = options && options.stack;
285-
// diffPixel = [r,g,b,a]
286-
var diffPixel = [0,0,0,255];
280+
var lightboost = options && options.lightboost || 0;
281+
var diffColor = options && options.diffColor || false;
282+
var stack = options && options.stack || false;
283+
// pixel = [r,g,b,a]
284+
var pixelC = [0,0,0,255];
287285
for (var rgbIndex = 0; rgbIndex < 3 ; rgbIndex++) {
288-
diffPixel[rgbIndex] = Math.abs(pixelA[rgbIndex] - pixelB[rgbIndex]);
289-
if (diffPixel[rgbIndex] > 0) {
290-
// Optionally colors area of difference, adds visibility with lightness.
291-
diffPixel[rgbIndex] += diffColor[rgbIndex];
292-
diffPixel[rgbIndex] = Math.min(diffPixel[rgbIndex], 255);
286+
pixelC[rgbIndex] = Math.abs(pixelA[rgbIndex] - pixelB[rgbIndex]);
287+
if (pixelC[rgbIndex] > 0) {
288+
if (diffColor) pixelC[rgbIndex] = diffColor[rgbIndex];
289+
pixelC[rgbIndex] = Math.min(pixelC[rgbIndex] + lightboost, 255);
293290
}
294291
else if (stack) {
295-
// If options.stack and no pixel differences are found,
296-
// print original pixel instead of a black (0) pixel.
297-
diffPixel[rgbIndex] = pixelA[rgbIndex];
292+
pixelC[rgbIndex] = pixelA[rgbIndex];
298293
}
299294
}
300-
return diffPixel;
295+
return pixelC;
301296
}
302297

303298
// Validation

js/imagediff.js

Lines changed: 19 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -189,9 +189,9 @@
189189
for (i = 0; i < length; i += 4) {
190190
var pixelA = Array.prototype.slice.call(aData, i, i+3);
191191
var pixelB = Array.prototype.slice.call(bData, i, i+3);
192-
var diffPixel = diffPixels(pixelA, pixelB, options);
192+
var pixelC = diffPixels(pixelA, pixelB, options);
193193
for (var rgbIndex = 0; rgbIndex < 4; rgbIndex++) {
194-
cData[i+rgbIndex] = diffPixel[rgbIndex];
194+
cData[i+rgbIndex] = pixelC[rgbIndex];
195195
}
196196
}
197197

@@ -237,9 +237,9 @@
237237
j = 4 * (row * b.width + column);
238238
var pixelA = Array.prototype.slice.call(cData, i, i+3);
239239
var pixelB = Array.prototype.slice.call(bData, j, j+3);
240-
var diffPixel = diffPixels(pixelA, pixelB, options);
240+
var pixelC = diffPixels(pixelA, pixelB, options);
241241
for (var rgbIndex = 0; rgbIndex < 4; rgbIndex++) {
242-
cData[i+rgbIndex] = diffPixel[rgbIndex];
242+
cData[i+rgbIndex] = pixelC[rgbIndex];
243243
}
244244
}
245245
}
@@ -260,37 +260,32 @@
260260

261261
/**
262262
* Differentiates two rgb pixels by subtracting color values.
263-
* The light value for each color marks the difference gap.
263+
* @see https://github.com/HumbleSoftware/js-imagediff/pull/52
264264
*
265-
* @see https://github.com/HumbleSoftware/js-imagediff/issues/34
266265
* @param {Object} options
267-
* options.lightness: light added to color value, increasing differences visibility
268-
* options.rgb : array used to specify rgb balance instead of lightness
269-
* options.stack: stack differences on top of the original image, preserving common pixels
266+
* options.lightboost: increases differences visibility with a light boost.
267+
* options.diffColor: a rgb array used to specify differences color instead of light gap.
268+
* options.stack: stacks differences on top of the original image, preserving common pixels.
270269
*
271270
* @returns {Array} pixel rgba values between 0 and 255.
272271
*/
273272
function diffPixels(pixelA, pixelB, options) {
274-
var lightness = options && options.lightness || 25;
275-
if (options && options.lightness === 0) lightness = 0;
276-
var diffColor = options && options.rgb || [lightness,lightness,lightness];
277-
var stack = options && options.stack;
278-
// diffPixel = [r,g,b,a]
279-
var diffPixel = [0,0,0,255];
273+
var lightboost = options && options.lightboost || 0;
274+
var diffColor = options && options.diffColor || false;
275+
var stack = options && options.stack || false;
276+
// pixel = [r,g,b,a]
277+
var pixelC = [0,0,0,255];
280278
for (var rgbIndex = 0; rgbIndex < 3 ; rgbIndex++) {
281-
diffPixel[rgbIndex] = Math.abs(pixelA[rgbIndex] - pixelB[rgbIndex]);
282-
if (diffPixel[rgbIndex] > 0) {
283-
// Optionally colors area of difference, adds visibility with lightness.
284-
diffPixel[rgbIndex] += diffColor[rgbIndex];
285-
diffPixel[rgbIndex] = Math.min(diffPixel[rgbIndex], 255);
279+
pixelC[rgbIndex] = Math.abs(pixelA[rgbIndex] - pixelB[rgbIndex]);
280+
if (pixelC[rgbIndex] > 0) {
281+
if (diffColor) pixelC[rgbIndex] = diffColor[rgbIndex];
282+
pixelC[rgbIndex] = Math.min(pixelC[rgbIndex] + lightboost, 255);
286283
}
287284
else if (stack) {
288-
// If options.stack and no pixel differences are found,
289-
// print original pixel instead of a black (0) pixel.
290-
diffPixel[rgbIndex] = pixelA[rgbIndex];
285+
pixelC[rgbIndex] = pixelA[rgbIndex];
291286
}
292287
}
293-
return diffPixel;
288+
return pixelC;
294289
}
295290

296291
// Validation

spec/ImageDiffSpec.js

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -316,7 +316,7 @@ describe('ImageUtils', function() {
316316
a.data[1] = 200,
317317
b = imagediff.createImageData(1, 1),
318318
b.data[1] = 158,
319-
c = imagediff.diff(a, b, {lightness: 0}),
319+
c = imagediff.diff(a, b),
320320

321321
d = imagediff.createImageData(1, 1);
322322
d.data[1] = 42;
@@ -325,16 +325,16 @@ describe('ImageUtils', function() {
325325
expect(c).toImageDiffEqual(d);
326326
});
327327

328-
it('should calculate difference with adjusted lightness', function () {
328+
it('should calculate color difference with adjusted lightness', function () {
329329
a = imagediff.createImageData(1, 1),
330330
a.data[1] = 200;
331331
b = imagediff.createImageData(1, 1),
332332
b.data[1] = 158;
333-
c = imagediff.diff(a, b);
333+
c = imagediff.diff(a, b, {lightboost: 155});
334334

335335
d = imagediff.createImageData(1, 1);
336-
// 42 + 25 (default increased lightness)
337-
d.data[1] = 67;
336+
// a-b + 155
337+
d.data[1] = 197;
338338
d.data[3] = 255;
339339

340340
expect(c).toImageDiffEqual(d);
@@ -344,7 +344,7 @@ describe('ImageUtils', function() {
344344
a = imagediff.createImageData(3, 3),
345345
b = imagediff.createImageData(1, 1),
346346
b.data[1] = 21;
347-
c = imagediff.diff(a, b, {lightness: 0});
347+
c = imagediff.diff(a, b);
348348

349349
d = imagediff.createImageData(3, 3);
350350
// 4 * (rowPos * imageWidth + columnPos) + rgbPos
@@ -363,7 +363,7 @@ describe('ImageUtils', function() {
363363
a = imagediff.createImageData(3, 3),
364364
b = imagediff.createImageData(1, 1),
365365
b.data[1] = 21;
366-
c = imagediff.diff(a, b, {lightness: 0, align: 'top'});
366+
c = imagediff.diff(a, b, {align: 'top'});
367367

368368
d = imagediff.createImageData(3, 3);
369369
d.data[1] = 21;
@@ -384,12 +384,12 @@ describe('ImageUtils', function() {
384384
Array.prototype.forEach.call(b.data, function (value, i) {
385385
b.data[i] = 125;
386386
});
387-
c = imagediff.diff(a, b, {rgb: [255,0,255]});
387+
c = imagediff.diff(a, b, {diffColor: [240,0,210], lightboost: 25});
388388

389389
d = imagediff.createImageData(1, 1);
390390
d.data[0] = 255;
391-
d.data[1] = 125;
392-
d.data[2] = 255;
391+
d.data[1] = 25;
392+
d.data[2] = 235;
393393
d.data[3] = 255;
394394

395395
expect(c).toImageDiffEqual(d);

0 commit comments

Comments
 (0)