folkertdev/one-true-path-experiment/3.0.1

NOTE: this package is not compatible with Elm 0.19.1

LowLevel.Command

Low-level access to drawing instructions.

This is a low-level module that you probably shouldn't deal with. These instructions are meant to build up primitives (like in the Curve module); building of curves should happen at the SubPath level.

Threading State

type alias CursorState =
{ start : Vec2 Float
, cursor : Vec2 Float
, previousControlPoint : Maybe ( Float, Float )
}
  • start start of the subpath (most recent MoveTo)
  • cursor the current cursor position
  • previousControlPoint if the previous drawto instruction was a curveTo (cubic or quadratic), then this value stores Just its last control point position, else Nothing
updateCursorState : DrawTo -> CursorState -> CursorState

Simulate the effect of a drawto command on the cursor position

state : CursorState
state =
    { start = (0,0)
    , cursor = (10, 10)
    , previousControlPoint = Nothing
    }


updateCursorState (lineTo [(20, 10)]) state
    --> { start = (0,0), cursor = (20,10), previousControlPoint = Nothing }


updateCursorState (quadraticCurveTo [(( 15, 20), (20, 10))]) state
    --> { start = (0,0), cursor = (20,10), previousControlPoint = Just (15, 20) }

Moving the cursor

type MoveTo
= MoveTo (Vec2 Float)

Constructors for MoveTo instructions

moveTo : Vec2 Float -> MoveTo

Move to a position on the canvas without drawing.

Drawing on the canvas

Type

type DrawTo
= LineTo (List (Vec2 Float))
| Horizontal (List Float)
| Vertical (List Float)
| CurveTo (List ( Vec2 Float, Vec2 Float, Vec2 Float ))
| QuadraticBezierCurveTo (List ( Vec2 Float, Vec2 Float ))
| EllipticalArc (List EllipticalArcArgument)
| ClosePath

Constructors for DrawTo instructions

You may miss some constructs in comparison to SVG. Only absolute coordinates are supported, and the smooth curve variants are removed. These choices were made to keep the number of constructors small.

Relative coordinates can always be transformed to abslute ones, and smooth (also known as short-hand) curve extensions can be achieved with Curve.smoothQuadraticBezier and Curve.smoothCubicBezier.

Straight lines

lineTo : List (Vec2 Float) -> DrawTo

Draw a series of line segments to absolute positions. The L instruction.

horizontalTo : List Float -> DrawTo

Specific version of lineTo that only moves horizontally. The H instruction.

verticalTo : List Float -> DrawTo

Specific version of lineTo that only moves vertically. The V instruction

Close Path

closePath : DrawTo

Draw a straight line from the cursor position to the starting position of the path. The Z instruction.

Beziers

quadraticCurveTo : List ( Vec2 Float, Vec2 Float ) -> DrawTo

A quadratic bezier. The Q instruction.

cubicCurveTo : List ( Vec2 Float, Vec2 Float, Vec2 Float ) -> DrawTo

A cubic bezier. The C instruction.

Arcs

arcTo : List EllipticalArcArgument -> DrawTo

An elliptical arc. The A instruction.

{ radii : ( Float, Float )
, xAxisRotate : Float
, arcFlag : ArcFlag
, direction : Direction
, target : Vec2 Float
}

The arguments for an Arc

argument : EllipticalArcArgument
argument =
    { start = ( 0, 42 )
    , end = ( 42, 0 )
    , radii = ( 1, 1 )
    , xAxisRotate = 90
    , arcFlag = largestArc
    , direction = clockwise
    }

The xAxisRotate parameter is in degrees (note that in the Segment module, it is in radians).

clockwise : Direction

Corresponds to a sweep flag of 0

counterClockwise : Direction

Corresponds to a sweep flag of 1

largestArc : ArcFlag

Corresponds to an arc flag of 1 thDefault

smallestArc : ArcFlag

Corresponds to an arc flag of 0

type alias ArcFlag =
ArcFlag

Determine which arc to draw

type alias Direction =
Direction

Determine which arc to draw

Conversion

merge : DrawTo -> DrawTo -> Result ( DrawTo, DrawTo ) DrawTo

Merge adjacent commands if possible

merge (lineTo [ (0,0) ]) (lineTo [ (10, 10) ]) --> Ok (lineTo [ (0,0) , (10, 10) ])


merge (lineTo [ (0,0) ]) closePath --> Err (lineTo [ (0,0) ], closePath)
fromLowLevelMoveTo : MoveTo -> CursorState -> ( CursorState, MoveTo )
fromLowLevelDrawTos : List DrawTo -> CursorState -> ( CursorState, List DrawTo )
fromLowLevelDrawTo : DrawTo -> CursorState -> Maybe ( DrawTo, CursorState )
toLowLevelDrawTo : DrawTo -> DrawTo

Convert a one-true-path drawto to a svg-path-lowlevel drawto. Used in conversion to string

toLowLevelMoveTo : MoveTo -> MoveTo

Convert a one-true-path moveto to a svg-path-lowlevel moveto. Used in conversion to string

mapCoordinateDrawTo : (Vec2 Float -> Vec2 Float) -> DrawTo -> DrawTo

Transform the coordinates in a drawto