Hey...

This can be used to point out things in a fancy user interface!

That's what we use it for.

lines is derived from raphael.js' graffle.js. What lines does is set the style of the element with the ID of "lines" to be absolutely positioned and with a z-index of -1, creating a raphael generated svg layer behind your front-end layout. In that svg layer, a line is drawn between two selected element. It works by calling the lines function. The following is a example:

in your html

in your javascript

var boxOne = Y.one('#box1');
var boxTwo = Y.one('#box2');

lines(boxOne, boxTwo);

Dependencies

TO DO

1. Fix any issues.
2. Create a branch for the jQuery masses.
3. Add more arugments to the lines function to allow specification of which side the line connects to.
4. Online example with dragging and spawning lined elements.
5. Create node.js module branch with YUI.node and/or jQuery.node.
6. Determine if using raphael.js is nessesary for lines and if not, replace it with pure svg.
7. Further field testing & feedback.

Thank You for checking lines out.