Line and its Parallel Line(s)

This example creates lines parallel to a reference, with an offset, and direction(clockwise/counter-clockwise).
Scenerio:
The two points for the reference line are checked to assure they are arranged CCW. If not, they are switched.
The red dot is the start of the referenced line.
Reference Line: x1= y1= x2= y2= Start Point: x= y=
CW: CCW: Lines: Offset:

SVG Source:
Javascript:
OK in:IE11/CH32/FF23