PaackEng / elm-alert-beta / Alert

This module implement bootstrap alerts

As this project uses bootstrap look and feel, you have to use the bootstrap

-- See an example:

type alias Model =
    { alerts : Alert.State }

type Msg
    = ShowAlert
    | AlertMsg Alert.Msg

view : Model -> Html Msg
view model =
    div []
        [ button [ onClick ShowAlert, class "btn btn-success" ] [ text "Hit me!" ]
        , Html.map AlertMsg (Alert.view model.alerts)
        ]

update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        ShowAlert ->
            let
                ( alerts, cmd ) =
                    Alert.success "Hello, nice to meet you!" model.alerts
            in
            ( { model | alerts = alerts }
            , Cmd.map AlertMsg cmd
            )

        AlertMsg subMsg ->
            let
                ( alerts, cmd ) =
                    Alert.update subMsg model.alerts
            in
            ( { model | alerts = alerts }
            , Cmd.map AlertMsg cmd
            )

main : Program Never Model Msg
main =
    Html.program
        { init =
            ( { alerts = Alert.initState }
            , Cmd.none
            )
        , view = view
        , update = update
        , subscriptions = always Sub.none
        }


type State

This is an opaque type

initState : State

Function that ueturns the initial state, as we are using opaque types you dun't access to the internal values

view : State -> Html Msg

View


type Msg

Don't touch!

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

Update function

success : String -> State -> ( State, Platform.Cmd.Cmd Msg )

Success alert ( the green one :o )

warning : String -> State -> ( State, Platform.Cmd.Cmd Msg )

Warning alert ( the yellow one :o )

error : String -> State -> ( State, Platform.Cmd.Cmd Msg )

Error alert ( the red one :o )