Skip to content
This repository was archived by the owner on Dec 18, 2018. It is now read-only.
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 29 additions & 1 deletion ResembleJs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,14 @@ Resemble.js

Analyse and compare images with Javascript and HTML5. [Resemble.js Demo](http://huddle.github.com/Resemble.js/)

![Two image diff examples side-by-side, one pink, one yellow.](https://raw.github.com/Huddle/Resemble.js/master/demoassets/readmeimage.jpg "Visual image comparison")

### Get it

`npm install resemblejs`

`bower install resemblejs`

### Example

Retrieve basic analysis on image.
Expand Down Expand Up @@ -45,6 +53,26 @@ You can also change the comparison method after the first analysis.
diff.ignoreAntialiasing();
```

And change the output display style.

```javascript
resemble.outputSettings({
errorColor: {
red: 255,
green: 0,
blue: 255
},
errorType: 'movement',
transparency: 0.3,
largeImageThreshold: 1200
});
// resembleControl.repaint();
```

By default, the comparison algorithm skips pixels when the image width or height is larger than 1200 pixels. This is there to mitigate performance issues.

You can switch this modify this behaviour by setting the `largeImageThreshold` option to a different value. Set it to **0** to switch it off completely.

--------------------------------------

Created by [James Cryer](http://github.com/jamescryer) and the Huddle development team.
Created by [James Cryer](http://github.com/jamescryer) and the Huddle development team.
15 changes: 11 additions & 4 deletions ResembleJs/resemble.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,11 @@ URL: https://github.com/Huddle/Resemble.js
}
}
};

var errorPixelTransformer = errorPixelTransform.flat;

var largeImageThreshold = 1200;

_this['resemble'] = function( fileData ){

var data = {};
Expand Down Expand Up @@ -108,6 +110,7 @@ URL: https://github.com/Huddle/Resemble.js
function loadImageData( fileData, callback ){
var fileReader;
var hiddenImage = new Image();
hiddenImage.setAttribute("crossOrigin", "crossOrigin");

hiddenImage.onload = function() {

Expand Down Expand Up @@ -346,7 +349,7 @@ URL: https://github.com/Huddle/Resemble.js

var skip;

if( (width > 1200 || height > 1200) && ignoreAntialiasing){
if(!!largeImageThreshold && ignoreAntialiasing && (width > largeImageThreshold || height > largeImageThreshold)){
skip = 6;
}

Expand Down Expand Up @@ -591,10 +594,14 @@ URL: https://github.com/Huddle/Resemble.js
if(options.errorType && errorPixelTransform[options.errorType] ){
errorPixelTransformer = errorPixelTransform[options.errorType];
}

pixelTransparency = options.transparency || pixelTransparency;

if (options.largeImageThreshold !== undefined) {
largeImageThreshold = options.largeImageThreshold;
}

return this;
};

}(this));
}(this));