Skip to content

Commit f2584d5

Browse files
committed
Update README for v1.3
1 parent a2d9132 commit f2584d5

File tree

1 file changed

+54
-15
lines changed

1 file changed

+54
-15
lines changed

README.md

Lines changed: 54 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -11,32 +11,32 @@ Adobe® Photoshop® has a variety of helpful [blend modes](http://help.adobe.com
1111
- offsetOptions : [optional] JS Object with some/all of the following keys:
1212
destX, destY
1313
The X/Y location in the 'underContext' to blend onto; both default to 0.
14-
14+
1515
sourceX, sourceY
1616
The X/Y location in the 'overContext' to blend from; both default to 0.
17-
17+
1818
width,height
1919
The size of the box to blend; both default to 'auto', blending up to the
2020
right and bottom edges of the 'over' context.
21-
21+
2222
Width and height may less than specified if there is not enough space
2323
on the over or under contexts to fit the blend.
2424

2525

2626
## Use
2727

2828
// Likely an 'offscreen' (not in the DOM) canvas
29-
var over = someCanvas.getContext('2d');
30-
29+
var over = someCanvas.getContext('2d');
30+
3131
// Usually a canvas that is shown on the page
3232
var under = anotherCanvas.getContext('2d');
33-
33+
3434
// Blend all of 'over' onto 'under', starting at the upper left corner
3535
over.blendOnto(under,'screen');
36-
36+
3737
// Blend all of 'over' onto 'under' (again), starting at 17,42 in 'under'
3838
over.blendOnto(under,'multiply',{destX:17,destY:42});
39-
39+
4040
// Blend a 16x16 tile from 'over' onto 'under' (again), starting at 17,42 in 'under'
4141
over.blendOnto(under,'add',{destX:17,destY:42,sourceX:32,sourceY:128,width:16,height:16});
4242

@@ -46,7 +46,7 @@ Adobe® Photoshop® has a variety of helpful [blend modes](http://help.adobe.com
4646
The following blend modes work perfectly (or as nearly as the [vagaries of the HTML Canvas](http://stackoverflow.com/questions/4309364/why-does-html-canvas-getimagedata-not-return-the-exact-same-values-that-were-ju) allow):
4747

4848
* `normal` (or `src-over`)
49-
* `screen`
49+
* `screen`
5050
* `multiply`
5151
* `difference`
5252

@@ -85,18 +85,57 @@ These blend modes mostly work as intended, but have issues when it comes to deal
8585

8686
## Requirements/Browser Support
8787

88-
Tested on Safari v5.0, Chrome v8, and FF v3.6. Should work on any user agent that supplies a
89-
`CanvasRenderingContext2D` along with `getImageData` and `putImageData`.
88+
Should work on any user agent that supplies a `CanvasRenderingContext2D` along with `getImageData` and `putImageData`.
89+
90+
This includes using the [`node-canvas`](https://github.com/Automattic/node-canvas) library under [Node.js](http://nodejs.org).
9091

9192
## About
9293

9394
This library was created around the need solely for a one-off 'screen' blend mode to match the company-mandated style for bar graphs used internally, previously only available via a Microsoft® Excel® template. Clearly this functionality is useful in more contexts than just my one-off, so I decided to make a framework around it and encourage others to help figure out the formulae. Please, fork this project, add blend modes and/or fix math, and send me pull requests! I feel certain that the resources must exist out there on the equations Photoshop uses in the presence of alpha, but so far I have not found them.
9495

96+
### History
97+
98+
#### v1.3.0 - 2014-Nov-12
99+
+ Release as a Node.js module.
100+
+ Add blend modes: `softlight`, `luminosity`, `color`, `hue`, `saturation`, `lightercolor`, `darkercolor`.
101+
+ Greatly improve the accuracy of many blend modes.
102+
103+
_Great thanks to [Pixelero](http://pixelero.wordpress.com) for amazing contributions!_
104+
105+
#### v1.2.1 - 2011-Feb-9
106+
+ Improve perf of `lighten` and `darken` blend modes.
107+
108+
#### v1.2.0 - 2010-Dec-14
109+
+ Add blend modes: `hardlight`, `colordodge`, `colorburn`, `darken`, `lighten`, `exclusion`. _Thanks [gingerbeardman](https://github.com/gingerbeardman)!_
110+
111+
#### v1.1.1 - 2010-Dec-12
112+
+ Improve result of `overlay` blend mode.
113+
114+
#### v1.1.0 - 2010-Dec-6
115+
+ Added array `blendOnto.supportedBlendModes` for enumerating modes.
116+
+ Added object `blendOnto.supports` for testing if a mode is supported.
117+
+ Test for `getImageData()` to be present (prevent loading on excanvas).
118+
119+
#### v1.0 - 2010-Nov-30
120+
+ Initial working release.
121+
+ Supported blend modes: `normal`, `screen`, `multiply`, `difference`, `src-in`, `add`
122+
- Known broken: `overlay`, `dodge`
123+
124+
## Reference Material
125+
[PDF Blend Modes: Addendum (January 23, 2006)](http://www.adobe.com/content/dam/Adobe/en/devnet/pdf/pdfs/pdf_reference_archives/blend_modes.pdf) PDF
126+
[SVG Compositing 1.2, Part 1: Primer](http://dev.w3.org/SVG/modules/compositing/master/SVGCompositingPrimer.html)
127+
[Custom blend modes for Flash 10](http://www.lostinactionscript.com/blog/index.php/2009/05/26/custom-blend-modes-for-flash-10/) blog post
128+
[Blend Modes in Delphi](http://www.pegtop.net/delphi/articles/blendmodes/) blog post
129+
130+
### License
131+
132+
This library is released under an MIT-style license. That generally means that you are free to do almost anything you want with it as long as you give a bit of credit where credit is due. See the LICENSE file included for the actual legal limitations.s and/or fix math, and send me pull requests! I feel certain that the resources must exist out there on the equations Photoshop uses in the presence of alpha, but so far I have not found them.
133+
95134
## Reference Material
96-
[PDF Blend Modes: Addendum (January 23, 2006)](http://www.adobe.com/content/dam/Adobe/en/devnet/pdf/pdfs/pdf_reference_archives/blend_modes.pdf) PDF
97-
[SVG Compositing 1.2, Part 1: Primer](http://dev.w3.org/SVG/modules/compositing/master/SVGCompositingPrimer.html)
98-
[Custom blend modes for Flash 10](http://www.lostinactionscript.com/blog/index.php/2009/05/26/custom-blend-modes-for-flash-10/) blog post
99-
[Blend Modes in Delphi](http://www.pegtop.net/delphi/articles/blendmodes/) blog post
135+
[PDF Blend Modes: Addendum (January 23, 2006)](http://www.adobe.com/content/dam/Adobe/en/devnet/pdf/pdfs/pdf_reference_archives/blend_modes.pdf) PDF
136+
[SVG Compositing 1.2, Part 1: Primer](http://dev.w3.org/SVG/modules/compositing/master/SVGCompositingPrimer.html)
137+
[Custom blend modes for Flash 10](http://www.lostinactionscript.com/blog/index.php/2009/05/26/custom-blend-modes-for-flash-10/) blog post
138+
[Blend Modes in Delphi](http://www.pegtop.net/delphi/articles/blendmodes/) blog post
100139

101140
### License
102141

0 commit comments

Comments
 (0)