Implement SpacePath

[axelpale]

This one is needed to build tree and graph editors, like in Spacesite.

[axelpale]

Usage example:

var spa = new tapspace.SpacePath({
  outline: '2px solid black',
  path: <Path>
})
spa.setParent(g)

The constructor takes in a spacePathSpec literal. Property path allows only Path because IPath require the SpacePath to position in space but it does not yet have parent during construction.

Methods:

spa.getPath()
spa.setPath(<Path>)
spa.getOutline()
spa.setOutline(<string>)

[axelpale]

Problem: SpaceView does not yet understand how to draw SpacePaths and what to do when the path changes. We could hard code SpacePath rendering instructions into SpaceView like we have done with the other items. However, this does not carry us far. We have to find other solution.

Let us keep things simple. Let us be lazy but creative. All we need is a line. A black line from point A to point B. We can do that already. SpacePixel is the answer. See:

var a = space.at(100, 100)
var b = space.at(200, 150)
var line = new SpacePixel('black', space)
var width = a.distance(b).toSpace()
var height = 5
line.setSize(width, height)
line.translateScaleRotate(
  [line.atMidW(), line.atMidE()],
  [a, b]
)

Wrap this into a function and you are ready to go.