Elm Architecture model structure

Elm Architecture Msg type

Initialize the number spinner with the number of decimal places, the minimum bound, maximum bound, current value and a converter function into your message type. Example

NumberSpinner.init
    -- two odecimal places
    2
    -- minimum value (inclusive)
    (Decimal.fromInt 0)
    -- maximum value (inclusive)
    (Decimal.fromInt 10)
    -- current value (inited from a string, which might fail because it's at runtime)
    (Maybe.withDefault (Decimal.fromInt 0) <| Decimal.fromString "1.23")
    -- convert to my custom SpinnerMessage
    SpinnerMessage

Elm Architecture update function

Elm architecture view function

Check if the incoming Msg actually mutates the decimal number value, or if it is just moving the cursor around, for example

Modify cursor position to move to the left, if possible (skipping "boundaries" between sign, integral and decimal places)

This is exposed mainly for the tests.

Modify cursor position to move to the right, if possible (skipping "boundaries" between sign, integral and decimal places)

This is exposed mainly for the tests.

Set current "digital number" value of the spinner

Get current decimal value of the spinner

Convert the decimal number to the approximate floating point value

A type signifying where the cursor currently is, and where it can move.

We use this class for the "cursor left" and "cursor right" motions in conjunction with the CursorPosition type (see below). We want to define cursor movement without regards to the current number displayed. For movement, we need the left and right bounds, which we store here.