wearsunscreen / gen-garden / GenGarden

A GenGarden displays an image generated from a draw function passed to it. Including settings will create sliders that well to change variables to the draw function.

Using GenGarden

init : Basics.Float -> List Slider -> Model

Initialize the GenGarden. The frameRate is the length of each animation frame in milliseconds. A frameRate of 0 or less will only update on setting changes. A slider will be created for each setting in list of settings. This example will create a GenGarden that updated once a second and has one settings slider.

mySliders =
[ { label = "Number of Columns and Rows"
  , max = 60
  , min = 1
  , step = 1
  , value = 10
  }
]
GenGarden.init 1000 mySliders

update : Msg -> Model -> ( Model, Platform.Cmd.Cmd Msg )

Updates the GenGarden model. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        GardenMsg gMsg ->
            let
                ( gModel, cmd ) =
                    GenGarden.update gMsg model.garden
            in
            ( { model | garden = gModel }
            , Cmd.batch
                [ Cmd.map GardenMsg cmd
                ]
            )

view : (Dict String Basics.Float -> Basics.Float -> List (Drawing Msg)) -> Model -> List (Html Msg)

Display the GenGarden. Provide the drawing function in drawFrame, and the GenGarden.Model in 'model`. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

view : Model -> Document Msg
view model =
    { title = "Gen Garden"
    , body =
        List.map (Html.map GardenMsg) <|
            GenGarden.view drawFrame model.garden
    }

subscriptions : Model -> Platform.Sub.Sub Msg

Set the subscriptions for GenGarden. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

subscriptions : Model -> Sub Msg
subscriptions model =
    Sub.batch
        [ Sub.map GardenMsg <| GenGarden.subscriptions model.garden
        ]


type alias Drawing msg =
Svg msg

Drawing functions return a Drawing.


type alias Model =
{ frame : Basics.Float
, frameRate : Basics.Float
, settings : Dict String Basics.Float
, sliders : List Slider_Model
, time : Time.Posix 
}

The model for the GenGarden. One must be included in the app's model.


type Msg

The Msg for the GenGarden used for timing frames drawing and slider interation. The app must define one of its Msg types to include a GenGarden.Msg. For example:

type Msg
    = GardenMsg GenGarden.Msg

Drawing in the GenGarden

circle : ( Basics.Float, Basics.Float ) -> Basics.Float -> String -> List (Html.Attribute msg) -> List (Drawing msg) -> Drawing msg

Draw a circle. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

drawFrame : List GenGarden.Slider -> Float -> List (GenGarden.Drawing msg)
drawFrame settings frame =
    GenGarden.circle ( -5, -5 ) 20 "red" [] []
        :: GenGarden.grid

ellipse : ( Basics.Float, Basics.Float ) -> Basics.Float -> Basics.Float -> String -> List (Html.Attribute msg) -> List (Drawing msg) -> Drawing msg

Draw an ellipse. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

drawFrame : List GenGarden.Slider -> Float -> List (GenGarden.Drawing msg)
drawFrame settings frame =
    GenGarden.ellipse ( -5, -5 ) 4 8 "red" [] []
        :: GenGarden.grid

grid : List (Drawing msg)

Draw the coordinate grid. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

drawFrame : List GenGarden.Slider -> Float -> List (GenGarden.Drawing msg)
drawFrame settings frame =
    GenGarden.circle ( -5, -5 ) 20 "red" [] []
        :: GenGarden.grid

line : ( Basics.Float, Basics.Float ) -> ( Basics.Float, Basics.Float ) -> String -> List (Html.Attribute msg) -> List (Drawing msg) -> Drawing msg

Draw a line. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

drawFrame : List GenGarden.Slider -> Float -> List (GenGarden.Drawing msg)
drawFrame settings frame =
    [ GenGarden.line ( -5, -5 ) ( 20, 15 ) "red" [] [] ]

rect : ( ( Basics.Float, Basics.Float ), ( Basics.Float, Basics.Float ) ) -> String -> List (Html.Attribute msg) -> List (Drawing msg) -> Drawing msg

Draw a rect. Example of usage:

type Msg
    = GardenMsg GenGarden.Msg

drawFrame : List GenGarden.Slider -> Float -> List (GenGarden.Drawing msg)
drawFrame settings frame =
    [ GenGarden.rect (( -5, -5 ) ( 20, 15 )) "red" [] [] ]

Slider


type alias Slider =
{ label : String
, max : Basics.Float
, min : Basics.Float
, step : Basics.Float
, value : Basics.Float 
}

The Slider record describes the values needing to display a slider. A list of Sliders must be passed to GenGarden.init. The label of the Slider will serve as the key to the dictionary of current values sent to the draw functions.