Provides a simple way of achieving FLIP style animations.
{ id : child -> String
, updateMsg : State -> Platform.Cmd.Cmd msg -> msg
, animateMsg : String -> Animation.Msg -> msg
, getBoundingClientRects : Json.Encode.Value -> Platform.Cmd.Cmd msg
, gotBoundingClientRects : (Json.Decode.Value -> msg) -> Platform.Sub.Sub msg
, spring : Animation.Spring.Presets.Spring
}
Configuration for the flip animation
{ config : Configuration child msg
, state : State
, children : List child
, childAttrs : child -> List (Html.Attribute msg)
, childElement : child -> List (Html.Attribute msg) -> List (Html msg) -> Html msg
, childContents : child -> List (Html msg)
}
Render configuration for the flip animation, including the overall config
Flip.render
{ config = flipConfig
, children = model.children
, state = model.flip
, childElement = always div
, childAttrs = always []
, childContents = .label >> text
}
Opaque type for the state of the animation
init : Configuration child msg -> List child -> ( State, Platform.Cmd.Cmd msg )
Init a fresh flip animation
render : RenderConfig child msg -> List (Html msg)
Render a flip animation.
More info on method and reasoning soon!
animate : Animation.Msg -> String -> State -> State
Update the position of an element in the flip animation
subscriptions : Configuration child msg -> State -> List child -> Platform.Sub.Sub msg
Flip subscriptions