A general purpose PSD parser written in Coffeescript. Based off of [PSD.rb](https://github.com/layervault/psd.rb).
Runs in both NodeJS and the browser (using browserify). There are still some pieces missing that are present in PSD.rb, such as layer comp filtering, layer image exporting, a built-in renderer, and many layer info blocks. The eventual goal is full feature parity with PSD.rb.
A general purpose PSD parser written in Coffeescript. Based off of [PSD.rb](https://github.com/layervault/psd.rb). It allows you to work with a Photoshop document in a manageable tree structure and find out important data such as:
* Document structure
* Document size
* Layer/folder size + positioning
* Layer/folder names
* Layer/folder visibility and opacity
* Font data (via [psd-enginedata](https://github.com/layervault/psd-enginedata))
* Text area contents
* Font names, sizes, and colors
* Color mode and bit-depth
* Vector mask data
* Flattened image data
* Layer comps
Runs in both NodeJS and the browser (using browserify). There are still some pieces missing that are present in PSD.rb, such as layer comp filtering, a built-in renderer, and many layer info blocks. The eventual goal is full feature parity with PSD.rb.
## Installation
PSD.js has no native dependencies. Simply add `psd` to your package.json or run `npm install psd`.
## Basic Usage
## Usage
PSD.js works almost exactly the same in the browser and NodeJS.
To access the document as a tree structure, use `psd.tree()` to get the root node. From there, work with the tree using any of these methods:
*`root()`: get the root node from anywhere in the tree
*`isRoot()`: is this the root node?
*`children()`: get all immediate children of the node
*`hasChildren()`: does this node have any children?
*`childless()`: opposite of `hasChildren()`
*`ancestors()`: get all ancestors in the path of this node (excluding the root)
*`siblings()`: get all sibling tree nodes including the current one (e.g. all layers in a folder)
*`nextSibling()`: gets the sibling immediately following the current node
*`prevSibling()`: gets the sibling immediately before the current node
*`hasSiblings()`: does this node have any siblings?
*`onlyChild()`: opposite of `hasSiblings()`
*`descendants()`: get all descendant nodes not including the current one
*`subtree()`: same as descendants but starts with the current node
*`depth()`: calculate the depth of the current node (root node is 0)
*`path()`: gets the path to the current node
If you know the path to a group or layer within the tree, you can search by that path. Note that this always returns an Array because layer/group names do not have to be unique. The search is always scoped to the descendants of the current node, as well.
``` js
psd.tree().childrenAtPath('Version A/Matte');
psd.tree().childrenAtPath(['Version A','Matte']);
```
### Accessing Layer Data
To get data such as the name or dimensions of a layer:
``` js
node=psd.tree().descendants()[0];
node.get('name');
node.get('width');
```
PSD files also store various pieces of information in "layer info" blocks. See [this file](https://github.com/meltingice/psd.js/blob/master/lib/psd/layer/info.coffee) for all of the possible layer info blocks that PSD.js parses (in `LAYER_INFO`). Which blocks a layer has varies from layer-to-layer, but to access them you can do:
``` js
node=psd.tree().descendants()[0]
node.get('typeTool').export()
node.get('vectorMask').export()
```
### Exporting Data
When working with the tree structure, you can recursively export any node to an object. This does not dump *everything*, but it does include the most commonly accessed information.
``` js
console.log(psd.tree().export());
```
Which produces something like:
``` js
{children:
[{type:'group',
visible:false,
opacity:1,
blendingMode:'normal',
name:'Version D',
left:0,
right:900,
top:0,
bottom:600,
height:600,
width:900,
children:
[{type:'layer',
visible:true,
opacity:1,
blendingMode:'normal',
name:'Make a change and save.',
left:275,
right:636,
top:435,
bottom:466,
height:31,
width:361,
mask:{},
text:
{value:'Make a change and save.',
font:'HelveticaNeue-Light',
left:0,
top:0,
right:0,
bottom:0,
transform:{xx:1,xy:0,yx:0,yy:1,tx:456,ty:459}},
image:{}}]}],
document:
{width:900,
height:600,
resources:
{layerComps:
[{id:692243163,name:'Version A',capturedInfo:1},
{id:725235304,name:'Version B',capturedInfo:1},
{id:730932877,name:'Version C',capturedInfo:1}],
guides:[],
slices:[]}}}
```
You can also export the PSD to a flattened image. Please note that, at this time, not all image modes + depths are supported.
This uses the full rasterized preview provided by Photoshop. If the file was not saved with Compatibility Mode enabled, this will return an empty image.
