xfig-figure v0.0.1

Figure Layer

Factory to create figure layers.

Defines a figure layer generator and its associated methods. A figure layer serves as the foundation for additional graphical layers.

Installation

$ npm install xfig-figure

Usage

To create a new figure layer generator,

var Figure = require( 'xfig-figure' );

var figure = new Figure();

A layer generator has the following methods...

figure.create( selection )

This method creates a new figure layer. If a selection is provided, the method appends a figure element to the selection. Otherwise the figure is appended to a generic div element. To create a new figure layer,

// Append to the `document`:
figure.create();

// Append to a selection:
var selection = document.querySelector( '.selector' );

figure.create( selection );

figure.root()

This method returns the root DOMElement of the figure layer. To get the layer root,

figure.root();

figure.parent()

This method returns the parent DOMElement of the figure layer. If a selection was provided to figure.create(), the returned element will be the selection. To get the layer parent,

figure.parent();

figure.children()

This method returns the figure layer children. The children are returned in an object store. To get the layer children,

figure.children();

Note: initially, this is an empty object. As layers are appended to the figure layer, the children object is updated.

figure.config()

This method returns the figure configuration as a JSON blob. To get the layer configuration,

figure.config();

Note: initially this is an empty object. As layers are appended to the figure layer, the configuration object is updated to include all child configurations.

Examples

var Figure = require( 'xfig-figure' );

// Create a parent container:
var selection = document.createElement( 'div' );

selection.className += 'widget';

// Create a new figure instance:
var figure = new Figure();

// Append a figure layer to the selection:
figure.create( selection );

// Return the layer root:
console.log( figure.root() );

// Return the layer children:
console.log( figure.children() );

// Return the layer parent:
console.log( figure.parent() );

// Return the layer configuration:
console.log( figure.config() );

To run the example code from the top-level application directory,

$ node ./examples/index.js

Notes

WARNING: This package creates a document global variable.

Tests

Unit

Unit tests use the Mocha test framework with Chai assertions. To run the tests, execute the following command in the top-level application directory:

$ make test

All new feature development should have corresponding unit tests to validate correct functionality.

Test Coverage

This repository uses Istanbul as its code coverage tool. To generate a test coverage report, execute the following command in the top-level application directory:

$ make test-cov

Istanbul creates a ./reports/coverage directory. To access an HTML version of the report,

$ open reports/coverage/lcov-report/index.html

License

MIT license.

Copyright

Copyright © 2014. Athan Reines.